Your Name
2022-09-08 5a1616f169d75ece07d2d12a8edac3e5f660a920
src/views/contingencyManagement/abolishDialog/component/lowerPlate.vue
@@ -0,0 +1,120 @@
<template>
   <div class="box">
      <el-form ref="formS" :model="form" :rules="rules" label-width="120px">
         <el-row>
            <el-col :span="15">
               <el-form-item label="流程标题">
                  <el-input v-model="form.names" />
               </el-form-item>
            </el-col>
         </el-row>
         <el-row>
            <el-col :span="15">
               <el-form-item label="下级审批日期">
                  <el-date-picker v-model="form.date1" type="date" placeholder="下级审批日期" style="width: 100%" />
               </el-form-item>
            </el-col>
         </el-row>
         <el-row>
            <el-col :span="15">
               <el-form-item label="">
                     <el-checkbox v-model="form.delivery" label="是否抄送" @change="typeChang"/>
               </el-form-item>
            </el-col>
         </el-row>
         <el-row v-if="form.delivery">
            <el-col :span="15">
               <el-form-item label="抄送给" prop="resource">
                  <el-input v-model="form.resource" placeholder="">
                     <template #append> <el-button :icon="Search" @click="openDai" /> </template
                  ></el-input>
               </el-form-item>
            </el-col>
         </el-row>
         <el-row>
            <el-col :span="15">
               <el-form-item label="">
                  <el-checkbox v-model="form.type" label="指定下一步处理者(不设置就使用默认处理人)"/>
               </el-form-item>
            </el-col>
         </el-row>
         <el-row v-if="form.type">
            <el-col :span="15">
               <el-form-item label="指定" prop="desc">
                  <el-input v-model="form.desc" placeholder="">
                     <template #append> <el-button :icon="Search" @click="openDai" /> </template
                  ></el-input>
               </el-form-item>
            </el-col>
         </el-row>
      </el-form>
   </div>
   <DailogSearchUser ref="ShowUser"></DailogSearchUser>
</template>
<script lang="ts">
import { defineComponent, ref, reactive } from 'vue';
import DailogSearchUser from '/@/components/DailogSearchUser/index.vue'
import { Search } from '@element-plus/icons-vue';
import type { FormInstance, FormRules } from 'element-plus'
export default defineComponent({
   components:{DailogSearchUser},
   setup() {
      const formS=ref<FormInstance>()
      let form = reactive({
         names: '',
         region: '',
         date1: '',
         date2: '',
         delivery: "",
         type: "",
         resource: '',
         desc: '',
      });
       const typeChang=()=>{
         console.log('tag',form)
      }
      const rules = reactive<FormRules>({
  resource: [
    {
      type: 'array',
      required: true,
      message: '用户不能为空',
      trigger: 'change',
    },
  ],
  desc: [
    {
      required: true,
      message: '用户不能为空',
      trigger: 'change',
    },
  ]})
  const ShowUser=ref()
  const openDai =()=>{
   ShowUser.value.openDailog()
  }
      return {
         form,
         rules,
         formS,
         typeChang,
         ShowUser,
         openDai,
         Search,
      };
   },
});
</script>
<style scoped>
.box {
   margin: 30px 0 100px 0;
   background-color: #fff;
   border: 1px solid #dcdfe6;
   box-shadow: 0 2px 4px 0 rgb(0 0 0 / 12%), 0 0 6px 0 rgb(0 0 0 / 4%);
   padding: 20px;
}
.el-row {
   padding: 0 0 20px 0;
}
</style>