今日需求 今晚上线

src/views/modules/base/epidemic/natFocus/natFocusEdit.vue

@@ -1,83 +1,120 @@
 <template>
   <div class="epidemic-form">
     <div class="dialog-h-content scroll-h">
-
+      <el-form
-      <el-form ref="ref_form1"
+        ref="ref_form1"
-               :inline="true"
+        :inline="true"
-               :model="formData"
+        :model="formData"
-               :disabled="formType==='detail'"
+        :disabled="formType === 'detail'"
-               class="form">
+        class="form"
-
+      >
-        <el-form-item label="姓名"
+        <el-form-item
-                      prop="name"
+          label="姓名"
-                      label-width="150px"
+          prop="name"
-                      style="display: block">
+          label-width="150px"
-          <span>{{formData.name}}</span>
+          style="display: block"
+        >
+          <span>{{ formData.name }}</span>
           <!-- <el-input class="item_width_2"
                     placeholder="请输入姓名"
                     clearable
 
                     v-model="formData.name">
           </el-input> -->
-
         </el-form-item>
 
-        <el-form-item label="手机号"
+        <el-form-item
-                      prop="mobile"
+          label="手机号"
-                      label-width="150px"
+          prop="mobile"
-                      style="display: block">
+          label-width="150px"
-          <span>{{formData.mobile}}</span>
+          style="display: block"
+        >
+          <span>{{ formData.mobile }}</span>
           <!-- <el-input class="item_width_2"
                     placeholder="请输入手机号"
                     clearable
                     v-model="formData.mobile">
           </el-input> -->
         </el-form-item>
-        <el-form-item label="证件号"
+        <el-form-item
-                      prop="idCard"
+          label="证件号"
-                      label-width="150px"
+          prop="idCard"
-                      style="display: block">
+          label-width="150px"
-          <span>{{formData.idCard}}</span>
+          style="display: block"
+        >
+          <span>{{ formData.idCard }}</span>
           <!-- <el-input class="item_width_2"
                     placeholder="请输入身份证号"
                     clearable
                     v-model="formData.idCard">
           </el-input> -->
         </el-form-item>
-        <el-form-item label="关注原因"
+        <el-form-item
-                      prop="reason"
+          label="关注原因"
-                      label-width="150px"
+          prop="reason"
-                      style="display: block">
+          label-width="150px"
-
+          style="display: block"
-          <el-input class="item_width_1"
+        >
-                    placeholder="请输入关注原因"
+          <el-input
-                    clearable
+            class="item_width_1"
-                    v-model="formData.reason">
+            placeholder="请输入关注原因"
+            clearable
+            v-model="formData.reason"
+          >
           </el-input>
         </el-form-item>
-        <el-form-item label="备注"
+        <el-form-item
-                      prop="remark"
+          label="隔离状态"
-                      label-width="150px"
+          prop="reason"
-                      style="display: block">
+          label-width="150px"
-          <el-input class="item_width_1"
+          style="display: block"
-                    type="textarea"
+        >
-                    :disabled="formType==='detail'"
+          <el-select
-                    maxlength="500"
+            v-model="formData.isolatedState"
-                    show-word-limit
+            placeholder="请选择"
-                    :autosize="{ minRows: 2, maxRows: 5 }"
+            clearable
-                    clearable
+          >
-                    placeholder="请输入通知备注"
+            <el-option
-                    v-model="formData.remark"></el-input>
+              v-for="item in options.isolatedState"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value"
+            >
+            </el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item
+          label="备注"
+          prop="remark"
+          label-width="150px"
+          style="display: block"
+        >
+          <el-input
+            class="item_width_1"
+            type="textarea"
+            :disabled="formType === 'detail'"
+            maxlength="500"
+            show-word-limit
+            :autosize="{ minRows: 2, maxRows: 5 }"
+            clearable
+            placeholder="请输入通知备注"
+            v-model="formData.remark"
+          ></el-input>
         </el-form-item>
-        <div v-if=" formType!=='detail'">
+        <div v-if="formType !== 'detail'">
-          <el-form-item label="通知渠道"
+          <el-form-item
-                        prop="channel"
+            label="通知渠道"
-                        label-width="150px"
+            prop="channel"
-                        style="display: block">
+            label-width="150px"
-            <el-checkbox v-model="formData.isSelChannel"
+            style="display: block"
-                         @change="handleChannelChange"
+          >
-                         key="0"
+            <el-checkbox
-                         label="0">小程序通知</el-checkbox>
+              v-model="formData.isSelChannel"
+              @change="handleChannelChange"
+              key="0"
+              label="0"
+              >小程序通知</el-checkbox
+            >
             <!-- <el-checkbox-group v-model="formData.channel">
               <el-checkbox key="0"
                            label="0">小程序通知</el-checkbox>
@@ -87,238 +124,225 @@
             </el-checkbox-group> -->
           </el-form-item>
 
-          <el-form-item v-if="formData.isSelChannel"
+          <el-form-item
-                        label="通知内容"
+            v-if="formData.isSelChannel"
-                        prop="content"
+            label="通知内容"
-                        label-width="150px"
+            prop="content"
-                        style="display: block">
+            label-width="150px"
-            <el-input class="item_width_1"
+            style="display: block"
-                      type="textarea"
+          >
-                      maxlength="500"
+            <el-input
-                      show-word-limit
+              class="item_width_1"
-                      :autosize="{ minRows: 4, maxRows: 10 }"
+              type="textarea"
-                      clearable
+              maxlength="500"
-                      placeholder="请输入通知内容"
+              show-word-limit
-                      v-model="formData.content"></el-input>
+              :autosize="{ minRows: 4, maxRows: 10 }"
+              clearable
+              placeholder="请输入通知内容"
+              v-model="formData.content"
+            ></el-input>
           </el-form-item>
         </div>
       </el-form>
-
     </div>
 
     <div class="form_div_btn">
-      <el-button size="small"
+      <el-button size="small" @click="handleCancle">取 消</el-button>
-                 @click="handleCancle">取 消</el-button>
+      <el-button
-      <el-button v-if="formType!=='detail'"
+        v-if="formType !== 'detail'"
-                 size="small"
+        size="small"
-                 type="primary"
+        type="primary"
-                 :disabled="btnDisable"
+        :disabled="btnDisable"
-                 @click="handleComfirm">确 定</el-button>
+        @click="handleComfirm"
+        >确 定</el-button
+      >
     </div>
-
   </div>
 </template>
 
 <script>
+import { Loading } from "element-ui"; // 引入Loading服务
+import { requestPost } from "@/js/dai/request";
+import { mapGetters } from "vuex";
+
+let loading; // 加载动画
+function iniGetFmData() {
+  return {
+    attentionType: 2,
+    name: "",
+    idCard: "",
+    mobile: "",
+    reason: "",
+    remark: "",
+    isSelChannel: false,
+    channel: [],
+    content: "",
+
+    isolatedState: "", //隔离状态
+  };
+}
 
-import { Loading } from 'element-ui' // 引入Loading服务
-import { requestPost } from '@/js/dai/request'
-import { mapGetters } from 'vuex'
-
-
-let loading // 加载动画
 export default {
-  data () {
+  data() {
     return {
-
       formType: "edit",
 
       gridList: [],
 
       btnDisable: false,
 
-      formData: {
+      formData: iniGetFmData(),
-        attentionType: 2,
-        name: '',
-        idCard: '',
-        mobile: '',
-        reason: '',
-        remark: '',
-        isSelChannel: false,
-        channel: [],
-        content: '',
-      },
 
-    }
+      options: {
+        isolatedState: [],
+      },
+    };
   },
+
   components: {},
-  async mounted () {
 
+  async mounted() {
+    this.getFmOptions("isolatedState", "/sys/dict/data/dictlist", {
+      dictType: "isolatedState",
+    });
   },
 
-  destroyed () {
+  destroyed() {},
-
-  },
 
   methods: {
-    handleChannelChange (val) {
+    handleChannelChange(val) {
-      this.formData.content = ''
+      this.formData.content = "";
     },
 
-    async initForm (formType, row) {
+    async initForm(formType, row) {
-      this.formType = formType
+      this.formType = formType;
-      this.$refs['ref_form1'].resetFields();
+      this.$refs["ref_form1"].resetFields();
-      row.channel = []
+      row.channel = [];
-      row.content = ''
+      row.content = "";
-      row.attentionType = 2
+      row.attentionType = 2;
-      row.isSelChannel = false
+      row.isSelChannel = false;
-      this.formData = JSON.parse(JSON.stringify(row))
+      this.formData = JSON.parse(JSON.stringify(row));
-
     },
 
-
+    async handleComfirm() {
-    async handleComfirm () {
       if (this.formData.isSelChannel) {
         if (!this.formData.content) {
           this.$message({
-            type: 'warning',
+            type: "warning",
-            message: '请填写通知内容'
+            message: "请填写通知内容",
-          })
+          });
           return false;
         } else {
-          this.formData.channel = ['0']
+          this.formData.channel = ["0"];
         }
-
       } else {
-        this.formData.channel = []
+        this.formData.channel = [];
       }
 
-      this.btnDisable = true
+      this.btnDisable = true;
       setTimeout(() => {
-        this.btnDisable = false
+        this.btnDisable = false;
-      }, 5000)
+      }, 5000);
-      let url = '/epmetuser/icEpidemicSpecialAttention/vaccination-update'
+      let url = "/epmetuser/icEpidemicSpecialAttention/vaccination-update";
 
       // url = "http://yapi.elinkservice.cn/mock/245/epmetuser/icEpidemicSpecialAttention/vaccination-update"
 
-      const { data, code, msg } = await requestPost(url, this.formData)
+      const { data, code, msg } = await requestPost(url, this.formData);
 
       if (code === 0) {
         this.$message({
-          type: 'success',
+          type: "success",
-          message: '操作成功'
+          message: "操作成功",
-        })
+        });
-        this.resetData()
+        this.resetData();
-        this.$emit('dialogOk')
+        this.$emit("dialogOk");
-        this.btnDisable = false
+        this.btnDisable = false;
-
       } else {
-        this.btnDisable = false
+        this.btnDisable = false;
-        this.$message.error(msg)
+        this.$message.error(msg);
       }
-
     },
 
-    handleCancle () {
+    handleCancle() {
-
+      this.resetData();
-      this.resetData()
+      this.$emit("dialogCancle");
-      this.$emit('dialogCancle')
-
     },
 
+    async getFmOptions(field, url, params, cookFn) {
+      const { data, code, msg } = await requestPost(url, {
+        ...params,
+      });
 
+      if (code === 0) {
+        this.options[field] =
+          typeof cookFn == "function" ? cookFn(data) : data || [];
+      } else {
+        this.$message.error("请求基础数据失败！");
+      }
+    },
 
-    resetData () {
+    resetData() {
-      this.veroId = ''
+      this.veroId = "";
-
-      this.formData = {
-        attentionType: 2,
-        name: '',
-        idCard: '',
-        mobile: '',
-        reason: '',
-        remark: '',
-        isSelChannel: false,
-        channel: [],
-        content: '',
 
-      }
+      this.formData = iniGetFmData();
     },
 
-    handleSizeChange (val) {
+    handleSizeChange(val) {
-      this.pageSize = val
+      this.pageSize = val;
-      this.pageNo = 1
+      this.pageNo = 1;
-      this.loadTable()
+      this.loadTable();
     },
-    handleCurrentChange (val) {
+    handleCurrentChange(val) {
-      this.pageNo = val
+      this.pageNo = val;
-      this.loadTable()
+      this.loadTable();
     },
 
-
     // 开启加载动画
-    startLoading () {
+    startLoading() {
       loading = Loading.service({
         lock: true, // 是否锁定
-        text: '正在加载……', // 加载中需要显示的文字
+        text: "正在加载……", // 加载中需要显示的文字
-        background: 'rgba(0,0,0,.7)' // 背景颜色
+        background: "rgba(0,0,0,.7)", // 背景颜色
-      })
+      });
     },
     // 结束加载动画
-    endLoading () {
+    endLoading() {
       // clearTimeout(timer);
       if (loading) {
-        loading.close()
+        loading.close();
       }
-    }
+    },
   },
   computed: {
-    tableHeight () {
+    tableHeight() {
-      return 200
+      return 200;
-
     },
 
-    ...mapGetters(['clientHeight', 'iframeHeight']),
+    ...mapGetters(["clientHeight", "iframeHeight"]),
-    dataRule () {
+    dataRule() {
       return {
-        name: [
+        name: [{ required: true, message: "姓名不能为空", trigger: "blur" }],
-          { required: true, message: '姓名不能为空', trigger: 'blur' }
-        ],
         idCard: [
-          { required: true, message: '证件号不能为空', trigger: 'blur' }
+          { required: true, message: "证件号不能为空", trigger: "blur" },
         ],
         mobile: [
-          { required: true, message: '手机号不能为空', trigger: 'blur' },
+          { required: true, message: "手机号不能为空", trigger: "blur" },
-        ],
-
-
-
-        channel: [
-          { required: false },
-        ],
-        content: [
-          { required: false },
         ],
 
-      }
+        channel: [{ required: false }],
+        content: [{ required: false }],
+      };
     },
-
   },
   props: {
-
-
-
     // serviceList: {
     //   type: Array,
     //   default: []
     // },
-  }
+  },
-}
+};
 </script>
 
-
+<style lang="scss" scoped>
-<style lang="scss" scoped >
 @import "@/assets/scss/modules/management/epidemic.scss";
 </style>
-
-