From 5a1616f169d75ece07d2d12a8edac3e5f660a920 Mon Sep 17 00:00:00 2001 From: Your Name <123456> Date: 星期四, 08 九月 2022 09:36:16 +0800 Subject: [PATCH] 合并 --- src/views/contingencyManagement/abolishDialog/component/formInformationTops.vue | 318 +++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 files changed, 318 insertions(+), 0 deletions(-) diff --git a/src/views/contingencyManagement/abolishDialog/component/formInformationTops.vue b/src/views/contingencyManagement/abolishDialog/component/formInformationTops.vue index e69de29..68ae8a6 100644 --- a/src/views/contingencyManagement/abolishDialog/component/formInformationTops.vue +++ b/src/views/contingencyManagement/abolishDialog/component/formInformationTops.vue @@ -0,0 +1,318 @@ +<template> + <el-form ref="form" :model="form" label-width="120px"> + <el-row> + <el-col :span="12"> + <el-form-item label="预案名称"> + <el-input v-model="form.name" disabled placeholder="请填写预案名称"></el-input> + </el-form-item> + </el-col> + <el-col :span="12"> + <el-form-item label="适用部门"> + <el-tree-select + class="select" + placeholder="请选择" + v-model="value" + :data="data" + :render-after-expand="false" + show-checkbox + multiple + clearable + disabled + /> + </el-form-item> + </el-col> + </el-row> + <el-row> + <el-col :span="12"> + <el-form-item label="预案类型"> + <el-select class="select" v-model="form.region" disabled placeholder="请选择"> + <el-option label="综合应急预案" value="shanghai" /> + <el-option label="现场处置方案" value="beijing" /> + <el-option label="专项应急预案" value="shanghai" /> + <el-option label="其它预案" value="beijing" /> + </el-select> + </el-form-item> + </el-col> + <el-col :span="12"> + <el-form-item label="危险源关联"> + <el-select class="select" v-model="form.region" disabled placeholder="请选择"> + <el-option label="是" value="shanghai" /> + <el-option label="否" value="beijing" /> + </el-select> + </el-form-item> + </el-col> + </el-row> + <el-row> + <el-col :span="12"> + <el-form-item label="预案级别"> + <el-select class="select" v-model="form.region" disabled placeholder="请选择"> + <el-option label="公司及" value="shanghai" /> + <el-option label="分厂级" value="beijing" /> + <el-option label="车间级" value="beijing" /> + </el-select> + </el-form-item> + </el-col> + <el-col :span="12"> + <el-form-item label="编写人"> + <el-input + v-model="form.teamLeader" + placeholder="请选择" + class="input-with-select" + disabled + > + <template #append> + <el-button :icon="Search" @click="openUser" disabled/> + </template> + </el-input> + </el-form-item> + </el-col> + </el-row> + <el-row> + <el-col :span="12"> + <el-form-item label="编写部门" disabled placeholder="请选择"> + <el-tree-select + class="select" + v-model="value2" + :data="dataSelect" + :render-after-expand="false" + multiple + check-strictly + check-on-click-node + clearable + disabled + /> + </el-form-item> + </el-col> + <el-col :span="12"> + <el-form-item label="发布实施日期"> + <el-date-picker v-model="datetime" type="datetime" disabled placeholder="选择日期时间" style="width: 100%" /> + </el-form-item> + </el-col> + </el-row> + <el-row> + <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> + <el-form-item label="应急队伍" prop="telephone" @click="daiInpt" > + <el-input + v-model="form.teamLeader" + placeholder="请选择" + class="input-with-select" + disabled + > + <template #append> + <el-button :icon="Search" disabled/> + </template> + </el-input> + </el-form-item> + </el-col> + <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> + <el-form-item label="预案附件"> + <el-upload + v-model:file-list="fileList" + class="upload-demo" + action="https://run.mocky.io/v3/9d059bf9-4660-45f2-925d-ce80ad6c4d15" + :on-change="handleChange" + disabled + > + <el-button type="primary" disabled + >点击上传</el-button> + <template #tip> + <div class="el-upload__tip"> + 添加相关附件 + </div> + </template> + </el-upload> + </el-form-item> + </el-col> + <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> + <el-form-item label="区域名称" prop="telephone"> + <el-input + v-model="form.teamLeader" + placeholder="请选择" + class="input-with-select" + disabled + > + <template #append> + <el-button :icon="Search" disabled @click="regionsDialog"/> + </template> + </el-input> + </el-form-item> + </el-col> + </el-row> + </el-form> + <checkTemplate ref="ShowRef"/> + <userSelections ref="userRef"/> + <RegionsDialog ref="openRef"/> +</template> +<script lang="ts"> +import { + defineComponent, + ref, + reactive +} from 'vue'; +import { + Search +} from '@element-plus/icons-vue' +import UserSelections from "/@/components/userSelections/index.vue" +import CheckTemplate from "/@/components/checkTemplate/index.vue" +import RegionsDialog from "/@/components/regionsDialog/index.vue"; +export default defineComponent({ + components: { + CheckTemplate, + UserSelections, + RegionsDialog, + }, + setup() { + const form = reactive({ + name: '', + value: '', + value2: '', + teamLeader: '', + + // data: '', + // dataSelect: '', + date1: '', + date2: '', + delivery: false, + type: [], + resource: '', + desc: '', + }); + + // 可选择树形选择框 + const value = ref() + + const data = [ + { + value: '1', + label: '广汇能源综合物流发展有限责任公司', + children: [ + { + value: '1-1', + label: '生产运行部', + children: [ + { + value: '1-1-1', + label: '工艺二班', + }, + ], + }, + ], + } + ] + // 树形选择框 + const value2 = ref() + + const dataSelect = [ + { + value: '1', + label: '广汇能源综合物流发展有限责任公司', + children: [ + { + value: '1-1', + label: '生产运行部', + children: [ + { + value: '1-1-1', + label: '工艺二班', + }, + ], + }, + ], + } + ] + // 应急队伍弹窗 + const ShowRef=ref() + const daiInpt=()=>{ + ShowRef.value.openDailog() + } + // 选择区域弹窗 + const openRef=ref() + const regionsDialog=()=>{ + openRef.value.openDailog() + } + // 打开编写人选择用户弹窗 + const userRef = ref(); + const openUser = () => { + userRef.value.openDialog(); + }; + // 日期选择 + const datetime = ref('') + return { + form, + value, + data, + value2, + dataSelect, + openUser, + userRef, + Search, + ShowRef, + daiInpt, + openRef, + datetime, + regionsDialog, + }; + }, +}); +</script> +<style scoped> +.title { + text-align: center; + font-size: 16px; + margin-bottom: 20px; +} +.box { + border: 1px solid #dcdfe6; + box-shadow: 0 2px 4px 0 rgb(0 0 0 / 12%), 0 0 6px 0 rgb(0 0 0 / 4%); +} +.navType { + background-color: #fff; +} +.tiao { + width: 100%; + height: 1px; + background-color: #dcdfe6; + margin: 30px 0; + position: relative; +} +.typeS { + width: 80px; + background-color: #fff; + position: absolute; + left: 30px; + top: -9px; + font-size: 14px; + text-align: center; +} +.logoColor { + background-color: #67c23a; + color: #fff; + padding: 5px 8px; + border-radius: 5px; + margin-right: 5px; +} +.btns { + width: 100%; + padding: 20px 0; + background-color: #fff; + position: fixed; + bottom: 0px; + left: 0px; + text-align: center; + box-shadow: 0 -3px 5px 0 rgb(0 0 0 / 12%); +} +.title2 { + padding: 20px 0 20px 10px; + width: 100%; + border: 1px solid #dcdfe6; +} +.el-row{ + padding:0 0 20px 0; +} +.select{ + width: 100%; +} +.select ::v-deep .el-select{ + width: 100%; +} +</style> -- Gitblit v1.9.2