对接

shj

2022-08-06 d6b4708cede4ae7a5e06d5fb10271d4ea1132986

 src/views/contingencyManagement/emergencyResources/emergencyMaterialsInspection/component/openAdd.vue

@@ -1,28 +1,12 @@
<template>
  <div class="system-edit-user-container">
    <el-dialog
        :title="titles"
        v-model="isShowDialog"
        width="769px"
        draggable
        :fullscreen="full"
    >
      <el-dialog :title="titles" @close="resetForm(ruleFormRef)" v-model="isShowDialog" width="50%" draggable :fullscreen="full">
      <el-button @click="toggleFullscreen" size="small" class="pot" :icon="FullScreen"></el-button>
      <el-form
          ref="ruleFormRef"
          :model="ruleForm"
          size="default"
          label-width="120px"
          :disabled="disabled"
      >
         <el-form ref="ruleFormRef" :disabled="titles=='查看应急物资检查'?true:false" :rules="rules" :model="ruleForm" size="default" label-width="120px">
        <el-row :gutter="35">
          <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
            <el-form-item label="应急物资" prop="suppliesId">
              <el-input
                  v-model="ruleForm.suppliesId"
                  placeholder="请选择"
                  class="input-with-select"
              >
                  <el-form-item label="应急物资" prop="suppliesName">
                     <el-input v-model="ruleForm.suppliesName" placeholder="请选择" class="input-with-select">
                <template #append>
                  <el-button :icon="Search" @click="daiInpt"/>
                </template>
@@ -32,20 +16,16 @@
          <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
            <el-form-item label="检查结果" prop="inspectResult">
              <el-select v-model="ruleForm.inspectResult" class="w100" placeholder="请选择">
                <el-option label="正常" value="正常"></el-option>
                <el-option label="异常" value="异常"></el-option>
                        <el-option label="正常" value="1"></el-option>
                        <el-option label="异常" value="2"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
            <el-form-item label="创建人" prop="userUid">
              <el-input
                  v-model="ruleForm.userUid"
                  placeholder="请选择"
                  class="input-with-select"
              >
                  <el-form-item label="创建人" prop="userName">
                     <el-input v-model="ruleForm.userName" placeholder="请选择" class="input-with-select">
                <template #append>
                  <el-button :icon="Search" @click="openUser" />
                           <el-button :icon="Search" @click="openUser(0)" />
                </template>
              </el-input>
            </el-form-item>
@@ -66,78 +46,91 @@
      <template #footer>
            <span class="dialog-footer">
               <el-button @click="resetForm(ruleFormRef)" size="default">关闭</el-button>
          <el-button size="default" type="primary" v-if="disabled == true ? false : true" @click="submitForm(titles, ruleFormRef)">确定</el-button>
               <el-button size="default" type="primary" v-if="titles=='查看应急物资检查'?false:true" @click="submitForm(titles, ruleFormRef)">确定</el-button>
            </span>
      </template>
    </el-dialog>
    <EmergencySupplies ref="showRef" @SearchUser="onUser"/>
    <userSelections ref="userRef"/>
      <DailogSearchUser ref="userRef" @SearchUser="onUsers" />
  </div>
</template>

<script lang="ts">
import {
  ref,
  defineComponent
} from 'vue';
import { ref, defineComponent, reactive } from 'vue';

import type {
  FormInstance,
  // FormRules,
} from 'element-plus'
import type { FormInstance, FormRules } from 'element-plus';
import { ElMessage } from 'element-plus';
import {
  Search,
  FullScreen,
} from '@element-plus/icons-vue'
import EmergencySupplies from '/@/components/emergencySupplies/index.vue'
import UserSelections from "/@/components/userSelections/index.vue"
import {emergencyMaterialsInspectionApi} from "/@/api/emergencyMaterialsInspection";
import {maintenanceEmergencyMaterialsApi} from "/@/api/maintenanceEmergencyMaterials";
import DailogSearchUser from '/@/components/DailogSearchUser/index.vue';
import { Search, FullScreen } from '@element-plus/icons-vue';
import EmergencySupplies from '/@/components/emergencySupplies/index.vue';
import UserSelections from '/@/components/userSelections/index.vue';
import { emergencyMaterialsInspectionApi } from '/@/api/emergencyMaterialsInspection';
import { maintenanceEmergencyMaterialsApi } from '/@/api/maintenanceEmergencyMaterials';

export default defineComponent({
  name: 'openAdd',
  components: {
    UserSelections,
      DailogSearchUser,
    EmergencySupplies,
  },
  setup(props, { emit }) {
    const isShowDialog = ref(false)
      const isShowDialog = ref(false);

    const ruleFormRef = ref<FormInstance>()
      const ruleFormRef = ref<FormInstance>();
    //定义表单
    const ruleForm = ref ({
      suppliesId: '', // 物资ID
      inspectResult: '', //检查结果
      inspectTime: '', // 创建时间
      userList:[
        {
          userUid: ''
        },
        {
          userUid: ''
        }
      ]
         userList: [],
    });
    const titles = ref();
    const disabled = ref();
      const disableds = ref();
    // 打开弹窗
    const openDialog = (title: string, id: number, type: boolean) => {
      const openDialog = (title: string, id: number) => {
      isShowDialog.value = true;
      titles.value = title;
      disabled.value = type;
      if (title == '查看应急物资检查' || title == '修改应急物资检查') {
        emergencyMaterialsInspectionApi()
            .seeEmergencyMaterialsInspection(id)
            .then((res) => {
              if (res.data.code == 200) {
                ruleForm.value = res.data.data;
                     let arr = [];
                     for (let i = 0; i < ruleForm.value.userList.length; i++) {
                        arr.push(ruleForm.value.userList[i].userName);
                     }
                     ruleForm.value.userName = arr.toString();
              }
            });
      }
    };
    //日期选择器
    const value1 = ref('')
      const value1 = ref('');
      const rules = reactive<FormRules>({
         nameTitle: [],
         inspectResult: [
            {
               required: true,
               message: '保养结果不能为空',
               trigger: 'change',
            },
         ],
         userName: [
            {
               required: true,
               message: '创建人不能为空',
               trigger: 'change',
            },
         ],
         inspectTime: [
            {
               required: true,
               message: '创建时间不能为空',
               trigger: 'blur',
            },
         ],
      });
    // 表单提交验证必填项
    const submitForm = async (title: string, formEl: FormInstance | undefined) => {
      if (title == '新建应急物资检查') {
@@ -169,8 +162,7 @@
            console.log('error submit!', fields);
          }
        });
      }
      else if (title == '修改应急物资检查') {
         } else if (title == '修改应急物资检查') {
        if (!formEl) return;
        await formEl.validate((valid, fields) => {
          if (valid) {
@@ -200,38 +192,37 @@
          }
        });
        formEl.resetFields();
        ruleForm.value = {
          suppliesId: '', // 物资ID
          inspectResult: '', //检查结果
          inspectTime: '', // 创建时间
          userList:[
            {
              userUid: ''
            },
            {
              userUid: ''
            }
          ]
        }
      }
    }
      };
    const resetForm = (formEl: FormInstance | undefined) => {
      isShowDialog.value = false;
      if (!formEl) return;
      formEl.resetFields();
    };
    // 应急物资弹窗
    const showRef=ref()
      const showRef = ref();
    const daiInpt=()=>{
      showRef.value.openDailog()
    }
         showRef.value.openDailog();
      };
    const onUser = (e:any) => {
      ruleForm.value.suppliesId=e.id
         ruleForm.value.suppliesId = e.id;
         ruleForm.value.suppliesName = e.name;
    };
    // 编写人弹窗
    const userRef = ref();
    const openUser = () => {
      userRef.value.openDialog();
      const openUser = (data: any) => {
         userRef.value.openDailog(data);
      };
      const onUsers = (val: any) => {
         let arr = [];
         for (let i = 0; i < val.length; i++) {
            arr.push(val[i].realName);
            ruleForm.value.userList.push({
               userUid: val[i].uid,
               userName: val[i].realName,
            });
         }
         ruleForm.value.userName = arr.toString();
    };
    //全屏
    const full = ref(false);
@@ -248,18 +239,20 @@
      Search,
      ruleForm,
      value1,
         onUsers,
      daiInpt,
      showRef,
      ruleFormRef,
      submitForm,
      openUser,
         rules,
      userRef,
      resetForm,
      toggleFullscreen,
      FullScreen,
      full,
      titles,
      disabled,
         disableds,
      emit,
      onUser,
    };