| | |
| | | <template> |
| | | <el-dialog v-model="dialogVisible" :fullscreen="full" title="Tips" width="50%" :before-close="handleClose"> |
| | | <el-button @click="toggleFullscreen" size="small" class="pot" :icon="FullScreen"></el-button> |
| | | <el-form :model="form" label-width="120px"> |
| | | <el-row> |
| | | <el-col :span="11"> |
| | | <el-form-item label="安全目标指标" size="default"> |
| | | <el-input v-model="form.name"></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="11" :offset="2"> |
| | | <el-form-item label="目标指标编号" size="default"> |
| | | <el-input v-model="form.name" /> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row> |
| | | <el-col :span="11"> |
| | | <el-form-item label="年度" size="default"> |
| | | <el-input v-model="form.name" /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="11" :offset="2"> |
| | | <el-form-item label="责任部门" size="default"> |
| | | <el-input v-model="form.name" /> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row> |
| | | <el-col :span="11"> |
| | | <el-form-item label="改进期限" size="default"> |
| | | <el-date-picker v-model="form.date1" type="date" placeholder="选择日期时间" style="width: 100%" /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="11" :offset="2" > |
| | | <el-form-item label="发起人" size="default"> |
| | | <el-input v-model="model"></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row> |
| | | <el-col :span="11"> |
| | | <el-form-item label="发起时间" size="default"> |
| | | <el-date-picker v-model="form.date1" type="date" placeholder="选择日期时间" style="width: 100%" /> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | </el-form> |
| | | <el-tabs v-model="activeName" class="demo-tabs"> |
| | | <el-tab-pane label="目标指标" name="first"></el-tab-pane> |
| | | </el-tabs> |
| | | <template #footer> |
| | | <span class="dialog-footer"> |
| | | <el-button @click="dialogVisible = false">关闭</el-button> |
| | | </span> |
| | | </template> |
| | | </el-dialog> |
| | | </template> |
| | | <script lang="ts"> |
| | | import { defineComponent, ref, reactive } from 'vue'; |
| | | import { Plus, Delete, Upload, Download, Refresh, View, Search, FullScreen } from '@element-plus/icons-vue'; |
| | | export default defineComponent({ |
| | | setup() { |
| | | const dialogVisible = ref(false); |
| | | const form = reactive({ |
| | | name: '', |
| | | region: '', |
| | | date1: '', |
| | | date2: '', |
| | | delivery: false, |
| | | type: [], |
| | | resource: '', |
| | | desc: '', |
| | | }); |
| | | const openDailog = () => { |
| | | dialogVisible.value = true; |
| | | }; |
| | | const activeName = ref('first'); |
| | | //全屏 |
| | | const full = ref(false); |
| | | const toggleFullscreen = () => { |
| | | if (full.value == false) { |
| | | full.value = true; |
| | | } else { |
| | | full.value = false; |
| | | } |
| | | }; |
| | | return { |
| | | dialogVisible, |
| | | form, |
| | | openDailog, |
| | | activeName, |
| | | Search, |
| | | full, |
| | | toggleFullscreen, |
| | | FullScreen, |
| | | }; |
| | | }, |
| | | }); |
| | | </script> |
| | | <style scoped> |
| | | .el-row { |
| | | padding: 0 0 20px 0; |
| | | } |
| | | </style> |