From 23f1bf22c42a904c05cee63e10c9fd8b60dfe8f5 Mon Sep 17 00:00:00 2001 From: Admin <978517621@qq.com> Date: 星期二, 20 九月 2022 14:54:56 +0800 Subject: [PATCH] Default Changelist --- src/views/doublePrevent/riskLevel/device/index.vue | 102 +++++++++++++++++++++++++++++++++------------------ 1 files changed, 66 insertions(+), 36 deletions(-) diff --git a/src/views/doublePrevent/riskLevel/device/index.vue b/src/views/doublePrevent/riskLevel/device/index.vue index 8a7bdfe..048fbf5 100644 --- a/src/views/doublePrevent/riskLevel/device/index.vue +++ b/src/views/doublePrevent/riskLevel/device/index.vue @@ -3,23 +3,18 @@ <el-card shadow="hover"> <div class="system-user-search mb15"> <div class="basic-line"> - <span>风险等级:</span> + <span>生产装置名称: </span> + <el-input v-model="productionDeviceData.params.produceDeviceName" class="input-box"> </el-input> + </div> + <div class="basic-line"> + <span>风险等级: </span> <el-select v-model="productionDeviceData.params.riskLevel" clearable filterable class="input-box" 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-line"> - <span>部门:</span> - <el-cascader - :options="departmentList" - :props="{ emitPath: false, checkStrictly: true, value: 'depId', label: 'depName' }" - placeholder="请选择部门" - clearable - filterable - class="input-box" - v-model="productionDeviceData.params.depId" - > - </el-cascader> + <span>部门: </span> + <el-cascader :options="departmentList" :props="{ emitPath: false, checkStrictly: true, value: 'depId', label: 'depName' }" placeholder="请选择部门" clearable filterable class="input-box" v-model="productionDeviceData.params.depId"> </el-cascader> </div> <el-button size="default" type="primary" class="ml10" v-throttle @click="handleSearch"> <el-icon> @@ -38,34 +33,35 @@ <el-table-column type="index" label="序号" width="60" /> <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="riskLevel" label="风险等级" show-overflow-tooltip> + <template #default="scope"> + <el-tag :type="scope.row.riskLevel === 1 ? 'success' : scope.row.riskLevel === 2 ? 'info' : scope.row.riskLevel === 3 ? 'warning' : 'danger'"> + {{ parseNumber(scope.row.riskLevel, '风险等级') }} + </el-tag> + </template> + </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="status" label="状态" show-overflow-tooltip> + <template #default="scope"> + <el-tag :type="scope.row.status === 1 ? 'primary' : 'warning'"> + {{ parseNumber(scope.row.status, '状态') }} + </el-tag> + </template> + </el-table-column> <el-table-column prop="createByUserName" label="创建人" show-overflow-tooltip></el-table-column> <el-table-column prop="gmtCreate" label="创建时间" show-overflow-tooltip></el-table-column> <el-table-column prop="lastEditUserName" label="最后修改人" show-overflow-tooltip></el-table-column> <el-table-column prop="gmtModitify" label="最后修改时间" show-overflow-tooltip></el-table-column> - <el-table-column label="操作" width="150"> + <el-table-column label="操作" width="200" align="center"> <template #default="scope"> - <el-button size="small" text type="primary" @click="onOpenDialogRef('修改', scope.row)">修改</el-button> - <el-button size="small" text type="danger" @click="onDelProductionDevice(scope.row)">删除</el-button> + <el-button size="small" text type="primary" :icon="View" @click="onOpenDialogRef('查看', scope.row)">查看</el-button> + <el-button size="small" text type="primary" :icon="Edit" @click="onOpenDialogRef('修改', scope.row)">修改</el-button> + <el-button size="small" text type="danger" :icon="Delete" @click="onDelProductionDevice(scope.row)">删除</el-button> </template> </el-table-column> </el-table> <br /> - <el-pagination - @size-change="onHandleSizeChange" - @current-change="onHandleCurrentChange" - :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" - class="page-position" - > - </el-pagination> + <el-pagination @size-change="onHandleSizeChange" @current-change="onHandleCurrentChange" :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" class="page-position"> </el-pagination> <br /> <br /> </el-card> @@ -78,7 +74,8 @@ import { ElMessageBox, ElMessage } from 'element-plus'; import productionDeviceDialog from './components/productionDeviceDialog.vue'; import { productionDeviceApi } from '/@/api/doublePreventSystem/productionDevice/index.ts'; -import { departmentApi } from '/@/api/department'; +import { departmentApi } from '/@/api/systemManage/department'; +import { Edit, Delete, View } from '@element-plus/icons-vue'; // 定义接口来定义对象的类型 interface TableData { @@ -97,22 +94,26 @@ params: { pageIndex: number; pageSize: number; - riskLevel: number | null; + riskLevel: number | null | ''; status: number; - depId: number | null; + depId: number | null | ''; location: string | null; produceDeviceName: string | null; }; }; departmentList: Array<DepartmentState>; + stateList: Array<levelListState>; levelList: Array<levelListState>; } -interface levelListState {} +interface levelListState { + id: number; + name: string; +} interface DepartmentState {} export default { name: 'productionDevice', - components: { productionDeviceDialog }, + components: { productionDeviceDialog, Edit, Delete, View }, setup() { const productionDeviceDialogRef = ref(); const state = reactive<TableDataState>({ @@ -136,10 +137,16 @@ { id: 2, name: '一般风险' }, { id: 3, name: '较大风险' }, { id: 4, name: '重大风险' } + ], + stateList: [ + { id: 1, name: '使用中' }, + { id: 2, name: '已弃用' } ] }); // 初始化表格数据 const initProductionDeviceTableData = async () => { + state.productionDeviceData.params.riskLevel = state.productionDeviceData.params.riskLevel === '' ? null : state.productionDeviceData.params.riskLevel; + state.productionDeviceData.params.depId = state.productionDeviceData.params.depId === '' ? null : state.productionDeviceData.params.depId; let res = await productionDeviceApi().getProductionDeviceList(state.productionDeviceData.params); if (res.data.code === '200') { state.productionDeviceData.data = res.data.data; @@ -213,7 +220,19 @@ getDepartmentData(); }); + const parseNumber = (value: string | number, type: string) => { + if (type === '风险等级') { + return state.levelList.find((item) => item.id === value)?.name; + } else if (type === '状态') { + return state.stateList.find((item) => item.id === value)?.name; + } + }; + return { + Edit, + Delete, + View, + parseNumber, handleSearch, onOpenDialogRef, onHandleSizeChange, @@ -228,4 +247,15 @@ }; </script> -<style scoped></style> +<style scoped> +:deep(.el-textarea.is-disabled .el-textarea__inner) { + background-color: var(--el-card-bg-color); + color: var(--el-input-text-color, var(--el-text-color-regular)); +} +:deep(.el-input.is-disabled .el-input__inner) { + color: var(--el-input-text-color, var(--el-text-color-regular)); +} +:deep(.el-input.is-disabled .el-input__wrapper) { + background-color: var(--el-card-bg-color); +} +</style> -- Gitblit v1.9.2