add：图片预览问题

src/_check_info.html

@@ -135,11 +135,12 @@
                 <van-cell>
                   <span class="">隐患图片:</span>
                   <div>
-                    <ImagePreview
+                    <img
                       v-for="(imgItem, subIndex) in item.hiddenImageUrlList"
                       :src="imgItem"
                       alt=""
                       style="width: 1.2rem; height: 1.2rem; margin-right: 0.2rem"
+                      @click="showImage(item.hiddenImageUrlList,subIndex)"
                     />
                   </div>
                 </van-cell>
@@ -148,11 +149,12 @@
                 <van-cell
                   ><span class="">整改情况:</span>
                   <div>
-                    <ImagePreview
+                    <img
                       v-for="(imgItem, subIndex) in item.rectificationImageUrlList"
                       :src="imgItem"
                       alt=""
                       style="width: 1.2rem; height: 1.2rem; margin-right: 0.2rem"
+                      @click="showImage(item.rectificationImageUrlList,subIndex)"
                     />
                   </div>
                 </van-cell>

src/_check_info.js

@@ -24,7 +24,7 @@
 
 var VUE = null
 
-window.onload = function() {
+window.onload = function () {
 	function countSelectedNo(result) {
 		// 获取 checkList 中 selected 为 'no' 的对象个数
 		return result.reduce((total, category) => {
@@ -46,9 +46,10 @@ window.onload = function() {
 			)
 		}, 0)
 	}
-
 	VUE = new Vue({
 		el: '#app',
+		components: {
+		},
 		data: {
 			userType: gemhoUtil.getCookie('userType'),
 			id: '', // 记录id || 隐患id
@@ -102,7 +103,7 @@ window.onload = function() {
 		watch: {
 			checkData: {
 				handler(newVal) {
-					if(this.flag != 'ADD' && this.flag != 'JC_XQ'){
+					if (this.flag != 'ADD' && this.flag != 'JC_XQ') {
 						return
 					}
 					const snapshot = JSON.parse(JSON.stringify(newVal));
@@ -115,21 +116,21 @@ window.onload = function() {
 			}
 		},
 		methods: {
-			validRequired(){
-				if(this.flag == 'JC_XQ'){ // 检查详情，不参与下一页校验
+			validRequired() {
+				if (this.flag == 'JC_XQ') { // 检查详情，不参与下一页校验
 					this.checkPageIndex++;
 					return true
 				}
 				const currentPageData = this.checkData[this.checkPageIndex];
-				const errorRows = currentPageData.gqCheckItemList.filter((item)=>{
+				const errorRows = currentPageData.gqCheckItemList.filter((item) => {
 					console.log(item)
-					if(item.itemAnswer === 2){
+					if (item.itemAnswer === 2) {
 						return !item.description || !item.photos?.length || !item.deadlineDays
 					}
 					return false
 				})
 				console.log('errorRows.length', errorRows.length)
-				if(errorRows.length){
+				if (errorRows.length) {
 					vant.Dialog.alert({
 						title: '信息提示',
 						message: '请填写完整信息，必填项不可为空',
@@ -405,6 +406,13 @@ window.onload = function() {
 			// 		gemhoUtil.navigatePage(this.pageName + '.html', '操作完成,跳转中...')
 			// 	})
 			// },
+			showImage(list, index) {
+				vant.ImagePreview({
+					images: list,
+					startPosition: index,
+					closeable: true,
+				});
+			},
 			add4DSH_XQ(auditStatus) { // 隐患详情 审核通过或拒绝
 				vant.Toast.loading({
 					message: '正在处理...',

src/_shanghu_detail-edit.html

@@ -48,79 +48,115 @@
           <!-- <van-tab title="培训演练"></van-tab> -->
         </van-tabs>
 
-
-         
-
-       
         <!-- form开始 -->
-				<div class="form-container" v-if="activeTab==0">
+        <div
+          class="form-container"
+          v-if="activeTab==0"
+        >
           <div class="form-item">
-						<span class="form-label van-cell--required">商家名称</span>
+            <span class="form-label">商家名称</span>
             <div class="form-input-wrap">
-							<input type="text" v-model="formData.unitName" class="form-input" :disabled="flag=='XQ'">
+              <input
+                type="text"
+                v-model="formData.unitName"
+                class="form-input"
+                :disabled="flag=='XQ'"
+              />
             </div>
           </div>
 
           <div class="form-item">
-						<span class="form-label van-cell--required">负责人</span>
+            <span class="form-label">负责人</span>
             <div class="form-input-wrap">
-							<input type="text" v-model="formData.merchantName" class="form-input" :disabled="flag=='XQ'"
-								>
+              <input
+                type="text"
+                v-model="formData.owner"
+                class="form-input"
+                :disabled="flag=='XQ'"
+              />
             </div>
           </div>
 
           <div class="form-item">
             <span class="form-label">电话</span>
             <div class="form-input-wrap">
-							<input type="text" v-model="formData.merchantPhone" class="form-input"
-								:disabled="flag=='XQ'">
+              <input
+                type="text"
+                v-model="formData.merchantPhone"
+                class="form-input"
+                :disabled="flag=='XQ'"
+              />
             </div>
           </div>
 
           <div class="form-item">
             <span class="form-label">地址</span>
             <div class="form-input-wrap">
-							<input type="text" v-model="formData.businessAddress" v-model="formData.merchantPhone"
-								class="form-input" :disabled="flag=='XQ'">
+              <input
+                type="text"
+                v-model="formData.businessAddress"
+                v-model="formData.merchantPhone"
+                class="form-input"
+                :disabled="flag=='XQ'"
+              />
             </div>
           </div>
 
-					
           <!-- 新增字段  -->
           <div class="form-item">
-						<span class="form-label van-cell--required">所属社区</span>
+            <span class="form-label">所属社区</span>
             <div class="form-input-wrap">
-							<select class="selector" v-model="formData.deptId"
-							 :disabled="flag=='XQ'">
+              <select
+                class="selector"
+                v-model="formData.community"
+                :disabled="flag=='XQ'"
+              >
                 <option
                   v-for="(item, i) in dict4community"
                   :key="i"
                   :label="item.label"
-									:value="item.id"
+                  :value="item.label"
                 ></option>
               </select>
             </div>
           </div>
 
-					<div class="form-item" v-if="flag=='XQ'"> 
+          <div
+            class="form-item"
+            v-if="flag=='XQ'"
+          >
             <span class="form-label">网格员</span>
             <div class="form-input-wrap">
-							<input type="text" v-model="formData.gridMemberName" class="form-input" :disabled="flag=='XQ'"
-								>
+              <input
+                type="text"
+                v-model="formData.gridMemberName"
+                class="form-input"
+                :disabled="flag=='XQ'"
+              />
             </div>
           </div>
-					<div class="form-item" v-if="flag=='XQ'">
+          <div
+            class="form-item"
+            v-if="flag=='XQ'"
+          >
             <span class="form-label">联系方式</span>
             <div class="form-input-wrap">
-							<input type="text" v-model="formData.gridMemberPhone" class="form-input" :disabled="flag=='XQ'"
-								>
+              <input
+                type="text"
+                v-model="formData.gridMemberPhone"
+                class="form-input"
+                :disabled="flag=='XQ'"
+              />
             </div>
           </div>
           <div class="form-item">
             <span class="form-label">生产经营类型</span>
             <div class="form-input-wrap">
-							<select class="selector" v-model="formData.businessType"
-							 :disabled="flag=='XQ'">
+              <select
+                class="selector"
+                v-model="formData.businessType"
+                :disabled="flag=='XQ'"
+              >
                 <option
                   v-for="(item, i) in dict4businessType"
                   :key="i"
@@ -131,10 +167,13 @@
             </div>
           </div>
           <div class="form-item">
-						<span class="form-label van-cell--required">行业类型</span>
+            <span class="form-label">行业类型</span>
             <div class="form-input-wrap">
-							<select class="selector" v-model="formData.industryType"
-							 :disabled="flag=='XQ'" @change="handleIndustryChange">
+              <select
+                class="selector"
+                v-model="formData.industryType"
+                :disabled="flag=='XQ'"
+              >
                 <option
                   v-for="(item, i) in dict4industryType"
                   :key="i"
@@ -145,25 +184,35 @@
             </div>
           </div>
           <!-- 特殊处理：编辑没有详情有 -->
-					<div class="form-item" v-if="flag=='XQ'">
+          <div
+            class="form-item"
+            v-if="flag=='XQ'"
+          >
             <span class="form-label">行业主管</span>
             <div class="form-input-wrap">
-							{{ formData.industryDeptName }}
-							<!-- <input type="text" v-model="formData.industryDeptName" class="form-input" :disabled="flag=='XQ'"> -->
+              <input
+                type="text"
+                v-model="formData.industryType"
+                class="form-input"
+                :disabled="flag=='XQ'"
+              />
             </div>
           </div>
 
-					
           <div class="form-item">
             <span class="form-label">场所类型</span>
             <div class="form-input-wrap">
-							<select class="selector" name="" v-model="formData.smallPlaceTypeId"
-							  :disabled="flag=='XQ'">
+              <select
+                class="selector"
+                name=""
+                v-model="formData.smallPlaceTypeId"
+                :disabled="flag=='XQ'"
+              >
                 <option
                   v-for="(item, i) in dict4changhsuoType"
                   :key="i"
-									:label="item.categoryName"
-									:value="item.id"
+                  :label="item.dictLabel"
+                  :value="Number(item.dictValue)"
                 ></option>
               </select>
             </div>
@@ -182,11 +231,12 @@
               />
             </div>
             <div v-if="flag=='XQ'">
-					    <ImagePreview
+              <img
                 v-for="(imgItem, subIndex) in formData.floorPlanPhotos"
                 :src="imgItem"
                 alt=""
                 style="width: 1.2rem; height: 1.2rem; margin-right: 0.2rem"
+                @click="showImage(formData.floorPlanPhotos,subIndex)"
               />
             </div>
           </div>
@@ -204,11 +254,12 @@
               />
             </div>
             <div v-if="flag=='XQ'">
-					    <ImagePreview
+              <img
                 v-for="(imgItem, subIndex) in formData.businessLicensePhotos"
                 :src="imgItem"
                 alt=""
                 style="width: 1.2rem; height: 1.2rem; margin-right: 0.2rem"
+                @click="showImage(formData.businessLicensePhotos,subIndex)"
               />
             </div>
           </div>
@@ -227,86 +278,138 @@
               />
             </div>
             <div v-if="flag=='XQ'">
-					    <ImagePreview
+              <img
                 v-for="(imgItem, subIndex) in formData.storefrontPhotos"
                 :src="imgItem"
                 alt=""
                 style="width: 1.2rem; height: 1.2rem; margin-right: 0.2rem"
+                @click="showImage(formData.storefrontPhotos,subIndex)"
               />
             </div>
           </div>
 
-					
-					<button v-if="flag=='XG'" class="save-btn" style="margin-left: 50%; transform: translateX(-50%);" @click="save"
-						>保存</button>
+          <button
+            v-if="flag=='XG'"
+            class="save-btn"
+            style="margin-left: 50%; transform: translateX(-50%)"
+            @click="save"
+          >
+            保存
+          </button>
           <div>
-						<h5 class="imager-item-title" style="border: none;">
+            <h5
+              class="imager-item-title"
+              style="border: none"
+            >
               <span>安全二维码</span>
               <span></span>
             </h5>
             <div>
-							<img :src="formData.qrCodeUrl" style="margin-left: 50%; transform: translateX(-50%);" />
+              <img
+                :src="formData.qrCodeUrl"
+                style="margin-left: 50%; transform: translateX(-50%)"
+                @click="showImage(formData.storefrontPhotos)"
+              />
             </div>
           </div>
-					<button v-if="userType==='shop'" class="save-btn" style="margin-left: 50%; transform: translateX(-50%);" @click="saveCanvas"
-						>保存二维码</button>
+          <button
+            v-if="userType==='shop'"
+            class="save-btn"
+            style="margin-left: 50%; transform: translateX(-50%)"
+            @click="saveCanvas"
+          >
+            保存二维码
+          </button>
         </div>
         <!-- form结束 -->
 
         <!-- 经营信息开始 -->
-				<div class="form-container" v-if="activeTab==1">
+        <div
+          class="form-container"
+          v-if="activeTab==1"
+        >
           <div class="form-item">
             <span class="form-label">建筑面积(㎡)</span>
             <div class="form-input-wrap">
-							<input type="text" v-model="formData.area" class="form-input" :disabled="flag=='XQ'">
+              <input
+                type="text"
+                v-model="formData.area"
+                class="form-input"
+                :disabled="flag=='XQ'"
+              />
             </div>
           </div>
 
           <div class="form-item">
             <span class="form-label">建筑结构</span>
             <div class="form-input-wrap">
-							<input type="text" v-model="formData.buildingStructure" class="form-input" :disabled="flag=='XQ'"
-								>
+              <input
+                type="text"
+                v-model="formData.buildingStructure"
+                class="form-input"
+                :disabled="flag=='XQ'"
+              />
             </div>
           </div>
 
           <div class="form-item">
             <span class="form-label">产权人</span>
             <div class="form-input-wrap">
-							<input type="text" v-model="formData.owner" class="form-input"
-								:disabled="flag=='XQ'">
+              <input
+                type="text"
+                v-model="formData.owner"
+                class="form-input"
+                :disabled="flag=='XQ'"
+              />
             </div>
           </div>
 
           <div class="form-item">
             <span class="form-label">联系方式</span>
             <div class="form-input-wrap">
-							<input type="text" v-model="formData.ownerPhone" v-model="formData.merchantPhone"
-								class="form-input" :disabled="flag=='XQ'">
+              <input
+                type="text"
+                v-model="formData.ownerPhone"
+                v-model="formData.merchantPhone"
+                class="form-input"
+                :disabled="flag=='XQ'"
+              />
             </div>
           </div>
 
           <div class="form-item">
             <span class="form-label">经营人</span>
             <div class="form-input-wrap">
-							<input type="text" v-model="formData.operator" v-model="formData.merchantPhone"
-								class="form-input" :disabled="flag=='XQ'">
+              <input
+                type="text"
+                v-model="formData.operator"
+                v-model="formData.merchantPhone"
+                class="form-input"
+                :disabled="flag=='XQ'"
+              />
             </div>
           </div>
           <!-- 新增字段  -->
           <div class="form-item">
             <span class="form-label">联系方式</span>
             <div class="form-input-wrap">
-							<input type="text" v-model="formData.operatorPhone" class="form-input" :disabled="flag=='XQ'"
-								>
+              <input
+                type="text"
+                v-model="formData.operatorPhone"
+                class="form-input"
+                :disabled="flag=='XQ'"
+              />
             </div>
           </div>
 
           <div class="form-item">
             <span class="form-label">房屋类型</span>
             <div class="form-input-wrap">
-							<select class="selector" v-model="formData.houseType"
-							 :disabled="flag=='XQ'">
+              <select
+                class="selector"
+                v-model="formData.houseType"
+                :disabled="flag=='XQ'"
+              >
                 <option
                   v-for="(item, i) in dict4fangwuType"
                   :key="i"
@@ -319,8 +422,11 @@
           <div class="form-item">
             <span class="form-label">房屋用途</span>
             <div class="form-input-wrap">
-								<select class="selector" v-model="formData.houseUsage"
-								 :disabled="flag=='XQ'">
+              <select
+                class="selector"
+                v-model="formData.houseUsage"
+                :disabled="flag=='XQ'"
+              >
                 <option
                   v-for="(item, i) in dict4fangwuyongtuType"
                   :key="i"
@@ -333,40 +439,49 @@
           <div class="form-item">
             <span class="form-label">房东姓名</span>
             <div class="form-input-wrap">
-							<input type="text" v-model="formData.landlordName" class="form-input" :disabled="flag=='XQ'"
-								>
+              <input
+                type="text"
+                v-model="formData.landlordName"
+                class="form-input"
+                :disabled="flag=='XQ'"
+              />
             </div>
           </div>
           <div class="form-item">
             <span class="form-label">联系方式</span>
             <div class="form-input-wrap">
-							<input type="text" v-model="formData.landlordContact" class="form-input" :disabled="flag=='XQ'"
-								>
+              <input
+                type="text"
+                v-model="formData.landlordContact"
+                class="form-input"
+                :disabled="flag=='XQ'"
+              />
             </div>
           </div>
-					<button v-if="flag=='XG'" class="save-btn" style="margin-left: 50%; transform: translateX(-50%);" @click="save"
-						>保存</button>
+          <button
+            v-if="flag=='XG'"
+            class="save-btn"
+            style="margin-left: 50%; transform: translateX(-50%)"
+            @click="save"
+          >
+            保存
+          </button>
         </div>
         <!-- form结束 -->
 
         <!-- 消费者安全建议列表 -->
         <div v-if="activeTab==2">
           <van-list>
-						<van-cell v-for="(item, index) in consumerSuggestList" :key="item.id" @click="viewDetail(item)" >
-							<div style="width: 100%;">
-								<div style="display: flex; justify-content: space-between; margin: 8px 0;">
-									<span style="color: #737373; font-size: 0.28rem;">日期：{{ item.submitDate }}</span>
-								</div>
-								<div style="
-									white-space: nowrap;
-									overflow: hidden;
-									text-overflow: ellipsis;
-									color: #333;
-									font-size: 0.3rem;
-									font-weight: bold;
-									font-family: PingFang SC;
-									">{{item.contactDetails}}
+            <van-cell
+              v-for="(item, index) in consumerSuggestList"
+              :key="item.id"
+              @click="viewDetail(item)"
+            >
+              <div style="width: 100%">
+                <div style="display: flex; justify-content: space-between; margin: 8px 0">
+                  <span style="color: #737373; font-size: 0.28rem">日期：{{ item.submitDate }}</span>
                 </div>
+                <div style="white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: #333; font-size: 0.3rem; font-weight: bold; font-family: PingFang SC">{{item.contactDetails}}</div>
               </div>
             </van-cell>
           </van-list>

src/_shanghu_detail-edit.js

@@ -50,22 +50,22 @@ window.addEventListener('load', function () {
 						}
 					], // 新增图片数组字段
 				},
-		dict4changhsuoType:[],
-		dict4fangwuType:[],
-		dict4fangwuyongtuType:[],
-		dict4businessType:[],
-		dict4community:[],
-		dict4industryType:[],
-		consumerSuggestList:[]
+				dict4changhsuoType: [],
+				dict4fangwuType: [],
+				dict4fangwuyongtuType: [],
+				dict4businessType: [],
+				dict4community: [],
+				dict4industryType: [],
+				consumerSuggestList: []
 			}
 		},
 		computed: {},
 		mounted() {
 			// 详情编辑权限控制
 			const userType = gemhoUtil.getCookie('userType')
-		if(userType !== 'wgy'){
+			if (userType !== 'wgy') {
 				this.flag = 'XG'
-		}else{
+			} else {
 				this.flag = 'XQ'
 			}
 
@@ -92,13 +92,20 @@ window.addEventListener('load', function () {
 					this.getConsumerSuggestList() // 获取检查列表
 				}
 			},
-		getConsumerSuggestList(){
+			showImage(list, index) {
+				vant.ImagePreview({
+					images: list,
+					startPosition: index,
+					closeable: true,
+				});
+			},
+			getConsumerSuggestList() {
 				http2.post({
 					serviceId: API_KEY_MAP["page"]['id'],
 					interfacePublicKey: API_KEY_MAP["page"]["publicKey"],
 					interfacePrivateKey: API_KEY_MAP["page"]["privateKey"],
 					reqParams: {
-					page:1,
+						page: 1,
 						size: 9999,
 						sign: 18, // 消费者建议列表
 						"merId": gemhoUtil.getParameter('merId'),
@@ -124,13 +131,13 @@ window.addEventListener('load', function () {
 					}
 				})
 			},
-		getDict4changhsuoType(param){
+			getDict4changhsuoType(param) {
 				http2.post({
 					serviceId: API_KEY_MAP["page"]['id'],
 					interfacePublicKey: API_KEY_MAP["page"]["publicKey"],
 					interfacePrivateKey: API_KEY_MAP["page"]["privateKey"],
 					reqParams: {
-					page:1,
+						page: 1,
 						size: 9999,
 						sign: 21, // 场所类型=>行业类别
 						...param
@@ -156,20 +163,20 @@ window.addEventListener('load', function () {
 					}
 				})
 			},
-		handleIndustryChange(val){
+			handleIndustryChange(val) {
 				// 选择后晴空下级下拉框值
 				this.dict4changhsuoType = []
 				this.getDict4changhsuoType({
 					industryId: this.formData.industryType
 				})
 			},
-		getDict4industryType(){
+			getDict4industryType() {
 				http2.post({
 					serviceId: API_KEY_MAP["page"]['id'],
 					interfacePublicKey: API_KEY_MAP["page"]["publicKey"],
 					interfacePrivateKey: API_KEY_MAP["page"]["privateKey"],
 					reqParams: {
-					page:1,
+						page: 1,
 						size: 9999,
 						sign: 20, // 行业类型列表
 					}
@@ -194,13 +201,13 @@ window.addEventListener('load', function () {
 					}
 				})
 			},
-		getDict4community(){
+			getDict4community() {
 				http2.post({
 					serviceId: API_KEY_MAP["page"]['id'],
 					interfacePublicKey: API_KEY_MAP["page"]["publicKey"],
 					interfacePrivateKey: API_KEY_MAP["page"]["privateKey"],
 					reqParams: {
-					page:1,
+						page: 1,
 						size: 9999,
 						sign: 22,
 						"merId": gemhoUtil.getParameter('merId'),
@@ -226,13 +233,13 @@ window.addEventListener('load', function () {
 					}
 				})
 			},
-		getDict4businessType(){
+			getDict4businessType() {
 				http2.post({
 					serviceId: API_KEY_MAP["page"]['id'],
 					interfacePublicKey: API_KEY_MAP["page"]["publicKey"],
 					interfacePrivateKey: API_KEY_MAP["page"]["privateKey"],
 					reqParams: {
-					page:1,
+						page: 1,
 						size: 9999,
 						sign: 15,
 						dictType: 'business_type'
@@ -259,13 +266,13 @@ window.addEventListener('load', function () {
 				})
 			},
 
-		getDict4fangwuType(){
+			getDict4fangwuType() {
 				http2.post({
 					serviceId: API_KEY_MAP["page"]['id'],
 					interfacePublicKey: API_KEY_MAP["page"]["publicKey"],
 					interfacePrivateKey: API_KEY_MAP["page"]["privateKey"],
 					reqParams: {
-					page:1,
+						page: 1,
 						size: 9999,
 						sign: 15,
 						dictType: 'house_type'
@@ -291,13 +298,13 @@ window.addEventListener('load', function () {
 					}
 				})
 			},
-		getDict4fangwuyongtuType(){
+			getDict4fangwuyongtuType() {
 				http2.post({
 					serviceId: API_KEY_MAP["page"]['id'],
 					interfacePublicKey: API_KEY_MAP["page"]["publicKey"],
 					interfacePrivateKey: API_KEY_MAP["page"]["privateKey"],
 					reqParams: {
-					page:1,
+						page: 1,
 						size: 9999,
 						sign: 15,
 						dictType: 'house_usage'
@@ -323,40 +330,40 @@ window.addEventListener('load', function () {
 					}
 				})
 			},
-		save(){
+			save() {
 				vant.Toast.loading({
 					message: '正在处理...',
 					forbidClick: true,
 					loadingType: 'spinner',
 				});
-			var reqParam = {...this.formData}			// var url = "/gq/checkRecord/safeCheckRecord"
+				var reqParam = { ...this.formData }			// var url = "/gq/checkRecord/safeCheckRecord"
 
-			if(!reqParam.unitName){
+				if (!reqParam.unitName) {
 					vant.Toast({
 						message: '商家名称不能为空',
 					})
 					return
 				}
-			if(!reqParam.area){
+				if (!reqParam.area) {
 					vant.Toast({
 						message: '建筑面积不能为空',
 					})
 					return
 				}
-			if(!reqParam.merchantName){
+				if (!reqParam.merchantName) {
 					vant.Toast({
 						message: '负责人不能为空',
 					})
 					return
 				}
-			if(!reqParam.community){
+				if (!reqParam.community) {
 					vant.Toast({
 						message: '所属社区不能为空',
 					})
 					return
 				}
 
-			if(!reqParam.industryType){
+				if (!reqParam.industryType) {
 					vant.Toast({
 						message: '行业类型不能为空',
 					})