'风险'

Your Name

2022-07-05 39d90ac360f55f8835920c6e12e5cd1e4246bdcc

 src/views/specialWorkSystem/approvalProcess/reportTypeSetting/index.vue

@@ -1,27 +1,30 @@
<template>
   <div class="home-container">
      <el-scrollbar height="100%">
      <div class="homeCard">
      <el-row>
         <el-button type="primary" size="large" @click="addReport">新建上报类型</el-button>
      </el-row>
      <el-row>
         <el-table :data="tableData" border style="width: 100%">
            <el-table-column prop="id" label="标识" width="180" />
            <el-table-column type="index" label="标识" width="100"/>
            <el-table-column prop="type" label="上报数据类型名称" width="180" />
            <el-table-column prop="founder" label="创建人"/>
            <el-table-column prop="createTime" label="创建时间" width="180" />
            <el-table-column prop="editor" label="最新编辑人" width="180" />
            <el-table-column prop="editorTime" label="最新编辑时间" />
            <el-table-column prop="editeTime" label="最新编辑时间" />
            <el-table-column fixed="right" label="操作" width="180">
               <template #default>
                  <el-button link type="primary" size="small">编辑</el-button>
                  <el-button link type="danger" size="small">删除</el-button>
               <template #default="scope">
                  <el-button link type="primary" size="small" @click="editeRow(scope.$index,scope.row)">编辑</el-button>
                  <el-button link type="danger" size="small" @click="deleteRow(scope.$index)">删除</el-button>
               </template>
            </el-table-column>
         </el-table>
      </el-row>
      <el-dialog v-model="dialogAddForm" title="新建上报类型">
         <el-form :model="reportForm" label-width="120px">
            <el-form-item label="上报数据类型">
      </div>
      <el-dialog v-model="dialogAddForm" title="新建上报类型" @close="dialogColse">
         <el-form :model="reportForm" label-width="120px" ref="ruleFormRef" :rules="addRules">
            <el-form-item label="上报数据类型" prop="type">
               <el-select v-model="reportForm.type" placeholder="选择上报数据类型">
                  <el-option label="上报审批意见" value="上报审批意见" />
                  <el-option label="上报气体监测数据" value="上报气体监测数据" />
@@ -29,20 +32,21 @@
               </el-select>
            </el-form-item>
            <el-form-item label="创建人">
               <el-select v-model="reportForm.founder" placeholder="选择创建人">
               <el-select v-model="reportForm.founder" property="founder" placeholder="选择创建人">
                  <el-option label="创建人1" value="创建人1" />
                  <el-option label="创建人2" value="创建人2" />
               </el-select>
            </el-form-item>
            <el-form-item label="最新编辑人">
            <el-form-item label="最新编辑人" prop="editor">
               <el-input v-model="reportForm.editor" />
            </el-form-item>
            <el-form-item>
               <el-button type="primary" @click="onSubmitAddForm" size="default">确认</el-button>
               <el-button size="default">取消</el-button>
               <el-button type="primary" @click="onSubmitAddForm(ruleFormRef)" size="default">确认</el-button>
               <el-button size="default" @click="dialogAddForm = false">取消</el-button>
            </el-form-item>
         </el-form>
      </el-dialog>
      </el-scrollbar>
   </div>
</template>

@@ -52,7 +56,7 @@
   import { initBackEndControlRoutes } from '/@/router/backEnd';
   import {useUserInfo} from "/@/stores/userInfo";
   import { Session } from '/@/utils/storage';
   import { ElMessage } from 'element-plus'
   import { FormInstance, FormRules } from 'element-plus'
   let global: any = {
      homeChartOne: null,
      homeChartTwo: null,
@@ -66,52 +70,93 @@
   interface type {

   }
   interface User {
      type: string,
      founder: string,
      editor: string
   }
   export default defineComponent({
      name: 'reportTypeSetting',
      setup() {
         const userInfo = useUserInfo()
         const { userInfos } = storeToRefs(userInfo);
         const state  = reactive<stateType>({});
         const tableData = [
         const tableData =reactive([
            {
               id: '0',
               type: '上报审批意见',
               founder: '',
               createTime: '',
               editor: '',
               editorTime: ''
               editeTime: ''
            },
            {
               id: '1',
               type: '上报气体检测数据',
               founder: '',
               createTime: '',
               editor: '',
               editorTime: ''
               editeTime: ''
            },
            {
               id: '2',
               type: '上报安全措施确认',
               founder: '',
               createTime: '',
               editor: '',
               editorTime: ''
               editeTime: ''
            }
         ];
         ])
         const dialogAddForm = ref(false);
         const reportForm = reactive({
            id: '',
         const rowIndex = ref(-1)
         const reportForm = ref({
            type: '',
            founder: '',
            createTime: '',
            editor: '',
            editorTime: ''
            editeTime: ''
         })
         const addReport = ()=>{
            dialogAddForm.value = true
         };
         const onSubmitAddForm = () => {
            console.log('submit!')
         const ruleFormRef = ref<FormInstance>()
         const addRules = reactive<FormRules>({
            type:[{required: true, message: '该内容不能为空',trigger:'blur'}],
            founder:[{required: true, message: '该内容不能为空',trigger:'blur'}],
            editor:[{required: true, message: '该内容不能为空',trigger:'blur'}]
         })
         const onSubmitAddForm = async (formEl: FormInstance | undefined) => {
            if (!formEl) return
            await formEl.validate((valid, fields) => {
               if (valid) {
                  if(rowIndex.value == -1){
                     reportForm.value.createTime = new Date().toLocaleString()
                     reportForm.value.editeTime = new Date().toLocaleString()
                     tableData.push(reportForm.value)
                  }else{
                     tableData[rowIndex.value] = reportForm.value
                  }
                  dialogAddForm.value = false
               } else {
                  console.log('error submit!', fields)
               }
            })
         }
         const editeRow = (index: number, row: User) =>{
            dialogAddForm.value = true
            rowIndex.value = index
            reportForm.value = JSON.parse(JSON.stringify(row))
            reportForm.value.editeTime = new Date().toLocaleString()
         }
         const deleteRow = (index)=>{
            tableData.splice( index,1)
         }
         const dialogColse = () =>{
            reportForm.value = {
               type: '',
               founder: '',
               createTime: '',
               editor: '',
               editeTime: ''
            }
            rowIndex.value = -1
         }
         // 折线图
         const renderMenu = async (value: string) => {
@@ -124,6 +169,11 @@
            tableData,
            dialogAddForm,
            reportForm,
            ruleFormRef,
            addRules,
            dialogColse,
            editeRow,
            deleteRow,
            addReport,
            onSubmitAddForm,
            ...toRefs(state),
@@ -135,8 +185,15 @@
<style scoped lang="scss">
   $homeNavLengh: 8;
   .home-container {
      height: 100%;
      overflow: hidden;
      padding: 80px;
      padding: 20px;
      .homeCard{
         width: 100%;
         padding: 20px;
         background: #fff;
         border-radius: 4px;
      }
      .el-row{
         margin-bottom: 20px;
      }