组件更新

src/components/cus/CusForm.vue

@@ -30,7 +30,8 @@ export default defineComponent({
   components: {},
   props: {
     labelWidth: {default: '100px'},
-    elementLoadingBackground: {}
+    elementLoadingBackground: {},
+    formView: {default: false}
   },
   setup(props, { emit }) {
     const store = useStore();
@@ -40,6 +41,7 @@ export default defineComponent({
     const state = reactive({})
     const ref_cusForm: any = ref(null)
     provide('element-loading-background', props.elementLoadingBackground)
+    provide('form-view', props.formView)
     const submit = () => {
       return new Promise((resolve, reject) => {
         const nodes: any = [];

src/components/cus/CusFormColumn.vue

@@ -11,9 +11,8 @@
       <slot name="cus" :handleValidate="handleValidate">
         <template v-if="link === 'input'">
           <InputCom
-              v-if="link === 'input'"
               v-bind="$attrs"
-              :label="label"
+              :label="labelCpt"
               :param="param"
               @emitParam="val => {
                 $emit('update:param', val), handleValidate(val)
@@ -37,7 +36,7 @@
         <template v-else-if="link === 'select'">
           <SelectCom
               v-bind="$attrs"
-              :label="label"
+              :label="labelCpt"
               :param="param"
               @emitParam="val => {
                 $emit('update:param', val), handleValidate(val)
@@ -49,7 +48,7 @@
         <template v-else-if="link === 'date'">
           <DateCom
               v-bind="$attrs"
-              :label="label"
+              :label="labelCpt"
               :param="param"
               @emitParam="val => {
                 $emit('update:param', val), handleValidate(val)
@@ -63,7 +62,7 @@
         <template v-else-if="link === 'datetime'">
           <DateTimeCom
               v-bind="$attrs"
-              :label="label"
+              :label="labelCpt"
               :param="param"
               @emitParam="val => {
                 $emit('update:param', val), handleValidate(val)
@@ -77,7 +76,7 @@
         <template v-else-if="link === 'time'">
           <TimeCom
               v-bind="$attrs"
-              :label="label"
+              :label="labelCpt"
               :param="param"
               @emitParam="val => {
                 $emit('update:param', val), handleValidate(val)
@@ -88,7 +87,7 @@
         <template v-else-if="link === 'cascader'">
           <CascaderCom
               v-bind="$attrs"
-              :label="label"
+              :label="labelCpt"
               :param="param"
               @emitParam="val => {
                 $emit('update:param', val), handleValidate(val)
@@ -102,7 +101,7 @@
         <template v-else-if="link === 'switch'">
           <SwitchCom
               v-bind="$attrs"
-              :label="label"
+              :label="labelCpt"
               :param="param"
               @emitParam="val => {
                 $emit('update:param', val), handleValidate(val)
@@ -113,7 +112,7 @@
         <template v-else-if="link === 'radio'">
           <RadioCom
               v-bind="$attrs"
-              :label="label"
+              :label="labelCpt"
               :param="param"
               @emitParam="val => {
                 $emit('update:param', val), handleValidate(val)
@@ -124,7 +123,7 @@
         <template v-else-if="link === 'checkbox'">
           <CheckboxCom
               v-bind="$attrs"
-              :label="label"
+              :label="labelCpt"
               :param="param"
               @emitParam="val => {
                 $emit('update:param', val), handleValidate(val)
@@ -132,32 +131,10 @@
           >
           </CheckboxCom>
         </template>
-        <template v-else-if="link === 'portOfRegistry'">
-          <PortOfRegistryCom
-              v-bind="$attrs"
-              :label="label"
-              :paramOne="paramOne"
-              :paramTwo="paramTwo"
-              @emitParam="(pOne, pTwo) => {
-                $emit('update:paramOne', pOne), $emit('update:paramTwo', pTwo), handleValidate(pOne, pTwo)
-              }"
-          />
-        </template>
-        <template v-else-if="link === 'residentMooringPoint'">
-          <ResidentMooringPointCom
-              v-bind="$attrs"
-              :label="label"
-              :paramOne="paramOne"
-              :paramTwo="paramTwo"
-              @emitParam="(pOne, pTwo) => {
-                $emit('update:paramOne', pOne), $emit('update:paramTwo', pTwo), handleValidate(pOne, pTwo)
-              }"
-          />
-        </template>
         <template v-else-if="link === 'dept'">
           <DeptCom
               v-bind="$attrs"
-              :label="label"
+              :label="labelCpt"
               :param="param"
               @emitParam="val => {
                 $emit('update:param', val), handleValidate(val)
@@ -168,13 +145,38 @@
         <template v-else-if="link === 'upload'">
           <UploadCom
               v-bind="$attrs"
-              :label="label"
+              :label="labelCpt"
               :param="param"
               @emitParam="val => {
                 $emit('update:param', val), handleValidate(val)
               }"
           />
         </template>
+        <template v-else-if="link === 'number'">
+          <NumberCom
+              v-if="link === 'number'"
+              v-bind="$attrs"
+              :label="labelCpt"
+              :param="param"
+              @emitParam="val => {
+                $emit('update:param', val), handleValidate(val)
+              }"
+              @emitEnter="handleEnter"
+          >
+            <template v-if="$slots.prefix" #prefix>
+              <slot name="prefix"/>
+            </template>
+            <template v-if="$slots.suffix" #suffix>
+              <slot name="suffix"/>
+            </template>
+            <template v-if="$slots.prepend" #prepend>
+              <slot name="prepend"/>
+            </template>
+            <template v-if="$slots.append" #append>
+              <slot name="append"/>
+            </template>
+          </NumberCom>
+        </template>
       </slot>
       <div v-if="unit" class="unit">{{unit}}</div>
     </el-form-item>
@@ -205,10 +207,9 @@ import CascaderCom from './cus-form-link/cascader.vue'
 import SwitchCom from './cus-form-link/switch.vue'
 import RadioCom from './cus-form-link/radio.vue'
 import CheckboxCom from './cus-form-link/checkbox.vue'
-import PortOfRegistryCom from './cus-form-link/portOfRegistry.vue'
-import ResidentMooringPointCom from './cus-form-link/residentMooringPoint.vue'
 import DeptCom from './cus-form-link/dept.vue'
 import UploadCom from './cus-form-link/upload.vue'
+import NumberCom from './cus-form-link/number.vue'
 
 export default defineComponent({
   name: 'CusFormColumn',
@@ -222,25 +223,22 @@ export default defineComponent({
     SwitchCom,
     RadioCom,
     CheckboxCom,
-    PortOfRegistryCom,
-    ResidentMooringPointCom,
     DeptCom,
     UploadCom,
+    NumberCom
   },
   props: {
     span: {type: Number, default: 6},
     filterSpan: { default: null },
     offset: {type: Number, default: 0},
-    param: {
-      required: true
-    },
+    param: {},
     paramOne: {},
     paramTwo: {},
     label: {type: String, default: ''},
     required: {default: false},
     labelWidth: {type: String, default: ''},
     link: {type: String, default: 'input', validator(val: string) {
-      return ['cascader', 'checkbox', 'date', 'datetime', 'input', 'radio', 'select', 'switch', 'portOfRegistry', 'residentMooringPoint', 'dept', 'time', 'upload'].includes(val)
+      return ['cascader', 'checkbox', 'date', 'datetime', 'input', 'radio', 'select', 'switch', 'portOfRegistry', 'residentMooringPoint', 'dept', 'time', 'upload', 'number'].includes(val)
     }},
     rules: {type: Array, default: () => []},
     maxLength: {type: Number, default: null},
@@ -263,6 +261,9 @@ export default defineComponent({
       }
       return true
     }
+    const labelCpt = computed(() => {
+      return props.label.replace(/[:：]([^:：]*)$/, "")
+    })
     const rulesCpt = computed(() => {
       const r = [...props.rules]
       if (isValue(props.minLength)) {
@@ -282,12 +283,12 @@ export default defineComponent({
         if (['portOfRegistry', 'residentMooringPoint'].includes(props.link)) {
           r.unshift({
             handle: (pOne: any, pTwo: any) => isValue(pOne) && isValue(pTwo),
-            message: props.defaultErrorMsg ?? `请${doStr}${props.label}`
+            message: props.defaultErrorMsg ?? `请${doStr}${labelCpt.value}`
           })
         } else {
           r.unshift({
             handle: (val: any) => isValue(val),
-            message: props.defaultErrorMsg ?? `请${doStr}${props.label}`
+            message: props.defaultErrorMsg ?? `请${doStr}${labelCpt.value}`
           })
         }
       }
@@ -329,7 +330,8 @@ export default defineComponent({
       handleValidate,
       handleEnter,
       ref_cusFormColumn,
-      reset
+      reset,
+      labelCpt
     }
   },
 })

src/components/cus/cus-form-link/cascader.vue

@@ -4,12 +4,13 @@
        style="width: 100%;"
        v-bind="$attrs"
        v-model="paramVal"
-       :placeholder="$attrs.placeholder ? $attrs.placeholder : `请选择`"
+       :placeholder="$attrs.placeholder ? $attrs.placeholder : `请选择${label}`"
        :options="options"
        clearable
        filterable
        :props="propsCpt"
        :teleported="false"
+       :disabled="$util.isValue($attrs.disabled) ? $attrs.disabled : formView"
     >
       <template #default="{ node, data }">
         <slot v-bind="{node, data}">
@@ -79,7 +80,8 @@ export default defineComponent({
         value: 'value'
       },
       loading: true,
-      elementLoadingBackground: inject('element-loading-background', null)
+      elementLoadingBackground: inject('element-loading-background', null),
+      formView: inject('form-view', false),
     })
     watch(() => state.paramVal, (n) => {
       emit('emitParam', n)

src/components/cus/cus-form-link/checkbox.vue

@@ -4,6 +4,7 @@
         v-bind="$attrs"
         v-model="paramVal"
         @change="handleChange"
+        :disabled="$util.isValue($attrs.disabled) ? $attrs.disabled : formView"
     >
       <el-checkbox
           v-for="item in options"
@@ -51,7 +52,8 @@ export default defineComponent({
     const state = reactive({
       paramVal: props.param,
       loading: true,
-      elementLoadingBackground: inject('element-loading-background', null)
+      elementLoadingBackground: inject('element-loading-background', null),
+      formView: inject('form-view', false),
     })
     watch(() => state.paramVal, (n) => {
       emit('emitParam', n)

src/components/cus/cus-form-link/date.vue

@@ -5,10 +5,11 @@
       v-bind="$attrs"
       v-model="paramVal"
       clearable
-      :placeholder="$attrs.placeholder ? $attrs.placeholder : `请选择`"
+      :placeholder="$attrs.placeholder ? $attrs.placeholder : `请选择${label}`"
       :valueFormat="valueFormatCpt"
       :format="formatCpt"
       unlink-panels
+      :disabled="$util.isValue($attrs.disabled) ? $attrs.disabled : formView"
   >
     <template #default="cell">
       <slot name="default" :cell="cell"></slot>
@@ -27,7 +28,8 @@ import {
   getCurrentInstance,
   ComponentInternalInstance,
   toRefs,
-  nextTick
+  nextTick,
+  inject
 } from 'vue'
 import {useStore} from 'vuex'
 import {useRouter, useRoute} from 'vue-router'
@@ -54,7 +56,8 @@ export default defineComponent({
     const route = useRoute();
     const that = (getCurrentInstance() as ComponentInternalInstance).appContext.config.globalProperties
     const state = reactive({
-      paramVal: props.param
+      paramVal: props.param,
+      formView: inject('form-view', false),
     })
     watch(() => state.paramVal, (n) => {
       emit('emitParam', n)

src/components/cus/cus-form-link/datetime.vue

@@ -5,10 +5,11 @@
       v-bind="$attrs"
       v-model="paramVal"
       clearable
-      :placeholder="$attrs.placeholder ? $attrs.placeholder : `请选择`"
+      :placeholder="$attrs.placeholder ? $attrs.placeholder : `请选择${label}`"
       :valueFormat="valueFormat"
       :format="format"
       unlink-panels
+      :disabled="$util.isValue($attrs.disabled) ? $attrs.disabled : formView"
   >
     <template #default="cell">
       <slot name="default" :cell="cell"></slot>
@@ -27,7 +28,8 @@ import {
   getCurrentInstance,
   ComponentInternalInstance,
   toRefs,
-  nextTick
+  nextTick,
+  inject
 } from 'vue'
 import {useStore} from 'vuex'
 import {useRouter, useRoute} from 'vue-router'
@@ -54,7 +56,8 @@ export default defineComponent({
     const route = useRoute();
     const that = (getCurrentInstance() as ComponentInternalInstance).appContext.config.globalProperties
     const state = reactive({
-      paramVal: props.param
+      paramVal: props.param,
+      formView: inject('form-view', false),
     })
     watch(() => state.paramVal, (n) => {
       emit('emitParam', n)

src/components/cus/cus-form-link/dept.vue

@@ -4,7 +4,7 @@
         style="width: 100%;"
         v-bind="$attrs"
         v-model="paramVal"
-        :placeholder="$attrs.placeholder ? $attrs.placeholder : `请选择`"
+        :placeholder="$attrs.placeholder ? $attrs.placeholder : `请选择${label}`"
         :data="optionsCpt"
         clearable
         filterable
@@ -13,6 +13,7 @@
         :props="{
           label: 'deptName',
         }"
+        :disabled="$util.isValue($attrs.disabled) ? $attrs.disabled : formView"
     />
   </div>
 </template>
@@ -51,7 +52,8 @@ export default defineComponent({
     const state = reactive({
       paramVal: props.param,
       loading: true,
-      elementLoadingBackground: inject('element-loading-background', null)
+      elementLoadingBackground: inject('element-loading-background', null),
+      formView: inject('form-view', false),
     })
     watch(() => state.paramVal, (n) => {
       emit('emitParam', n)

src/components/cus/cus-form-link/input.vue

@@ -4,8 +4,9 @@
       v-model="paramVal"
       :type="type"
       clearable
-      :placeholder="$attrs.placeholder ? $attrs.placeholder : `请输入`"
+      :placeholder="$attrs.placeholder ? $attrs.placeholder : `请输入${label}`"
       @keyup.enter.native="$emit('emitEnter')"
+      :disabled="$util.isValue($attrs.disabled) ? $attrs.disabled : formView"
   >
     <template v-if="$slots.prefix" #prefix>
       <slot name="prefix"/>
@@ -33,7 +34,8 @@ import {
   getCurrentInstance,
   ComponentInternalInstance,
   toRefs,
-  nextTick
+  nextTick,
+  inject
 } from 'vue'
 import {useStore} from 'vuex'
 import {useRouter, useRoute} from 'vue-router'
@@ -58,7 +60,8 @@ export default defineComponent({
     const route = useRoute();
     const that = (getCurrentInstance() as ComponentInternalInstance).appContext.config.globalProperties
     const state = reactive({
-      paramVal: props.param
+      paramVal: props.param,
+      formView: inject('form-view', false),
     })
     watch(() => state.paramVal, (n) => {
       emit('emitParam', n)

src/components/cus/cus-form-link/number.vue

@@ -0,0 +1,134 @@
+<template>
+  <el-input
+      v-bind="$attrs"
+      v-model="paramVal"
+      :type="type"
+      clearable
+      :placeholder="$attrs.placeholder ? $attrs.placeholder : `请输入${label}`"
+      @keyup.enter.native="$emit('emitEnter')"
+      :disabled="$util.isValue($attrs.disabled) ? $attrs.disabled : formView"
+      @input="handleInput"
+      @keypress="handleKeyPress"
+      @focusout="handleFocusOut"
+  >
+    <template v-if="$slots.prefix" #prefix>
+      <slot name="prefix"/>
+    </template>
+    <template v-if="$slots.suffix" #suffix>
+      <slot name="suffix"/>
+    </template>
+    <template v-if="$slots.prepend" #prepend>
+      <slot name="prepend"/>
+    </template>
+    <template v-if="$slots.append" #append>
+      <slot name="append"/>
+    </template>
+  </el-input>
+</template>
+
+<script lang="ts">
+import {
+  defineComponent,
+  computed,
+  onMounted,
+  ref,
+  reactive,
+  watch,
+  getCurrentInstance,
+  ComponentInternalInstance,
+  toRefs,
+  nextTick,
+  inject
+} from 'vue'
+import {useStore} from 'vuex'
+import {useRouter, useRoute} from 'vue-router'
+
+export default defineComponent({
+  name: '',
+  components: {},
+  props: {
+    param: {},
+    label: {},
+    type: {
+      type: String,
+      default: 'text',
+      validator(val: string) {
+        return ['text', 'textarea', 'password'].includes(val)
+      }
+    },
+    max: {default: null, type: Number},
+    min: {default: null, type: Number},
+    decimal: {default: 0, type: Number}
+  },
+  setup(props, { emit }) {
+    const store = useStore();
+    const router = useRouter();
+    const route = useRoute();
+    const that = (getCurrentInstance() as ComponentInternalInstance).appContext.config.globalProperties
+    const state = reactive({
+      paramVal: <any>props.param,
+      formView: inject('form-view', false),
+    })
+    watch(() => state.paramVal, (n) => {
+      emit('emitParam', n)
+    })
+    watch(() => props.param, (n) => {
+      state.paramVal = n
+    })
+    const handleInput = () => {
+      const handleReg = (key) => {
+        if (props.decimal === 0) {
+          key = String(key).replace(/\D/g, "")
+        } else {
+          const pattern = new RegExp("(\\.\\d{" + props.decimal + "})\\d*")
+          key = String(key).replace(/\./g, (match, index) => {
+            return index === key.indexOf('.') ? match : '';
+          }).replace(/^(\d+)\.(\d+)|[^0-9.]/g, (match, group1, group2) => {
+            if (group1 && group2) {
+              return group1 + "." + group2
+            } else {
+              return ""
+            }
+          }).replace(pattern, "$1")
+        }
+        return key
+      }
+      if (String(state.paramVal).startsWith('-')) {
+        state.paramVal = '-' + handleReg(state.paramVal)
+      } else {
+        state.paramVal = handleReg(state.paramVal)
+      }
+      if (that.$util.isValue(state.paramVal)) {
+        if (that.$util.isValue(props.max) && Number(state.paramVal) > props.max) {
+          state.paramVal = props.max
+        }
+        if (that.$util.isValue(props.min) && Number(state.paramVal) < props.min) {
+          state.paramVal = props.min
+        }
+      }
+    }
+    const handleKeyPress = (event) => {
+      const keyCode = event.keyCode || event.which;
+      if (keyCode !== 8 && keyCode !== 46 && keyCode !== 45 && (keyCode < 48 || keyCode > 57)) {
+        event.preventDefault()
+      }
+    }
+    const handleFocusOut = () => {
+      if (state.paramVal === '-') {
+        state.paramVal = ''
+      } else if (that.$util.isValue(state.paramVal)) {
+        state.paramVal = Number(state.paramVal)
+      }
+    }
+    return {
+      ...toRefs(state),
+      handleInput,
+      handleKeyPress,
+      handleFocusOut
+    }
+  },
+})
+</script>
+
+<style scoped lang="scss">
+</style>

src/components/cus/cus-form-link/portOfRegistry.vue

@@ -1,104 +0,0 @@
-<template>
-  <div v-loading="loading" :element-loading-background="elementLoadingBackground" style="width: 100%;">
-    <el-select
-        style="width: 90px;"
-        v-model="paramOneVal"
-        :placeholder="`请选择`"
-        clearable
-        filterable
-        @change="handleChange"
-        :title="$store.state.dictionary.cbglPersonDictionaryMap.get(paramOneVal)"
-    >
-      <el-option
-          v-for="item in $store.state.dictionary.cbglPersonDictionary"
-          :key="item.dictType"
-          :label="item.dictName"
-          :value="item.dictType"
-          :title="item.dictName"
-      />
-    </el-select>
-    <el-select
-        style="width: calc(100% - 90px - 2px);margin-left: 2px;"
-        v-model="paramTwoVal"
-        :placeholder="`请选择`"
-        :disabled="!paramOneVal"
-        clearable
-        filterable
-        @change="handleChange"
-        :title="$store.state.dictionary.portOfRegistryTwoMap.get(paramTwoVal)"
-    >
-      <el-option
-          v-for="item in $store.state.dictionary.portOfRegistryTwoList.filter(v => v.parent === paramOneVal)"
-          :key="item.dictValue"
-          :label="item.dictName"
-          :value="item.dictValue"
-          :title="item.dictName"
-      />
-    </el-select>
-  </div>
-</template>
-
-<script lang="ts">
-import {
-  defineComponent,
-  computed,
-  onMounted,
-  ref,
-  reactive,
-  watch,
-  getCurrentInstance,
-  ComponentInternalInstance,
-  toRefs,
-  nextTick,
-  inject
-} from 'vue'
-import {useStore} from 'vuex'
-import {useRouter, useRoute} from 'vue-router'
-
-export default defineComponent({
-  name: '',
-  components: {},
-  props: {
-    paramOne: {},
-    paramTwo: {},
-    label: {},
-  },
-  setup(props, { emit }) {
-    const store = useStore();
-    const router = useRouter();
-    const route = useRoute();
-    const that = (getCurrentInstance() as ComponentInternalInstance).appContext.config.globalProperties
-    const state = reactive({
-      paramOneVal: props.paramOne,
-      paramTwoVal: props.paramTwo,
-      loading: true,
-      elementLoadingBackground: inject('element-loading-background', null)
-    })
-    watch(() => state.paramOneVal, (n) => {
-      state.paramTwoVal = null
-      emit('emitParam', state.paramOneVal, state.paramTwoVal)
-    })
-    watch(() => state.paramTwoVal, (n) => {
-      emit('emitParam', state.paramOneVal, state.paramTwoVal)
-    })
-    watch(() => [props.paramOne, props.paramTwo], (n) => {
-      state.paramOneVal = n[0]
-      state.paramTwoVal = n[1]
-    })
-    const handleChange = (val: any) => {
-    }
-    onMounted(() => {
-      store.dispatch('dictionary/LOAD_PORT_OF_REGISTRY').then(() => {
-        state.loading = false
-      })
-    })
-    return {
-      ...toRefs(state),
-      handleChange
-    }
-  },
-})
-</script>
-
-<style scoped lang="scss">
-</style>

src/components/cus/cus-form-link/radio.vue

@@ -4,6 +4,7 @@
         v-bind="$attrs"
         v-model="paramVal"
         @change="handleChange"
+        :disabled="$util.isValue($attrs.disabled) ? $attrs.disabled : formView"
     >
       <el-radio
           v-for="item in options"
@@ -51,7 +52,8 @@ export default defineComponent({
     const state = reactive({
       paramVal: props.param,
       loading: true,
-      elementLoadingBackground: inject('element-loading-background', null)
+      elementLoadingBackground: inject('element-loading-background', null),
+      formView: inject('form-view', false),
     })
     watch(() => state.paramVal, (n) => {
       emit('emitParam', n)

src/components/cus/cus-form-link/residentMooringPoint.vue

@@ -1,104 +0,0 @@
-<template>
-  <div v-loading="loading" :element-loading-background="elementLoadingBackground" style="width: 100%;">
-    <el-select
-        style="width: 100px;"
-        v-model="paramOneVal"
-        :placeholder="`请选择`"
-        clearable
-        filterable
-        @change="handleChange"
-        :title="$store.state.dictionary.cbglPersonTemporaryMap.get(paramOneVal)"
-    >
-      <el-option
-          v-for="item in $store.state.dictionary.cbglPersonTemporary"
-          :key="item.dictType"
-          :label="item.dictName"
-          :value="item.dictType"
-          :title="item.dictName"
-      />
-    </el-select>
-    <el-select
-        style="width: calc(100% - 100px - 2px);margin-left: 2px;"
-        v-model="paramTwoVal"
-        :placeholder="`请选择`"
-        :disabled="!paramOneVal"
-        clearable
-        filterable
-        @change="handleChange"
-        :title="$store.state.dictionary.residentMooringPointTwoMap.get(paramTwoVal)"
-    >
-      <el-option
-          v-for="item in $store.state.dictionary.residentMooringPointTwoList.filter(v => v.parent === paramOneVal)"
-          :key="item.dictValue"
-          :label="item.dictName"
-          :value="item.dictValue"
-          :title="item.dictName"
-      />
-    </el-select>
-  </div>
-</template>
-
-<script lang="ts">
-import {
-  defineComponent,
-  computed,
-  onMounted,
-  ref,
-  reactive,
-  watch,
-  getCurrentInstance,
-  ComponentInternalInstance,
-  toRefs,
-  nextTick,
-  inject
-} from 'vue'
-import {useStore} from 'vuex'
-import {useRouter, useRoute} from 'vue-router'
-
-export default defineComponent({
-  name: '',
-  components: {},
-  props: {
-    paramOne: {},
-    paramTwo: {},
-    label: {},
-  },
-  setup(props, { emit }) {
-    const store = useStore();
-    const router = useRouter();
-    const route = useRoute();
-    const that = (getCurrentInstance() as ComponentInternalInstance).appContext.config.globalProperties
-    const state = reactive({
-      paramOneVal: props.paramOne,
-      paramTwoVal: props.paramTwo,
-      loading: true,
-      elementLoadingBackground: inject('element-loading-background', null)
-    })
-    watch(() => state.paramOneVal, (n) => {
-      state.paramTwoVal = null
-      emit('emitParam', state.paramOneVal, state.paramTwoVal)
-    })
-    watch(() => state.paramTwoVal, (n) => {
-      emit('emitParam', state.paramOneVal, state.paramTwoVal)
-    })
-    watch(() => [props.paramOne, props.paramTwo], (n) => {
-      state.paramOneVal = n[0]
-      state.paramTwoVal = n[1]
-    })
-    const handleChange = (val: any) => {
-    }
-    onMounted(() => {
-      store.dispatch('dictionary/LOAD_RESIDENT_MOORING_POINT').then(() => {
-        state.loading = false
-      })
-    })
-    return {
-      ...toRefs(state),
-      handleChange
-    }
-  },
-})
-</script>
-
-<style scoped lang="scss">
-</style>

src/components/cus/cus-form-link/select.vue

@@ -4,12 +4,13 @@
         style="width: 100%;"
         v-bind="$attrs"
         v-model="paramVal"
-        :placeholder="$attrs.placeholder ? $attrs.placeholder : `请选择`"
+        :placeholder="$attrs.placeholder ? $attrs.placeholder : `请选择${label}`"
         clearable
         filterable
         @change="handleChange"
         :popper-append-to-body="false"
         :title="optionsMapCpt.get(paramVal)?.[labelKey]"
+        :disabled="$util.isValue($attrs.disabled) ? $attrs.disabled : formView"
     >
       <slot v-if="$slots.default">
         <el-option
@@ -60,7 +61,8 @@ export default defineComponent({
     const state = reactive({
       paramVal: props.param,
       loading: true,
-      elementLoadingBackground: inject('element-loading-background', null)
+      elementLoadingBackground: inject('element-loading-background', null),
+      formView: inject('form-view', false),
     })
     watch(() => state.paramVal, (n) => {
       emit('emitParam', n)

src/components/cus/cus-form-link/switch.vue

@@ -2,6 +2,7 @@
   <el-switch
       v-bind="$attrs"
       v-model="paramVal"
+      :disabled="$util.isValue($attrs.disabled) ? $attrs.disabled : formView"
   />
 </template>
 
@@ -16,7 +17,8 @@ import {
   getCurrentInstance,
   ComponentInternalInstance,
   toRefs,
-  nextTick
+  nextTick,
+  inject
 } from 'vue'
 import {useStore} from 'vuex'
 import {useRouter, useRoute} from 'vue-router'
@@ -34,7 +36,8 @@ export default defineComponent({
     const route = useRoute();
     const that = (getCurrentInstance() as ComponentInternalInstance).appContext.config.globalProperties
     const state = reactive({
-      paramVal: props.param
+      paramVal: props.param,
+      formView: inject('form-view', false),
     })
     watch(() => state.paramVal, (n) => {
       emit('emitParam', n)

src/components/cus/cus-form-link/time.vue

@@ -4,10 +4,10 @@
       v-bind="$attrs"
       v-model="paramVal"
       clearable
-      :placeholder="$attrs.placeholder ? $attrs.placeholder : `请选择`"
+      :placeholder="$attrs.placeholder ? $attrs.placeholder : `请选择${label}`"
       :valueFormat="valueFormat"
       :format="format"
-
+      :disabled="$util.isValue($attrs.disabled) ? $attrs.disabled : formView"
   >
     <template #default="cell">
       <slot name="default" :cell="cell"></slot>
@@ -26,7 +26,8 @@ import {
   getCurrentInstance,
   ComponentInternalInstance,
   toRefs,
-  nextTick
+  nextTick,
+  inject
 } from 'vue'
 import {useStore} from 'vuex'
 import {useRouter, useRoute} from 'vue-router'
@@ -46,7 +47,8 @@ export default defineComponent({
     const route = useRoute();
     const that = (getCurrentInstance() as ComponentInternalInstance).appContext.config.globalProperties
     const state = reactive({
-      paramVal: props.param
+      paramVal: props.param,
+      formView: inject('form-view', false),
     })
     watch(() => state.paramVal, (n) => {
       emit('emitParam', n)

src/components/cus/cus-form-link/upload.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="cus-form-column-upload-com"
-       :class="{'cus-form-column-upload-com_view': view, 'cus-form-column-upload-com_list': layout === 'list', 'cus-form-column-upload-com_card': layout === 'card'}"
+       :class="{'cus-form-column-upload-com_view': isViewCpt, 'cus-form-column-upload-com_list': layout === 'list', 'cus-form-column-upload-com_card': layout === 'card'}"
        v-loading="loading"
        :element-loading-background="elementLoadingBackground">
     <el-upload
@@ -36,7 +36,7 @@
       <template #file="{file}">
         <template v-if="layout === 'card'">
           <el-tooltip placement="top" :content="file[nameKey] ?? file[urlKey]">
-            <div class="upload-layout-card_item" :class="{'item-view': view || !delRule(file)}" @mouseenter="file.hover = true" @mouseleave="file.hover = false">
+            <div class="upload-layout-card_item" :class="{'item-view': isViewCpt || !delRule(file)}" @mouseenter="file.hover = true" @mouseleave="file.hover = false">
               <template v-if="validImgByUrl(file[urlKey])">
                 <img class="img __hover" :src="$util.proxyNginxUrl(file[urlKey])" @click="viewImg(file[urlKey])"/>
               </template>
@@ -46,15 +46,15 @@
               <template v-else>
                 <img class="file __hover" :src="getFileImgByUrl(file[urlKey])" @click="downloadFileByUrl(file[urlKey], file[nameKey])"/>
               </template>
-              <img class="del __hover" src="@/assets/images/cus/file-del.png" v-if="file.hover && !view && delRule(file)" @click.stop="ref_upload.handleRemove(file)"/>
+              <img class="del __hover" src="@/assets/images/cus/file-del.png" v-if="file.hover && !isViewCpt && delRule(file)" @click.stop="ref_upload.handleRemove(file)"/>
             </div>
           </el-tooltip>
         </template>
         <template v-else>
-          <div class="upload-layout-list_item __hover" :class="{'item-view': view || !delRule(file)}" @click="validImgByUrl(file[urlKey]) ? viewImg(file[urlKey]) : downloadFileByUrl(file[urlKey], file[nameKey])">
+          <div class="upload-layout-list_item __hover" :class="{'item-view': isViewCpt || !delRule(file)}" @click="validImgByUrl(file[urlKey]) ? viewImg(file[urlKey]) : downloadFileByUrl(file[urlKey], file[nameKey])">
             <img class="file-type-img" :src="getFileImgByUrl(file[urlKey])"/>
             <CusEllipsis v-if="file[nameKey] ?? file[urlKey]" class="label" :value="file[nameKey] ?? file[urlKey]"/>
-            <SvgIcon v-if="!view && delRule(file)" class="close" name="close_2" size="12" @click.stop="ref_upload.handleRemove(file)"/>
+            <SvgIcon v-if="!isViewCpt && delRule(file)" class="close" name="close_2" size="12" @click.stop="ref_upload.handleRemove(file)"/>
           </div>
         </template>
       </template>
@@ -114,7 +114,7 @@ export default defineComponent({
     acceptType: {default: '', type: String},
     acceptMax: {default: 0, type: Number},
     acceptFunc: {default: () => (options) => {}},
-    view: {default: false},
+    view: {default: null},
     delRule: {default: () => () => false},
     cardWidth: {default: '147px'},
     cardHeight: {default: '128px'},
@@ -133,7 +133,8 @@ export default defineComponent({
       currentImg: {
         show: false,
         url: ''
-      }
+      },
+      formView: inject('form-view', false),
     })
     watch(() => state.paramVal, (n) => {
       emit('emitParam', n)
@@ -141,6 +142,9 @@ export default defineComponent({
     watch(() => props.param, (n) => {
       state.paramVal = n
     })
+    const isViewCpt = computed(() => {
+      return that.$util.isValue(props.view) ? props.view : state.formView
+    })
     const ref_upload = ref()
     const validImgByUrl = (url) => {
       if (url) {
@@ -376,7 +380,8 @@ export default defineComponent({
       downloadFileByUrl,
       isLimitCpt,
       viewImg,
-      imageClose
+      imageClose,
+      isViewCpt
     }
   },
 })

src/views/system/notice-announcement/detail.vue

@@ -6,17 +6,19 @@
       @submit="onSubmit"
       submitText="确认发布"
       height="500px"
-      :closeConfirm="isViewCpt"
+      :closeConfirm="!isViewCpt"
   >
     <div class="__normal-form">
       <CusForm labelWidth="100px" ref="ref_form">
         <CusFormColumn
+            :disabled="isViewCpt"
             :span="24"
             required
             label="标题:"
             defaultErrorMsg="请输入标题"
             v-model:param="cusDetail.p1"/>
         <CusFormColumn
+            :disabled="isViewCpt"
             :span="24"
             required
             label="内容:"
@@ -25,6 +27,7 @@
             :rows="8"
             v-model:param="cusDetail.p2"/>
         <CusFormColumn
+            :disabled="isViewCpt"
             :span="24"
             required
             label="操作类型:"
@@ -40,6 +43,7 @@
                 {label: '类型三', value: '3'},
             ]"/>
         <CusFormColumn
+            :view="isViewCpt"
             :span="24"
             label="上传文件:"
             defaultErrorMsg="请选择文件"
@@ -83,8 +87,9 @@ export default defineComponent({
         p1: null,
         p2: null,
         p3: null,
-        fileList: [],
-      }
+        fileList: [
+          { "url": "http://8.140.240.182:18085/profile/upload/2023/10/23/6b7bf3b4-592a-4e2f-ba92-11923671ce3b.doc", "name": "迁移案例.doc"},],
+        }
     })
     watch(() => props.show, (n) => {
       if (n) {
@@ -96,6 +101,7 @@ export default defineComponent({
         }
         if (props.transfer.method !== 'add') {
           state.cusDetail.p1 = props.transfer.detail.p1
+          state.cusDetail.fileList = props.transfer.detail.fileList
         }
         nextTick(() => {
           ref_form.value.reset()
@@ -104,7 +110,7 @@ export default defineComponent({
     })
     const ref_form = ref()
     const isViewCpt = computed(() => {
-      return props.transfer.method !== 'view'
+      return props.transfer.method === 'view'
     })
     const onSubmit = () => {
     }

src/views/system/notice-announcement/index.vue

@@ -194,9 +194,14 @@ export default defineComponent({
       state.loading = true
 
       // mock
-      const arr = []
+      const arr: any = []
       for (let i = 0; i < 77; i++) {
-        arr.push({p1: '阿三顶顶顶顶顶顶顶顶顶顶顶顶顶' + i})
+        arr.push({
+          p1: '阿三顶顶顶顶顶顶顶顶顶顶顶顶顶' + i,
+          fileList: [
+            { "url": "http://8.140.240.182:18085/profile/upload/2023/10/23/6b7bf3b4-592a-4e2f-ba92-11923671ce3b.doc", "name": "迁移案例.doc"},
+          ],
+        })
       }
       state.queryResult.tableData = arr
       state.queryResult.total = arr.length