UI

src/views/pointDetails.vue

@@ -1,47 +1,50 @@
 <template>
   <div class="visual-con">
-    <el-dialog title="站点详情" :visible.sync="pointDetailsVisible" customClass="customWidth" v-if="pointDetailsVisible">
-      <div><span>名称:{{retMap.name}}</span></div>
-      <div><span>地址:{{retMap.address}}</span></div>
-      <div><span>注册登记机关:{{retMap.registration_authority}}</span></div>
-      <div><span>注册时间:{{retMap.register_date}}</span></div>
-      <div><span>注册资金:{{retMap.legal_person}}</span></div>
-      <div><span>法人姓名:{{retMap.phone}}</span></div>
-      <div><span>联系电话:{{retMap.members_num}}</span></div>
-      <div><span>所属部门:{{retMap.dept_name}}</span></div>
-      <div><span>地址坐标:{{retMap.longitude}},{{retMap.latitude}}</span></div>
+    <el-dialog title="站点详情" :visible.sync="pointDetailsVisible" width="50rem" v-if="pointDetailsVisible">
+			
+		<div class="text-con">
+      <div><i class="ismall"></i><span>名称:{{retMap.name}}</span></div>
+      <div><i class="ismall"></i><span>地址:{{retMap.address}}</span></div>
+      <div><i class="ismall"></i><span>注册登记机关:{{retMap.registration_authority}}</span></div>
+      <div><i class="ismall"></i><span>注册时间:{{retMap.register_date}}</span></div>
+      <div><i class="ismall"></i><span>注册资金:{{retMap.legal_person}}</span></div>
+      <div><i class="ismall"></i><span>法人姓名:{{retMap.phone}}</span></div>
+      <div><i class="ismall"></i><span>联系电话:{{retMap.members_num}}</span></div>
+      <div><i class="ismall"></i><span>所属部门:{{retMap.dept_name}}</span></div>
+      <div><i class="ismall"></i><span>地址坐标:{{retMap.longitude}},{{retMap.latitude}}</span></div>
       <div v-if="type=='hezuoshe'">
-        <div><span>租用年限:{{retMap.Lease_term}}</span></div>
-        <div><span v-for="dict in dict.type.task_source" v-if="dict.value == retMap.hzs_type">合作社类型:{{dict.label}}</span></div>
-        <div><span>成员人数:{{retMap.members_num}}</span></div>
-        <div><span>带动农民数:{{retMap.driven_farmers_num}}</span></div>
-        <div><span>征地地址:{{retMap.land_address}}</span></div>
+        <div><i class="ismall"></i><span>租用年限:{{retMap.Lease_term}}</span></div>
+        <div><i class="ismall"></i><span v-for="dict in dict.type.task_source" v-if="dict.value == retMap.hzs_type">合作社类型:{{dict.label}}</span></div>
+        <div><i class="ismall"></i><span>成员人数:{{retMap.members_num}}</span></div>
+        <div><i class="ismall"></i><span>带动农民数:{{retMap.driven_farmers_num}}</span></div>
+        <div><i class="ismall"></i><span>征地地址:{{retMap.land_address}}</span></div>
       </div>
       <div v-if="type=='nongji'">
-        <div><span>经费来源:{{retMap.land_use_mode}}</span></div>
-        <div><span>举办单位:{{retMap.Lease_term}}</span></div>
-        <div><span>从业人数:{{retMap.members_num}}</span></div>
+        <div><i class="ismall"></i><span>经费来源:{{retMap.land_use_mode}}</span></div>
+        <div><i class="ismall"></i><span>举办单位:{{retMap.Lease_term}}</span></div>
+        <div><i class="ismall"></i><span>从业人数:{{retMap.members_num}}</span></div>
       </div>
       <div v-if="type=='xubao'">
-        <div><span>经费来源:{{retMap.land_use_mode}}</span></div>
-        <div><span>举办单位:{{retMap.lease_term}}</span></div>
-        <div><span>从业人数:{{retMap.members_num}}</span></div>
+        <div><i class="ismall"></i><span>经费来源:{{retMap.land_use_mode}}</span></div>
+        <div><i class="ismall"></i><span>举办单位:{{retMap.lease_term}}</span></div>
+        <div><i class="ismall"></i><span>从业人数:{{retMap.members_num}}</span></div>
       </div>
       <div v-if="type=='yangzhi'">
-        <div><span v-for="dict in dict.type.farm_farmer_type" v-if="dict.value == retMap.breeder_type">养殖户类型:{{dict.label}}</span></div>
-        <div><span v-for="dict in dict.type.farm_breed_type" v-if="dict.value == retMap.type">养殖类型:{{dict.label}}</span></div>
-        <div><span>养殖品种:{{retMap.varieties}}</span></div>
-        <div><span>养殖数量:{{retMap.quantity}}</span></div>
-        <div><span>粪污处理占地面积:{{retMap.excrement_area}}㎡</span></div>
-        <div><span>粪污处理产物:{{retMap.excrement_product}}</span></div>
-        <div><span>粪污处理说明:{{retMap.excrement_explain}}</span></div>
+        <div><i class="ismall"></i><span v-for="dict in dict.type.farm_farmer_type" v-if="dict.value == retMap.breeder_type">养殖户类型:{{dict.label}}</span></div>
+        <div><i class="ismall"></i><span v-for="dict in dict.type.farm_breed_type" v-if="dict.value == retMap.type">养殖类型:{{dict.label}}</span></div>
+        <div><i class="ismall"></i><span>养殖品种:{{retMap.varieties}}</span></div>
+        <div><i class="ismall"></i><span>养殖数量:{{retMap.quantity}}</span></div>
+        <div><i class="ismall"></i><span>粪污处理占地面积:{{retMap.excrement_area}}㎡</span></div>
+        <div><i class="ismall"></i><span>粪污处理产物:{{retMap.excrement_product}}</span></div>
+        <div><i class="ismall"></i><span>粪污处理说明:{{retMap.excrement_explain}}</span></div>
       </div>
       <div v-if="type=='zhibao'">
-        <div><span>经费来源:{{retMap.land_use_mode}}</span></div>
-        <div><span>举办单位:{{retMap.Lease_term}}</span></div>
-        <div><span>从业人数:{{retMap.members_num}}</span></div>
+        <div><i class="ismall"></i><span>经费来源:{{retMap.land_use_mode}}</span></div>
+        <div><i class="ismall"></i><span>举办单位:{{retMap.Lease_term}}</span></div>
+        <div><i class="ismall"></i><span>从业人数:{{retMap.members_num}}</span></div>
       </div>
-      <div><span>备注信息:{{retMap.remarks}}</span></div>
+      <div><i class="ismall"></i><span>备注信息:{{retMap.remarks}}</span></div>
+			</div>
     </el-dialog>
   </div>
 
@@ -73,7 +76,19 @@ export default {
 }
 
 </script>
+<style rel="stylesheet/scss" lang="scss" scoped>
+@import '@/assets/styles/base.scss';
 
-<style scoped>
-
+.text-con{
+	color: #ba8a2a;
+	line-height: 40px;
+	padding:0 .5rem;
+}
+.ismall{
+	    width: 0.5rem;
+	    height: 0.5rem;
+	    display: inline-block;
+	    background: #eb9e23;
+		margin-right: .3rem;
+}
 </style>