表单配置

src/saas/AppCountryAlbum/WatermarkConfig.vue

@@ -1,16 +1,16 @@
 <template>
   <div class="AttendanceFiexdTime">
     <div class="form-group">
-      <div class="form-group__item" hover-class="bg-hover" v-if="item.fieldType" v-for="(item, index) in config" :key="index">
+      <div class="form-group__item" @click.stop="onClick(item.editEnable)" hover-class="bg-hover" v-if="item.fieldType" v-for="(item, index) in config" :key="index">
         <div class="left">
-          <switch :color="item.editEnable === '0' ? '#B7DBFD' : '#1088F9'" :checked="item.status === '1'" :disabled="item.editEnable === '0'" @change="e => onChange(e, index)" />
+          <switch @click.stop="onSwitchClick(item.editEnable)" :color="item.editEnable === '0' ? '#B7DBFD' : '#1088F9'" :checked="item.status === '1'" :disabled="item.editEnable === '0'" @change="e => onChange(e, index)" />
         </div>
         <div class="right" @click="toInput(item)" v-if="['6', '7'].indexOf(item.fieldType) === -1">
           <div class="right-left">
             <h2>{{ mapFieldLable(item.type) }}</h2>
-            <p>{{ item.defaultValue || '' }}</p>
+            <p :style="{color: item.defaultValue ? '#333' : '#999'}">{{ item.defaultValue || mapType(item.fieldType) }}</p>
           </div>
-          <u-icon name="arrow-right" color="#E1E2E3"></u-icon>
+          <u-icon name="arrow-right" color="#E1E2E3" v-if="item.editEnable !== '0'"></u-icon>
         </div>
         <picker mode="date" style="flex: 1;" v-if="item.fieldType === '7'" :value="item.defaultValue" @change="e => onDateChange(e, index)">
           <div class="right">
@@ -18,7 +18,7 @@
               <h2>{{ mapFieldLable(item.type) }}</h2>
               <p>{{ item.defaultValue || '' }}</p>
             </div>
-            <u-icon name="arrow-right" color="#E1E2E3"></u-icon>
+            <u-icon name="arrow-right" color="#E1E2E3" v-if="item.editEnable !== '0'"></u-icon>
           </div>
         </picker>
         <picker mode="time" style="flex: 1;" v-if="item.fieldType === '6'" :value="item.defaultValue" @change="e => onDateChange(e, index)">
@@ -27,7 +27,7 @@
               <h2>{{ mapFieldLable(item.type) }}</h2>
               <p>{{ item.defaultValue || '' }}</p>
             </div>
-            <u-icon name="arrow-right" color="#E1E2E3"></u-icon>
+            <u-icon name="arrow-right" color="#E1E2E3" v-if="item.editEnable !== '0'"></u-icon>
           </div>
         </picker>
       </div>
@@ -67,6 +67,19 @@
         })
       },
 
+      mapType (type) {
+        return {
+          '0': '请输入内容',
+          '1': '请输入内容',
+          '2': '请选择天气',
+          '3': '请选择地址',
+          '4': '请选择定位',
+          '5': '请选择经纬度',
+          '6': '请选择时间',
+          '7': '请选择日期'
+        }[type]
+      },
+
       onDateChange (e, index) {
         this.$set(this.config[index], 'defaultValue', e.detail.value)
       },
@@ -75,6 +88,18 @@
         this.$set(this.config[index], 'status', e.detail.value ? '1' : '0')
       },
 
+      onSwitchClick (status) {
+        if (status === '0') {
+          return this.$u.toast('该选项不允许关闭')
+        }
+      },
+
+      onClick (status) {
+        if (status === '0') {
+          return this.$u.toast('该选项不允许修改内容')
+        }
+      },
+
       toInput (e) {
         if (e.editEnable === '0') return