From b222b2923e4759a86ccae30a85d6653a4b4046f8 Mon Sep 17 00:00:00 2001 From: Your Name <123456> Date: 星期二, 05 七月 2022 19:08:10 +0800 Subject: [PATCH] 风险模块 --- src/views/doublePreventSystem/riskLevelManage/productionDevice/index.vue | 150 +++++++++++++++++++++++++++++++++++++++----------- 1 files changed, 117 insertions(+), 33 deletions(-) diff --git a/src/views/doublePreventSystem/riskLevelManage/productionDevice/index.vue b/src/views/doublePreventSystem/riskLevelManage/productionDevice/index.vue index 76f4724..63d591b 100644 --- a/src/views/doublePreventSystem/riskLevelManage/productionDevice/index.vue +++ b/src/views/doublePreventSystem/riskLevelManage/productionDevice/index.vue @@ -2,7 +2,29 @@ <div class="system-role-container"> <el-card shadow="hover"> <div class="system-user-search mb15"> - <el-input size="default" placeholder="请输入角色名称" style="max-width: 180px"> </el-input> + <div class="basic-search"> + <span>风险等级:</span> + <el-select v-model="productionDeviceData.params.riskLevel" clearable filterable class="ml10" placeholder="请选择风险等级"> + <el-option + v-for="item in levelList" + :key="item.id" + :label="item.name" + :value="item.id" + ></el-option> + </el-select> + </div> + <div class="basic-search"> + <span>部门:</span> + <el-cascader + :options="departmentList" + :props="{ emitPath: false, checkStrictly: true, value: 'id', label: 'name' }" + placeholder="请选择部门" + clearable + filterable + v-model="productionDeviceData.params.depId" + > + </el-cascader> + </div> <el-button size="default" type="primary" class="ml10" @click="handleSearch"> <el-icon> <ele-Search /> @@ -13,7 +35,7 @@ <el-icon> <ele-FolderAdd /> </el-icon> - 新增角色 + 新增装置 </el-button> </div> <el-table :data="productionDeviceData.data" style="width: 100%"> @@ -21,30 +43,45 @@ <el-table-column prop="produceDeviceName" label="生产装置名称" show-overflow-tooltip></el-table-column> <el-table-column prop="depName" label="所属部门" show-overflow-tooltip></el-table-column> <el-table-column prop="riskLevel" label="风险等级" show-overflow-tooltip></el-table-column> - <el-table-column prop="depName" label="区域位置" show-overflow-tooltip></el-table-column> - <el-table-column prop="status" label="状态" show-overflow-tooltip></el-table-column> + <el-table-column prop="location" label="区域位置" show-overflow-tooltip></el-table-column> + <el-table-column prop="status" label="状态" show-overflow-tooltip> + + </el-table-column> <el-table-column prop="createByUserName" label="创建人" show-overflow-tooltip></el-table-column> <el-table-column prop="gtmCreate" label="创建时间" show-overflow-tooltip></el-table-column> <el-table-column prop="lastEditByUserName" label="最后修改人" show-overflow-tooltip></el-table-column> <el-table-column prop="gtmCreate" label="最后修改时间" show-overflow-tooltip></el-table-column> <el-table-column label="操作" width="150"> <template #default="scope"> - <el-button size="small" text type="primary" @click="onOpenDialogRef('新增','')">新增</el-button> <el-button size="small" text type="primary" @click="onOpenDialogRef('修改',scope.row)">修改</el-button> - <el-button size="small" text type="primary" @click="onTabelRowDel(scope.row)">删除</el-button> + <el-button size="small" text type="danger" @click="onDelProductionDevice(scope.row)">删除</el-button> </template> </el-table-column> </el-table> + <el-pagination + @size-change="onHandleSizeChange" + @current-change="onHandleCurrentChange" + class="mt15" + :pager-count="5" + :page-sizes="[10, 20, 30]" + v-model:current-page="productionDeviceData.params.pageIndex" + background + v-model:page-size="productionDeviceData.params.pageSize" + layout="total, sizes, prev, pager, next, jumper" + :total="productionDeviceData.total" + > + </el-pagination> </el-card> - <roleDialog ref="roleDialogRef" @refreshRoleList="initRoleTableData"/> + <productionDeviceDialog ref="productionDeviceDialogRef" @refreshProductionDevice ="initProductionDeviceTableData"/> </div> </template> <script lang="ts"> import { toRefs, reactive, onMounted, ref, defineComponent } from 'vue'; import { ElMessageBox, ElMessage } from 'element-plus'; - import roleDialog from '/@/views/system/role/component/roleDialog.vue'; - import {productionDeviceApi} from "/@/api/productionDevice"; + import productionDeviceDialog from './components/productionDeviceDialog.vue'; + import {productionDeviceApi} from "/@/api/doublePreventSystem/productionDevice/index.ts"; + import { departmentApi } from '/@/api/department'; // 定义接口来定义对象的类型 interface TableData { @@ -63,20 +100,28 @@ params: { pageIndex: number; pageSize: number; - riskLevel:number; - status:number; - depName:string; - location:string; - produceDeviceName:string; + riskLevel: number | null; + status: number; + depId: number | null; + location: string | null; + produceDeviceName: string | null; }; }; + departmentList:Array<DepartmentState>; + levelList:Array<levelListState>; + } + interface levelListState { + + } + interface DepartmentState { + } export default defineComponent({ name: 'productionDevice', - components: { roleDialog }, + components: { productionDeviceDialog }, setup() { - const roleDialogRef = ref(); + const productionDeviceDialogRef = ref(); const state = reactive<TableDataState>({ productionDeviceData: { data: [], @@ -85,19 +130,22 @@ params: { pageIndex: 1, pageSize: 10, - riskLevel:1, - status:1, - depName:"", - location:"", - produceDeviceName:"" + riskLevel: null, + status: 1, + depId: null, + location: null, + produceDeviceName: null }, }, + departmentList:[], + levelList:[{id:1,name:'低风险'},{id:2,name:'一般风险'},{id:3,name:'较大风险'},{id:4,name:'重大风险'},] }); // 初始化表格数据 const initProductionDeviceTableData = async () => { let res = await productionDeviceApi().getProductionDeviceList(state.productionDeviceData.params) if(res.data.code === '200'){ state.productionDeviceData.data = res.data.data; + state.productionDeviceData.total = res.data.count; }else{ ElMessage({ type:'warning', @@ -105,18 +153,44 @@ }) } }; - // 打开新增角色弹窗 + + const getDepartmentData = async () => { + let res = await departmentApi().getDepartmentList() + if(res.data.code === '200'){ + state.departmentList = res.data.data + }else{ + ElMessage({ + type:'warning', + message:res.data.msg + }) + } + } + + // 打开生产装置弹窗 const onOpenDialogRef = (type: string, value: any) => { - roleDialogRef.value.openDialog(type, value); + productionDeviceDialogRef.value.openProductionDeviceDialog(type, value, state.departmentList); }; // 删除角色 - const onRowDel = (row: any) => { - ElMessageBox.confirm(`此操作将永久删除角色名称:“${row.roleName}”,是否继续?`, '提示', { + const onDelProductionDevice = (row: any) => { + ElMessageBox.confirm(`此操作将永久删除角色名称:“${row.produceDeviceName}”,是否继续?`, '提示', { confirmButtonText: '确认', cancelButtonText: '取消', type: 'warning', - }).then(() => { - ElMessage.success('删除成功'); + }).then(async () => { + let res = await productionDeviceApi().deleteProductionDevice({id:row.id}) + if(res.data.code ==='200'){ + ElMessage({ + type:'success', + duration:2000, + message:'删除成功' + }) + await initProductionDeviceTableData() + }else{ + ElMessage({ + type:'warning', + message:res.data.msg + }) + } }).catch(() => {}); }; const handleSearch = () => { @@ -124,27 +198,37 @@ } // 分页改变 const onHandleSizeChange = (val: number) => { - state.productionDeviceData.param.pageSize = val; + state.productionDeviceData.params.pageSize = val; + initProductionDeviceTableData() }; // 分页改变 const onHandleCurrentChange = (val: number) => { - state.productionDeviceData.param.pageNum = val; + state.productionDeviceData.params.pageIndex = val; + initProductionDeviceTableData() }; // 页面加载时 onMounted(() => { initProductionDeviceTableData(); + getDepartmentData(); }); return { - onRowDel, - roleDialog, handleSearch, - roleDialogRef, onOpenDialogRef, - initProductionDeviceTableData, onHandleSizeChange, + onDelProductionDevice, onHandleCurrentChange, + productionDeviceDialog, + productionDeviceDialogRef, + initProductionDeviceTableData, ...toRefs(state), }; }, }); </script> + +<style scoped> +.basic-search{ + display:inline-block; + padding-left: 10px; +} +</style> -- Gitblit v1.9.2