更新页面

src/components/MyComponents/Upload/index.vue

@@ -8,7 +8,8 @@
       :limit="props.limit"
       :action="actionUrl" 
       :list-type="props.showBtn ? '' : 'picture-card'" 
-      :file-list="fileList" show-file-list
+      :file-list="fileList" 
+      show-file-list
       :on-exceed="handleExceed" 
       :on-success="handlerSuccess" 
       :before-upload="beforeImgUpload">
@@ -52,7 +53,7 @@
 
 <script setup>
 import { COMPONENT_WIDTH } from "@/constant";
-import { ref, defineProps, defineEmits, computed, watch, onMounted } from "vue";
+import { ref, defineProps, defineEmits, computed, watch, onMounted, onUnmounted } from "vue";
 import { ElMessage } from "element-plus";
 import { useStore } from "vuex";
 const props = defineProps({
@@ -79,9 +80,30 @@ const props = defineProps({
   },
   isAll: {
     type: Boolean,
-    default: false //所有类型都可以用这个接口，接口返回的是id
+    default: true //所有类型都可以用这个接口，接口返回的是id
   }
 });
+const emits = defineEmits(["update:modelValue"]);
+const store = useStore();
+const dialogImageUrl = ref("");
+const dialogVisible = ref(false);
+const disabled = ref(false);
+const headers = ref({
+  Authorization: store.getters.token
+});
+const fileList = ref([]);
+
+watch(() => props.modelValue,(val) => {
+  let arr = val ?  (Array.isArray(val) ? val :[val]): [];
+  if(arr.length == 0 ) return fileList.value = [];
+  fileList.value = arr.map((el) => {
+    if (Object.prototype.toString.call(el) === "[object Object]") {
+      return props.isAll ? { url: `/mosty-base/minio/image/download/` + el.id, name: el.name } : { url:el,name:el.name};
+    } else {
+      return { url: `/mosty-base/minio/image/download/` + el };
+    }
+  });
+},{ immediate: true,deep:true });
 
 const actionUrl = computed(() => {
   if (props.isAll) {
@@ -91,8 +113,6 @@ const actionUrl = computed(() => {
   }
 });
 
-const emits = defineEmits(["update:modelValue"]);
-
 //获取后缀
 const getSuffix = (fileName) => {
   let suffix = "";
@@ -134,40 +154,16 @@ const getSuffix = (fileName) => {
   //否则返回other
   return "OTHER";
 };
-const store = useStore();
-const dialogImageUrl = ref("");
-const dialogVisible = ref(false);
-const disabled = ref(false);
-const headers = ref({
-  Authorization: store.getters.token
-});
-
-const fileList = ref([]);
-watch(() => props.modelValue,(val) => {
-    let arr = val ?  (Array.isArray(val) ? val :[val]): [];
-    if (arr.length > 0) {
-      fileList.value = arr.map((el) => {
-        if (Object.prototype.toString.call(el) === "[object Object]") {
-          return props.isAll ? { url: `/mosty-base/minio/image/download/` + el.id, name: el.name } : { url:el,name:el.name};
-        } else {
-          return { url: `/mosty-base/minio/image/download/` + el };
-        }
-      });
-    }else{
-      fileList.value = [];
-    }
-  },
-  { immediate: true }
-);
 
 const handlerSuccess = (res, file) => {
-  file.url = `/mosty-base/minio/image/download/` + res.data;
+  // file.url = `/mosty-base/minio/image/download/` + res.data;
+  file.id = res.data;
   fileList.value.push(file);
-  let arr = props.modelValue ? props.modelValue : [];
+  let arr = []
   if(props.isImg){
-    arr.push(res.data);
+    arr = fileList.value.map((el) => el.id)
   }else{
-    arr.push({url:res.data,name:file.name});
+    arr = fileList.value.map((el) => ({ id:el.id, name:el.name}))
   }
   emits("update:modelValue", arr);
 };
@@ -179,16 +175,10 @@ const handleExceed = (files, fileList) => {
 const beforeImgUpload = (file) => {
   if (props.isImg) {
     let isIMG = false;
-    if (getSuffix(file.name) === "IMG") {
+    if (getSuffix(file.name) === "IMG")  isIMG = true;
-      isIMG = true;
-    }
     const isLt5M = file.size / 1024 / 1024 < 5;
-    if (!isIMG) {
+    if (!isIMG) ElMessage.error("上传图片只能是jpg/png/jpeg/bmp/gif格式!");
-      ElMessage.error("上传图片只能是jpg/png/jpeg/bmp/gif格式!");
+    if (!isLt5M) ElMessage.error("上传图片大小不能超过 5MB!");
-    }
-    if (!isLt5M) {
-      ElMessage.error("上传图片大小不能超过 5MB!");
-    }
     return isIMG && isLt5M;
   } else {
     return true;
@@ -204,13 +194,13 @@ const handleDownload = (file) => {
 };
 const handleRemove = (file) => {
   let index = fileList.value.findIndex(function (item) {
-    return item.url === file.url;
+    return item.id === file.id;
   });
   fileList.value.splice(index, 1);
   props.modelValue.splice(index, 1);
-  emits("handleChange", props.modelValue);
   emits("update:modelValue", props.modelValue);
 };
+
 </script>
 
 <style lang="scss" scoped>

src/components/aboutTable/FormMessage.vue

@@ -9,8 +9,6 @@
           <!-- input表单 input lx:textarea || number-->
           <MOSTY.Other v-if="item.type == 'input'" :type="item.lx" :rows="item.rows || 4" width="100%" clearable
             v-model="listQuery[item.prop]" :placeholder="`请输入${item.label}`" :disabled="item.disabled" />
-          <!-- <el-input v-model="listQuery[item.prop]" v-else-if="item.lx == 'textarea'" type="textarea" :rows="3"
-            :placeholder="`请输入${item.label}`" :disabled="item.disabled" /> -->
           <!-- 数值 number-->
           <el-input-number v-else-if="item.type == 'number'" @change="handleNum" v-model="listQuery[item.prop]"
             style="width:100%" :min="item.min || 0" :max="item.max || 1000" />
@@ -31,7 +29,7 @@
           <MOSTY.Date v-else-if="item.type == 'date'" :type="item.lx ? item.lx : 'date'" width="100%" clearable
             v-model="listQuery[item.prop]" />
           <!-- 上传 upload  limit:'限制张数'-->
-          <MOSTY.Upload v-else-if="item.type == 'upload'" :isAll="item.isAll" :showBtn="item.showBtn" :isImg="item.isImg" :limit="item.limit" width="100%"
+          <MOSTY.Upload v-else-if="item.type == 'upload'" :isAll="item.isAll" :key="item.prop" :showBtn="item.showBtn" :isImg="item.isImg" :limit="item.limit" width="100%"
             v-model="listQuery[item.prop]" />
           <!--选择checkbox -->
           <MOSTY.CheckBox v-else-if="item.type == 'checkbox'" width="100%" clearable v-model="listQuery[item.prop]"
@@ -151,10 +149,13 @@ const handleNum = (val) => {
 
 watch(() => props.modelValue, (newVal) => {
   listQuery.value = newVal; //赋值
+  console.log(newVal,'===newVal');
+  
 }, { immediate: true, deep: true });
 
 watch(() => listQuery.value, (newVal) => {
   emits('update:modelValue', newVal)
+  console.log(newVal,'===newVal111');
 }, { immediate: true, deep: true });
 
 defineExpose({ submit, reset });

src/views/securityManagement/personnelManagement/practitioner/components/addPractitionerDialog.vue

@@ -18,10 +18,10 @@
 </template>
 
 <script setup>
-import { ref, computed, reactive, getCurrentInstance } from 'vue'
+import { ref, reactive, getCurrentInstance } from 'vue'
 import { qcckPost } from "@/api/qcckApi.js";
 import FormMessage from '@/components/aboutTable/FormMessage.vue'
-
+import * as rule from "@/utils/rules.js";
 const { proxy } = getCurrentInstance()
 const { D_BZ_WHCD, D_BAXX_GWLX } = proxy.$dict("D_BZ_WHCD", "D_BAXX_GWLX");
 const title = ref('新增从业人员')
@@ -35,18 +35,8 @@ const props = defineProps({
     default: false
   },
 })
-
 const emits = defineEmits(['update:modelValue', 'refresh'])
-
+const dialogVisible = ref(false)
-const dialogVisible = computed({
-  get() {
-    return props.modelValue
-  },
-  set(val) {
-    emits('update:modelValue', val)
-  }
-})
-
 const formList = reactive([
   [
     { label: "姓名", prop: "xm", type: "input" },
@@ -75,40 +65,8 @@ const formList = reactive([
 
 const rules = {
   xm: [{ required: true, message: "请输入姓名", trigger: "change" }],
-  sfzh: [
+  ...rule.phoneRule({ validator: true,message: "请输入联系电话",require: true }, "lxdh"), // 是否必填 是否进行校验`
-    { required: true, message: "请输入证件号码", trigger: "change" },
+  ...rule.identityCardRule({ validator: true,message: "请输入身份证号" ,require: true}, "sfzh"), // 是否必填 是否进行校验
-    {
-      validator: (rule, value, callback) => {
-        if (!value) {
-          callback()
-        } else {
-          const reg = /^(\d{15}|\d{17}[\dXx])$/;
-          if (!reg.test(value)) {
-            callback(new Error("请输入正确的身份证号码"))
-          } else {
-            callback()
-          }
-        }
-      }
-    }
-  ],
-  lxdh: [
-    { required: true, message: "请输入联系电话", trigger: "change" },
-    {
-      validator: (rule, value, callback) => {
-        if (!value) {
-          callback()
-        } else {
-          const reg = /^1[34578]\d{9}$/
-          if (!reg.test(value)) {
-            callback(new Error("请输入正确的手机号"))
-          } else {
-            callback()
-          }
-        }
-      }
-    }
-  ],
   jzdz: [{ required: true, message: "请输入居住地址", trigger: "change" }],
   rzsj: [{ required: true, message: "请选择入职时间", trigger: "change" }],
   zgzbh: [{ required: true, message: "请输入资格证编号", trigger: "change" }],
@@ -124,12 +82,15 @@ const formData = ref({})
 
 const close = () => {
   FormRef.value?.reset();
+  formData.value = {}
   dialogVisible.value = false
 }
 
 const open = (row = {}, type = 'add') => {
   dialogVisible.value = true
   disabled.value = false
+  row.tp = row.tp ? row.tp.split(','):[]
+  row.bazzp = row.bazzp ? row.bazzp.split(','):[]
   formData.value = { ...row }
   if (type === 'add') {
     title.value = '新增从业人员'
@@ -145,7 +106,10 @@ const save = () => {
   FormRef.value.submit(() => {
     loading.value = true;
     const url = !formData.value?.id ? `/mosty-base/baxx/cyry/add` : `/mosty-base/baxx/cyry/edit`;
-    qcckPost(formData.value, url).then(() => {
+    let params = { ...formData.value }
+    params.tp = params.tp ? params.tp.join(','):''
+    params.bazzp =params.bazzp ? params.bazzp.join(','):''
+    qcckPost(params, url).then(() => {
       loading.value = false;
       proxy.$message.success("保存成功");
       emits("refresh");

src/views/securityManagement/personnelManagement/practitioner/index.vue

@@ -80,7 +80,7 @@ const searchConfiger = ref([
 ]);
 
 const pageData = reactive({
-  tableData: [{}],
+  tableData: [],
   keyCount: 0,
   tableConfiger: {
     rowHieght: 61,