From d592747d5eaa2cfbe698f8ac61222eb3aa75d1fc Mon Sep 17 00:00:00 2001
From: Admin <978517621@qq.com>
Date: 星期二, 02 八月 2022 09:09:12 +0800
Subject: [PATCH] 添加修改页面
---
src/assets/loginPage/map-bg.png | 0
src/api/basicDateManage/personShiftManage/workingHours/index.ts | 58
src/assets/loginPage/map-bg.jpg | 0
src/views/riskWarningSys/accidentLevel/index.vue | 102
src/views/specialWorkSystem/approveProcessManagement/approveLinkSettings/approveLinkSetting/index.vue | 103
src/views/basicRightsManagement/personnelShiftManagement/teamManagement/index.vue | 408 +-
src/api/basicDateManage/personShiftManage/workingHoursSet/index.ts | 14
src/views/basicRightsManagement/personnelShiftManagement/holidayTimeSet/index.vue | 567 +++
src/views/basicRightsManagement/personnelShiftManagement/workingHoursSet/index.vue | 573 +++
src/views/basicRightsManagement/personnelShiftManagement/shiftManagement/index.vue | 458 +-
src/views/IntelligentXjSys/inspectionTaskManagement/index.vue | 459 +-
src/views/specialWorkSystem/afterWorkManagement/workTicketCheck/index.vue | 97
src/views/specialWorkSystem/workApplyManagement/myApply/index.vue | 416 +-
src/views/riskWarningSys/educationAndTraining/index.vue | 102
src/views/specialWorkSystem/approveProcessManagement/approveProcessList/index.vue | 99
src/views/specialWorkSystem/workBasicManagementSetting/personalProtectDevices/index.vue | 97
src/assets/loginPage/equipment.JPG | 0
src/views/basicRightsManagement/personnelShiftManagement/holidayManagement/index.vue | 361 +-
src/views/basicRightsManagement/personnelShiftManagement/holidayTime/index.vue | 625 ++++
src/views/intellectInspect/inspectTaskManage/inspectTask/index.vue | 954 ++++++
src/assets/loginPage/wind.JPG | 0
src/views/riskWarningSys/emergencyDrills/index.vue | 102
src/views/basicRightsManagement/personnelShiftManagement/personnelManagement/index.vue | 324 -
src/assets/loginPage/xj-bg.png | 0
/dev/null | 0
src/views/IntelligentXjSys/inspectionTaskManage/index.vue | 1028 ++++++
src/views/specialWorkSystem/workBasicManagementSetting/certificateFilterSetting/index.vue | 297 -
src/views/specialWorkSystem/approveProcessManagement/approveLinkSettings/reportTypeSetting/index.vue | 124
src/views/specialWorkSystem/afterWorkManagement/workTicketRecord/index.vue | 97
src/assets/loginPage/watersys.JPG | 0
src/views/IntelligentXjSys/intelligentMap/index.vue | 716 ++++
src/views/basicRightsManagement/personnelShiftManagement/workingHours/index.vue | 638 ++-
src/assets/loginPage/xj-icon.png | 0
src/views/specialWorkSystem/approveProcessManagement/approveLinkSettings/approveTypeSetting/index.vue | 97
src/views/riskWarningSys/riskLevel/index.vue | 96
35 files changed, 6,910 insertions(+), 2,102 deletions(-)
diff --git a/src/api/basicDateManage/personShiftManage/workingHours/index.ts b/src/api/basicDateManage/personShiftManage/workingHours/index.ts
new file mode 100644
index 0000000..aea7e48
--- /dev/null
+++ b/src/api/basicDateManage/personShiftManage/workingHours/index.ts
@@ -0,0 +1,58 @@
+import request from '/@/utils/request';
+
+export function workingHoursApi() {
+ return {
+ // 获取工作时间段列表
+ getWorkTimePeriod: () =>{
+ return request({
+ url: `/workTime/getWorkTimePeriod`,
+ method: 'get'
+ })
+ },
+
+ //工作时间段分页列表
+ postPeriodPage: (data: object)=>{
+ return request({
+ url: `/workTime/getWorkTimePeriodByPage?pageSiz`,
+ method: 'post',
+ data: data
+ })
+ },
+
+ // 新增工作时间段
+ postWorkTimePeriod: (data: object) => {
+ return request({
+ url: `/workTime/addWorkTimePeriod`,
+ method: 'post',
+ data: data
+ });
+ },
+
+ // 修改工作时间段
+ updateWorkTimePeriod: (data: object) =>{
+ return request({
+ url: `/workTime/updateWorkTimePeriod`,
+ method: 'post',
+ data: data
+ });
+ },
+
+ // 删除工作时间段
+ deletWorkTimePeriod: (data: object) =>{
+ return request({
+ url: `/workTime/deletWorkTimePeriod`,
+ method: 'post',
+ data: data
+ });
+ },
+
+ // 批量删除
+ deleteBatchWorkTimePeriod: (data: any) =>{
+ return request({
+ url: `/workTime/deleteBatchWorkTimePeriod`,
+ method: 'post',
+ data: data
+ });
+ }
+ };
+}
diff --git a/src/api/basicDateManage/personShiftManage/workingHoursSet/index.ts b/src/api/basicDateManage/personShiftManage/workingHoursSet/index.ts
new file mode 100644
index 0000000..93c72af
--- /dev/null
+++ b/src/api/basicDateManage/personShiftManage/workingHoursSet/index.ts
@@ -0,0 +1,14 @@
+import request from '/@/utils/request';
+
+export function workingHoursApi() {
+ return {
+ //工作时间组分页列表
+ postWorkTimeGroupPage: (data: object)=>{
+ return request({
+ url: `/workTime/getWorkTimeGroupByPage`,
+ method: 'post',
+ data: data
+ })
+ }
+ };
+}
diff --git a/src/assets/loginPage/equipment.JPG b/src/assets/loginPage/equipment.JPG
new file mode 100644
index 0000000..301d435
--- /dev/null
+++ b/src/assets/loginPage/equipment.JPG
Binary files differ
diff --git a/src/assets/loginPage/map-bg.jpg b/src/assets/loginPage/map-bg.jpg
new file mode 100644
index 0000000..a377e7c
--- /dev/null
+++ b/src/assets/loginPage/map-bg.jpg
Binary files differ
diff --git a/src/assets/loginPage/map-bg.png b/src/assets/loginPage/map-bg.png
new file mode 100644
index 0000000..e642a41
--- /dev/null
+++ b/src/assets/loginPage/map-bg.png
Binary files differ
diff --git a/src/assets/loginPage/watersys.JPG b/src/assets/loginPage/watersys.JPG
new file mode 100644
index 0000000..dc1c159
--- /dev/null
+++ b/src/assets/loginPage/watersys.JPG
Binary files differ
diff --git a/src/assets/loginPage/wind.JPG b/src/assets/loginPage/wind.JPG
new file mode 100644
index 0000000..2def54d
--- /dev/null
+++ b/src/assets/loginPage/wind.JPG
Binary files differ
diff --git a/src/assets/loginPage/xj-bg.png b/src/assets/loginPage/xj-bg.png
new file mode 100644
index 0000000..f4b281f
--- /dev/null
+++ b/src/assets/loginPage/xj-bg.png
Binary files differ
diff --git a/src/assets/loginPage/xj-icon.png b/src/assets/loginPage/xj-icon.png
new file mode 100644
index 0000000..62111ab
--- /dev/null
+++ b/src/assets/loginPage/xj-icon.png
Binary files differ
diff --git a/src/assets/menu/bg_home.jpg b/src/assets/menu/bg_home.jpg
deleted file mode 100644
index ab60219..0000000
--- a/src/assets/menu/bg_home.jpg
+++ /dev/null
Binary files differ
diff --git a/src/views/IntelligentXjSys/inspectionTaskManage/index.vue b/src/views/IntelligentXjSys/inspectionTaskManage/index.vue
new file mode 100644
index 0000000..9bcbeb1
--- /dev/null
+++ b/src/views/IntelligentXjSys/inspectionTaskManage/index.vue
@@ -0,0 +1,1028 @@
+<template>
+ <div class="home-container">
+ <div style="height: 100%">
+ <el-row class="homeCard">
+ <el-col :span="12">
+ <div class="grid-content topInfo">
+ <el-select v-model="searchType" @change="changeSearch" placeholder="任务名称">
+ <el-option label="巡检任务类型" value="巡检任务类型" />
+ <el-option label="创建人" value="创建人" />
+ <el-option label="巡检人" value="巡检人" />
+ <el-option label="检查频次" value="检查频次" />
+ <el-option label="开始时间" value="开始时间" />
+ </el-select>
+ <el-input v-model="searchContent" v-if="searchType == '任务名称'" placeholder="请输入任务名称"></el-input>
+ <el-input
+ v-else-if="searchType == '检查频次'"
+ v-model="searchContent"
+ placeholder="请输入检查频次"
+ >
+ <template #append>
+ <el-select v-model="searchUnit" placeholder="选择单位">
+ <el-option label="分钟" value="分钟" />
+ <el-option label="小时" value="小时" />
+ <el-option label="天" value="天" />
+ </el-select>
+ </template>
+ </el-input>
+ <el-select v-model="searchContent" v-else-if="searchType == '巡检任务类型'" placeholder="请选择任务类型">
+ <el-option v-for="(item,index) in typeOptions" :label="item.name" :value="item.value" :key="index"/>
+ </el-select>
+ <el-select v-model="searchContent" v-else-if="searchType == '创建人'" placeholder="请选择创建人">
+ <el-option v-for="(item,index) in createrOptions" :label="item.name" :value="item.value" :key="index"/>
+ </el-select>
+ <el-select v-model="searchContent" v-else-if="searchType == '巡检人'" placeholder="请选择巡检人">
+ <el-option v-for="(item,index) in inspectorOptions" :label="item.name" :value="item.value" :key="index"/>
+ </el-select>
+ <el-date-picker
+ v-model="searchContent"
+ type="date"
+ v-else
+ :placeholder="'请选择' + searchType"
+ size="large"
+ style="margin-right: 20px"
+ />
+ <el-button type="primary">查询</el-button>
+ <el-button plain>重置</el-button>
+ </div>
+ </el-col>
+ </el-row>
+ <div class="homeCard">
+ <div class="main-card">
+ <el-row class="cardTop">
+ <el-col :span="12" class="mainCardBtn">
+ <el-button type="primary" :icon="Plus" size="default" @click="dialogAddRecord=true">新建</el-button>
+ <el-button type="danger" :icon="Delete" size="default" plain>删除</el-button>
+ </el-col>
+ <el-button type="primary" :icon="Refresh" size="default"/>
+ </el-row>
+ <el-table
+ ref="multipleTableRef"
+ :data="tableData"
+ style="width: 100%"
+ height="calc(100% - 100px)"
+ :header-cell-style="{background: '#fafafa'}"
+ @selection-change="handleSelectionChange"
+ >
+ <el-table-column type="selection" width="55" />
+ <el-table-column property="name" label="任务名称" width="200"/>
+ <el-table-column property="type" label="任务类型"/>
+ <el-table-column property="creater" label="创建人"/>
+ <el-table-column property="inspector" label="巡检人"/>
+ <el-table-column property="frequency" label="检查频次"/>
+ <el-table-column property="unit" label="频次单位"/>
+ <el-table-column property="startTime" label="任务开始时间" width="180"/>
+ <el-table-column property="validTime" label="任务有效时间" width="180"/>
+ <el-table-column property="createTime" label="创建时间" width="180"/>
+ <el-table-column property="chainLength" label="巡检链长度" width="160"/>
+ <el-table-column property="status" label="状态" width="60"/>
+ <el-table-column fixed="right" label="操作" align="center" width="300">
+ <template #default="scope">
+ <el-button link type="primary" size="small" :icon="View" @click="viewRecord(scope.row)">查看</el-button>
+ <el-button link type="primary" size="small" :icon="Edit" @click="editRecord(scope.$index ,scope.row)">修改</el-button>
+ <el-switch
+ v-model="scope.row.status"
+ inline-prompt
+ active-text="开"
+ inactive-text="关"
+ active-value="开启"
+ inactive-value="关闭"
+ style="margin: 0 10px"
+ />
+ <el-button link type="danger" size="small" :icon="Delete" @click="deleteRecord(scope.$index)">删除</el-button>
+ </template>
+ </el-table-column>
+ </el-table>
+ <div class="pageBtn">
+ <el-pagination
+ v-model:currentPage="currentPage"
+ v-model:page-size="pageSize"
+ :page-sizes="[10, 15]"
+ small=false
+ background
+ layout="total, sizes, prev, pager, next, jumper"
+ :total="100"
+ @size-change="handleSizeChange"
+ @current-change="handleCurrentChange"
+ />
+ </div>
+ </div>
+ </div>
+ </div>
+ <el-dialog v-model="dialogDetails" title="巡检任务">
+ <el-form :model="details" label-width="120px">
+ <el-row>
+ <el-col :span="12" style="margin-bottom: 20px">
+ <el-form-item label="任务名称">
+ <el-input
+ v-model="details.name"
+ readonly
+ />
+ </el-form-item>
+ </el-col>
+ <el-col :span="12" style="margin-bottom: 20px">
+ <el-form-item label="任务类型">
+ <el-input
+ v-model="details.type"
+ readonly
+ />
+ </el-form-item>
+ </el-col>
+ <el-col :span="12" style="margin-bottom: 20px">
+ <el-form-item label="执行巡检班组">
+ <el-input
+ v-model="details.inspector"
+ readonly
+ />
+ </el-form-item>
+ </el-col>
+ <el-col :span="12" style="margin-bottom: 20px">
+ <el-form-item label="检查频次">
+ <el-input
+ v-model="details.inspector"
+ readonly
+ />
+ </el-form-item>
+ </el-col>
+ <el-col :span="12" style="margin-bottom: 20px">
+ <el-form-item label="检查频次" prop="frequency">
+ <el-input
+ v-model="details.frequency"
+ readonly
+ >
+ <template #append>
+ <el-input
+ v-model="details.unit"
+ readonly
+ />
+ </template>
+ </el-input>
+ </el-form-item>
+ </el-col>
+ <el-col :span="12" style="margin-bottom: 20px">
+ <el-form-item label="周期开始时间">
+ <el-input
+ v-model="details.startTime"
+ readonly
+ />
+ </el-form-item>
+ </el-col>
+ <el-col :span="12" style="margin-bottom: 20px">
+ <el-form-item label="周期有效时间">
+ <el-input
+ v-model="details.validTime"
+ readonly
+ />
+ </el-form-item>
+ </el-col>
+ <el-col :span="24" style="margin-bottom: 20px">
+ <el-form-item label="巡检链">
+ <div style="width: 100%;margin-left: -30px">
+ <div v-for="(item,index) in details.shiftSteps" class="stepItem">
+ <div class="stepNum">{{index+1}}</div>
+ <div class="stepCard">
+ <el-card class="box-card">
+ <template #header>
+ <div class="card-header">
+ <div>{{item.name}}</div>
+ </div>
+ </template>
+ <div class="inspect-chain">
+ <el-table :data="item.inspectorData" style="width: 100%"
+ :default-sort="{ prop: 'sort', order: 'ascending'}"
+ :header-cell-style="{background: '#fafafa',padding: '5px'}"
+ >
+ <el-table-column property="sort" label="排序"/>
+ <el-table-column property="name" label="巡检点名称"/>
+ <el-table-column property="section" label="所属设备区域"/>
+ <el-table-column property="rfid" label="关联RFID"/>
+ <el-table-column property="norm" label="巡检指标"/>
+ <el-table-column property="reference" label="数据参考值"/>
+ </el-table>
+ </div>
+ </el-card>
+ </div>
+ </div>
+ </div>
+ </el-form-item>
+ </el-col>
+ <el-form-item>
+ <el-button type="primary" @click="dialogDetails = false" size="default">确认</el-button>
+ </el-form-item>
+ </el-row>
+ </el-form>
+ </el-dialog>
+ <el-dialog v-model="dialogAddRecord" title="巡检任务编辑" @close="closeAdd" @open="openAdd">
+ <el-form :model="addRecord" label-width="120px" ref="addRef" :rules="addRules">
+ <el-row>
+ <el-col :span="12" style="margin-bottom: 20px">
+ <el-form-item label="任务名称" prop="name">
+ <el-input
+ v-model="addRecord.name"
+ >
+ </el-input>
+ </el-form-item>
+ </el-col>
+ <el-col :span="12" style="margin-bottom: 20px">
+ <el-form-item label="任务类型" prop="type">
+ <el-select v-model="addRecord.type">
+ <el-option label="日常检查" value="日常检查" />
+ <el-option label="周期检查" value="周期检查" />
+ </el-select>
+ </el-form-item>
+ </el-col>
+ <el-col :span="12" style="margin-bottom: 20px">
+ <el-form-item label="执行巡检人员" prop="inspector">
+ <el-select v-model="addRecord.inspector">
+ <el-option label="张三" value="张三" />
+ <el-option label="李四" value="李四" />
+ </el-select>
+ </el-form-item>
+ </el-col>
+ <el-col :span="12" style="margin-bottom: 20px">
+ <el-form-item label="检查频次" prop="frequency">
+ <el-input
+ v-model="addRecord.frequency"
+ placeholder="请输入检查频次"
+ >
+ <template #append>
+ <el-select v-model="addRecord.unit" placeholder="选择单位">
+ <el-option label="分钟" value="分钟" />
+ <el-option label="小时" value="小时" />
+ <el-option label="天" value="天" />
+ </el-select>
+ </template>
+ </el-input>
+ </el-form-item>
+ </el-col>
+ <el-col :span="12" style="margin-bottom: 20px">
+ <el-form-item label="周期开始时间" prop="startTime">
+ <el-date-picker
+ v-model="addRecord.startTime"
+ type="datetime"
+ format="YYYY/MM/DD HH:mm:ss" value-format="YYYY-MM-DD HH:mm:ss"
+ />
+ </el-form-item>
+ </el-col>
+ <el-col :span="12" style="margin-bottom: 20px">
+ <el-form-item label="周期有效时间" prop="validTime">
+ <el-select v-model="addRecord.validTime" placeholder="选择时间">
+ <el-option label="15分钟" value="15分钟" />
+ <el-option label="30分钟" value="30分钟" />
+ <el-option label="45分钟" value="45分钟" />
+ <el-option label="60分钟" value="60分钟" />
+ <el-option label="75分钟" value="75分钟" />
+ <el-option label="90分钟" value="90分钟" />
+ </el-select>
+ </el-form-item>
+ </el-col>
+ <el-col :span="24">
+ <el-form-item label="创建巡检链">
+ <div style="width: 100%;margin-bottom: 20px">
+ <el-button type="primary" :icon="Plus" size="default" @click="dialogAddShift = true">新增巡检设备区域</el-button>
+ </div>
+ <div style="width: 100%;margin-left: -30px">
+ <div v-for="(item,index) in addRecord.shiftSteps" class="stepItem">
+ <div class="stepNum">{{index+1}}</div>
+ <div class="stepCard">
+ <el-card class="box-card">
+ <template #header>
+ <div class="card-header">
+ <div>{{item.name}}</div>
+ <div>
+ <el-button type="primary" size="default" @click="addFlow(index)">新增下一区域</el-button>
+ <el-button type="danger" size="default" @click="deleteFlow(index)">删除</el-button>
+ </div>
+ </div>
+ </template>
+ <div class="inspect-chain" style="display: flex;flex-direction: column;align-items: center">
+ <el-button type="primary" size="default" :icon="Plus" plain @click="addSysInspection(index)" style="margin-bottom: 10px">添加巡检点</el-button>
+ <el-table
+ :data="item.inspectorData"
+ style="width: 100%"
+ :default-sort="{ prop: 'sort', order: 'ascending' }"
+ :header-cell-style="{background: '#fafafa',padding: '5px'}"
+ >
+ <el-table-column property="sort" label="排序"/>
+ <el-table-column property="name" label="巡检点名称"/>
+ <el-table-column property="section" label="所属设备区域"/>
+ <el-table-column property="rfid" label="关联RFID"/>
+ <el-table-column property="norm" label="巡检指标"/>
+ <el-table-column property="reference" label="数据参考值"/>
+ <el-table-column fixed="right" label="操作" align="center" width="100">
+ <template #default="scope">
+ <el-button link type="primary" size="small" :icon="Edit" @click="editInspection(index,scope.$index ,scope.row)">修改</el-button>
+ <el-button link type="danger" size="small" :icon="Delete" @click="deleteInspection(index,scope.$index)">删除</el-button>
+ </template>
+ </el-table-column>
+ </el-table>
+ </div>
+ </el-card>
+ </div>
+ </div>
+ </div>
+ </el-form-item>
+ </el-col>
+ </el-row>
+ <el-form-item>
+ <el-button type="warning" @click="dialogAddRecord = false" size="default" plain>取消</el-button>
+ <el-button type="primary" @click="confirmAddRecord(addRef)" size="default">确认</el-button>
+ </el-form-item>
+ </el-form>
+ </el-dialog>
+ <el-dialog v-model="deleteDialog" title="提示" width="30%" center @close="indexClear">
+ <span>您确定要删除该条记录吗?</span>
+ <template #footer>
+ <span class="dialog-footer">
+ <el-button @click="deleteDialog = false" size="default">取消</el-button>
+ <el-button type="primary" @click="conFirmDelete" size="default">确认</el-button>
+ </span>
+ </template>
+ </el-dialog>
+ <el-dialog v-model="deleteShiftDialog" title="提示" width="30%" center @close="indexShiftClear">
+ <span>您确定要删除该班次吗?</span>
+ <template #footer>
+ <span class="dialog-footer">
+ <el-button @click="deleteShiftDialog = false" size="default">取消</el-button>
+ <el-button type="primary" @click="conFirmShiftDelete" size="default">确认</el-button>
+ </span>
+ </template>
+ </el-dialog>
+ <el-dialog v-model="deleteInspectionDialog" title="提示" width="30%" center @close="indexInspectionClear">
+ <span>您确定要删除该巡检点吗?</span>
+ <template #footer>
+ <span class="dialog-footer">
+ <el-button @click="deleteInspectionDialog = false" size="default">取消</el-button>
+ <el-button type="primary" @click="conFirmInspectionDelete" size="default">确认</el-button>
+ </span>
+ </template>
+ </el-dialog>
+ <el-dialog v-model="dialogAddShift" title="新增巡检设施区域" @close="closeAddShift">
+ <el-form :model="addShift" label-width="120px" ref="addShiftRef" :rules="addShiftRules">
+ <el-form-item label="选择巡检设施区域" prop="name">
+ <el-select v-model="addShift.name">
+ <el-option label="风机系统" value="风机系统" />
+ <el-option label="A车间" value="A车间" />
+ </el-select>
+ </el-form-item>
+ <el-form-item>
+ <el-button type="warning" @click="dialogAddShift = false" size="default" plain>取消</el-button>
+ <el-button type="primary" @click="confirmAddShift(addShiftRef)" size="default">确认</el-button>
+ </el-form-item>
+ </el-form>
+ </el-dialog>
+ <el-dialog v-model="dialogAddInspection" title="新增巡检点" @close="closeAddInspection">
+ <el-form :model="addInspection" label-width="120px" ref="addInspectionRef" :rules="addInspectionRules">
+ <el-form-item label="输入巡检点排序" prop="sort">
+ <el-input-number v-model="addInspection.sort" :min="1" :max="999" placeholder="巡检点排序"/>
+ </el-form-item>
+ <el-form-item label="选择巡检点" prop="name">
+ <el-select v-model="addInspection.name">
+ <el-option label="73011" value="73011" />
+ <el-option label="73012" value="73012" />
+ <el-option label="73013" value="73013" />
+ </el-select>
+ </el-form-item>
+ <el-form-item label="选择巡检指标" prop="norm">
+ <el-select v-model="addInspection.norm">
+ <el-option label="风机声音" value="风机声音" />
+ <el-option label="设备温度" value="设备温度" />
+ <el-option label="压力" value="压力" />
+ <el-option label="震动" value="震动" />
+ </el-select>
+ </el-form-item>
+ <el-form-item>
+ <el-button type="warning" @click="dialogAddInspection = false" size="default" plain>取消</el-button>
+ <el-button type="primary" @click="confirmAddInspection(addInspectionRef)" size="default">确认</el-button>
+ </el-form-item>
+ </el-form>
+ </el-dialog>
+ </div>
+</template>
+
+<script lang="ts">
+ import { toRefs, reactive, ref } from 'vue';
+ import { storeToRefs } from 'pinia';
+ import { initBackEndControlRoutes } from '/@/router/backEnd';
+ import {useUserInfo} from "/@/stores/userInfo";
+ import { Session } from '/@/utils/storage';
+ import { Edit, View, Plus, Delete, Refresh, Search, Download } from '@element-plus/icons-vue'
+ import { ElTable, ElMessage } from 'element-plus'
+ import { FormInstance, FormRules } from 'element-plus'
+ let global: any = {
+ homeChartOne: null,
+ homeChartTwo: null,
+ homeCharThree: null,
+ dispose: [null, '', undefined],
+ };
+
+ interface stateType {
+ homeOne: Array <type>
+ }
+ interface type {
+
+ }
+ export default {
+ name: 'workingHoursSet',
+ components: {},
+ setup() {
+ const userInfo = useUserInfo()
+ const {userInfos} = storeToRefs(userInfo);
+
+ const state = reactive({
+ searchType: '任务名称',
+ typeOptions: [
+ {
+ name: '日常检查',
+ value: '日常检查'
+ },
+ {
+ name: '周期检查',
+ value: '周期检查'
+ }
+ ],
+ createrOptions: [
+ {
+ name: '张三',
+ value: '张三'
+ },
+ {
+ name: '李四',
+ value: '李四'
+ }
+ ],
+ inspectorOptions: [
+ {
+ name: '李四',
+ value: '李四'
+ },
+ {
+ name: '张三',
+ value: '张三'
+ }
+ ],
+ searchUnit: '小时',
+ searchContent: '',
+ currentPage: 1,
+ pageSize: 10,
+ chosenIndex: null,
+ chosenShiftIndex: null,
+ chosenInspectionIndex: null,
+ dialogDetails: false,
+ dialogAddRecord: false,
+ deleteDialog: false,
+ deleteShiftDialog: false,
+ deleteInspectionDialog: false,
+ dialogAddShift: false,
+ dialogAddInspection: false,
+ tableData: [
+ {
+ name: '甲醛装置()列现场岗位巡检',
+ type: '周期检查',
+ creater: '管理员A',
+ inspector: '张三',
+ frequency: 2,
+ unit: '小时',
+ startTime: '2022-07-02 13:01:37',
+ validTime: '30分钟',
+ createTime: '2022-07-02 12:03:47',
+ chainLength: 20,
+ status: '开启',
+ shiftSteps: [
+ {
+ name: '风机系统',
+ inspectorData: [
+ {
+ sort: 1,
+ name: '73011',
+ section: '风机系统',
+ rfid: '风机系统1标签',
+ norm: '风机声音',
+ reference: '10<正常<50'
+ },
+ {
+ sort: 2,
+ name: '73012',
+ section: '风机系统',
+ rfid: '风机系统2标签',
+ norm: '设备温度',
+ reference: '20<正常<50'
+ },
+ {
+ sort: 3,
+ name: '73013',
+ section: '风机系统',
+ rfid: '风机系统3标签',
+ norm: '风机震动',
+ reference: '30<正常<50'
+ }
+ ]
+
+ },
+ {
+ name: 'A场所',
+ inspectorData: [
+ {
+ sort: 1,
+ name: '73021',
+ section: '风机系统',
+ rfid: '风机系统1标签',
+ norm: '风机声音',
+ reference: '10<正常<50'
+ },
+ {
+ sort: 2,
+ name: '73022',
+ section: '风机系统',
+ rfid: '风机系统2标签',
+ norm: '设备温度',
+ reference: '20<正常<50'
+ },
+ {
+ sort: 3,
+ name: '73023',
+ section: '风机系统',
+ rfid: '风机系统3标签',
+ norm: '风机震动',
+ reference: '30<正常<50'
+ }
+ ]
+ }
+ ]
+ },
+ {
+ name: 'A车间日常巡检',
+ type: '日常检查',
+ creater: '管理员B',
+ inspector: '李四',
+ frequency: 4,
+ unit: '小时',
+ startTime: '2022-07-02 12:45:37',
+ validTime: '30分钟',
+ createTime: '2022-07-02 08:15:41',
+ chainLength: 15,
+ status: '开启'
+ }
+ ],
+ addRecord: {
+ name: '',
+ type: '',
+ creater: '',
+ inspector: '',
+ frequency: 1,
+ unit: '小时',
+ startTime: '',
+ validTime: '',
+ createTime: '',
+ chainLength: 0,
+ status: '开启',
+ shiftSteps: []
+ },
+ addShift: {},
+ addInspection: {},
+ details: {}
+ })
+
+ // 顶部筛选搜索
+ const changeSearch = () => {
+ state.searchContent = ''
+ }
+
+ const handleSizeChange = (val: number) => {
+ console.log(`${val} items per page`)
+ }
+ const handleCurrentChange = (val: number) => {
+ console.log(`current page: ${val}`)
+ }
+
+ // 时间格式化
+ const timeForm = {
+ hour12: false,
+ year: 'numeric',
+ month: '2-digit',
+ day: '2-digit',
+ hour: '2-digit',
+ minute: '2-digit',
+ second: '2-digit'
+ }
+ const handleChange = (value) => {
+ state.addRecord.content = []
+ console.log(JSON.parse(JSON.stringify(value)))
+ }
+ const addRef = ref<FormInstance>()
+ const addShiftRef = ref<FormInstance>()
+ const addInspectionRef = ref<FormInstance>()
+
+ // 表单校验
+ const addRules = reactive<FormRules>({
+ name: [{required: true, message: '该内容不能为空', trigger: 'blur'}],
+ type: [{required: true, message: '该内容不能为空', trigger: 'blur'}],
+ inspector: [{required: true, message: '该内容不能为空', trigger: 'blur'}],
+ frequency: [{required: true, message: '该内容不能为空', trigger: 'blur'}],
+ unit: [{required: true, message: '该内容不能为空', trigger: 'blur'}],
+ startTime: [{required: true, message: '该内容不能为空', trigger: 'blur'}],
+ validTime: [{required: true, message: '该内容不能为空', trigger: 'blur'}]
+ })
+ const addShiftRules = reactive<FormRules>({
+ name: [{required: true, message: '该内容不能为空', trigger: 'blur'}]
+ })
+ const addInspectionRules = reactive<FormRules>({
+ name: [{required: true, message: '该内容不能为空', trigger: 'blur'}],
+ norm: [{required: true, message: '该内容不能为空', trigger: 'blur'}],
+ sort: [{required: true, message: '该内容不能为空', trigger: 'blur'}]
+ })
+
+ // 查看记录
+ const viewRecord = (row) => {
+ state.details = JSON.parse(JSON.stringify(row))
+ state.dialogDetails = true
+ }
+
+ // 删除记录
+ const deleteRecord = (index) => {
+ state.chosenIndex = index
+ state.deleteDialog = true
+ }
+ const conFirmDelete = () => {
+ state.tableData.splice(state.chosenIndex, 1)
+ state.deleteDialog = false
+ }
+
+ // 修改添加记录
+ const editRecord = (index, row) => {
+ state.chosenIndex = index
+ state.dialogAddRecord = true
+ state.addRecord = JSON.parse(JSON.stringify(row))
+ }
+ const confirmAddRecord = async (formEl: FormInstance | undefined) => {
+ if (!formEl) return
+ await formEl.validate((valid, fields) => {
+ if (valid) {
+ if (state.chosenIndex == null) {
+ if (!state.addRecord.shiftSteps || state.addRecord.shiftSteps.length == 0) {
+ ElMessage({
+ message: '请先设置巡检链后再提交',
+ type: 'warning',
+ })
+ return
+ // 判断每个区域是否都设置了至少一个巡检点,没有的话提示设置
+ } else if (state.addRecord.shiftSteps.some(i => !i.inspectorData || i.inspectorData.length == 0)) {
+ for (let i = 0; i < state.addRecord.shiftSteps.length; i++) {
+ if (!state.addRecord.shiftSteps[i].inspectorData || state.addRecord.shiftSteps[i].inspectorData.length == 0) {
+ ElMessage({
+ message: '请为' + state.addRecord.shiftSteps[i].name + '设置巡检点',
+ type: 'warning',
+ })
+ }
+ }
+ return
+ } else {
+ state.addRecord.createTime = new Date().toLocaleString('zh', timeForm).replace(/\//g, '-')
+ state.addRecord.chainLength = state.addRecord.shiftSteps.length
+ state.addRecord.status = '开启'
+ state.tableData.unshift(state.addRecord)
+ }
+ } else {
+ if (state.addRecord.shiftSteps.length == 0) {
+ ElMessage({
+ message: '请先设置巡检链后再提交',
+ type: 'warning',
+ })
+ return
+ // 判断每个区域是否都设置了至少一个巡检点,没有的话提示设置
+ } else if (state.addRecord.shiftSteps.some(i => !i.inspectorData || i.inspectorData.length == 0)) {
+ for (let i = 0; i < state.addRecord.shiftSteps.length; i++) {
+ if (!state.addRecord.shiftSteps[i].inspectorData || state.addRecord.shiftSteps[i].inspectorData.length == 0) {
+ ElMessage({
+ message: '请为' + state.addRecord.shiftSteps[i].name + '设置巡检点',
+ type: 'warning',
+ })
+ }
+ }
+ return
+ } else {
+ state.tableData[state.chosenIndex] = state.addRecord
+ }
+ }
+ state.dialogAddRecord = false
+ } else {
+ console.log('error submit!', fields)
+ }
+ })
+
+ }
+
+ // 添加弹窗打开前预操作
+ const openAdd = () => {
+ state.addRecord.unit = '小时'
+ }
+
+ // 弹窗关闭后判断数据初始化
+ const closeAdd = () => {
+ state.addRecord = {}
+ state.chosenIndex = null
+ state.addShift = {}
+ state.chosenShiftIndex = null
+ }
+ const indexClear = () => {
+ state.chosenIndex = null
+ }
+ const indexShiftClear = () => {
+ state.chosenShiftIndex = null
+ }
+ const indexInspectionClear = () => {
+ state.chosenInspectionIndex = null
+ state.chosenShiftIndex = null
+ }
+
+ // 排序
+ function compare(key) {
+ return function (value1, value2) {
+ var val1 = value1[key];
+ var val2 = value2[key];
+ return val1 - val2;
+ }
+ }
+
+ // 添加删除巡检设施区域
+ const addFlow = (index) => {
+ state.dialogAddShift = true
+ state.chosenShiftIndex = index
+ }
+
+ // 删除巡检区域
+ const deleteFlow = (index) => {
+ state.deleteShiftDialog = true
+ state.chosenShiftIndex = index
+ }
+ const conFirmShiftDelete = () => {
+ state.addRecord.shiftSteps.splice(state.chosenShiftIndex, 1)
+ state.deleteShiftDialog = false
+ }
+
+ const confirmAddShift = async (formEl: FormInstance | undefined) => {
+ if (!formEl) return
+ await formEl.validate((valid, fields) => {
+ if (valid) {
+ if (state.addRecord.shiftSteps) {
+ state.addRecord.shiftSteps.splice(state.chosenShiftIndex + 1, 0, state.addShift)
+ } else {
+ state.addRecord.shiftSteps = []
+ state.addRecord.shiftSteps.unshift(state.addShift)
+ }
+ state.dialogAddShift = false
+ } else {
+ console.log('error submit!', fields)
+ }
+ })
+ }
+
+
+ const addSysInspection = (index) => {
+ state.dialogAddInspection = true
+ state.chosenShiftIndex = index
+ }
+ const confirmAddInspection = async (formEl: FormInstance | undefined) => {
+ if (!formEl) return
+ await formEl.validate((valid, fields) => {
+ if (valid) {
+ if (state.addRecord.shiftSteps[state.chosenShiftIndex].inspectorData) {
+ if (state.chosenInspectionIndex == null) {
+ state.addRecord.shiftSteps[state.chosenShiftIndex].inspectorData.unshift(state.addInspection)
+ state.addRecord.shiftSteps[state.chosenShiftIndex].inspectorData.sort(compare('sort'))
+ } else {
+ state.addRecord.shiftSteps[state.chosenShiftIndex].inspectorData[state.chosenInspectionIndex] = state.addInspection
+ state.addRecord.shiftSteps[state.chosenShiftIndex].inspectorData.sort(compare('sort'))
+ }
+ } else {
+ state.addRecord.shiftSteps[state.chosenShiftIndex].inspectorData = []
+ state.addRecord.shiftSteps[state.chosenShiftIndex].inspectorData.unshift(state.addInspection)
+ state.addRecord.shiftSteps[state.chosenShiftIndex].inspectorData.sort(compare('sort'))
+ }
+ state.dialogAddInspection = false
+ } else {
+ console.log('error submit!', fields)
+ }
+ })
+ }
+ const deleteInspection = (i, index) => {
+ state.chosenShiftIndex = i
+ state.chosenInspectionIndex = index
+ state.deleteInspectionDialog = true
+ }
+ const editInspection = (i, index, row) => {
+ state.chosenShiftIndex = i
+ state.chosenInspectionIndex = index
+ state.dialogAddInspection = true
+ state.addInspection = JSON.parse(JSON.stringify(row))
+ }
+ const conFirmInspectionDelete = () => {
+ state.addRecord.shiftSteps[state.chosenShiftIndex].inspectorData.splice(state.chosenInspectionIndex, 1)
+ state.deleteInspectionDialog = false
+ }
+
+ const closeAddShift = () => {
+ state.addShift = {}
+ state.chosenShiftIndex = null
+ }
+ const closeAddInspection = () => {
+ state.addInspection = {}
+ state.chosenShiftIndex = null
+ }
+
+ // 折线图
+ const renderMenu = async (value: string) => {
+ Session.set('projectId', value)
+ userInfos.value.projectId = value
+ await initBackEndControlRoutes();
+ };
+
+ return {
+ addRef,
+ addShiftRef,
+ addInspectionRef,
+ addRules,
+ addShiftRules,
+ addInspectionRules,
+ View,
+ Edit,
+ Delete,
+ Refresh,
+ Plus,
+ changeSearch,
+ handleSizeChange,
+ handleCurrentChange,
+ handleChange,
+ viewRecord,
+ deleteRecord,
+ conFirmDelete,
+ openAdd,
+ editRecord,
+ confirmAddRecord,
+ closeAdd,
+ addFlow,
+ conFirmShiftDelete,
+ confirmAddShift,
+ closeAddShift,
+ deleteInspection,
+ addSysInspection,
+ confirmAddInspection,
+ conFirmInspectionDelete,
+ closeAddInspection,
+ editInspection,
+ deleteFlow,
+ indexClear,
+ indexShiftClear,
+ indexInspectionClear,
+ renderMenu,
+ ...toRefs(state)
+ }
+ }
+ }
+</script>
+
+<style scoped lang="scss">
+ $homeNavLengh: 8;
+ .home-container {
+ height: calc(100vh - 114px);
+ box-sizing: border-box;
+ overflow: hidden;
+ .homeCard{
+ width: 100%;
+ padding: 20px;
+ box-sizing: border-box;
+ background: #fff;
+ border-radius: 4px;
+
+ .main-card{
+ width: 100%;
+ height: 100%;
+ .cardTop{
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ margin-bottom: 20px;
+ .mainCardBtn{
+ margin: 0;
+ }
+ }
+ .pageBtn{
+ height: 60px;
+ display: flex;
+ align-items: center;
+ justify-content: right;
+
+ .demo-pagination-block + .demo-pagination-block {
+ margin-top: 10px;
+ }
+ .demo-pagination-block .demonstration {
+ margin-bottom: 16px;
+ }
+ }
+ }
+ &:last-of-type{
+ height: calc(100% - 100px);
+ }
+ }
+ .el-row{
+ display: flex;
+ align-items: center;
+ margin-bottom: 20px;
+ &:last-child {
+ margin-bottom: 0;
+ }
+ .grid-content{
+ align-items: center;
+ min-height: 36px;
+ }
+
+ .topInfo {
+ display: flex;
+ align-items: center;
+ font-size: 16px;
+ font-weight: bold;
+
+ &>div{
+ white-space: nowrap;
+ margin-right: 20px;
+ }
+ }
+ }
+ }
+ .stepItem{
+ width: 100%;
+ display: flex;
+ align-items: flex-start;
+ margin-bottom: 30px;
+ margin-left: 30px;
+ padding-bottom: 30px;
+ border-left: 2px solid #ccc;
+ &:first-of-type{
+ margin-top: 30px;
+ }
+ &:last-of-type{
+ margin-bottom: 0;
+ border-left: none;
+ }
+ .stepNum {
+ width: 30px;
+ height: 30px;
+ border-radius: 15px;
+ box-sizing: border-box;
+ color: #333;
+ border: 1px solid #999;
+ line-height: 28px;
+ text-align: center;
+ margin-right: 10px;
+ margin-left: -16px;
+ margin-top: -30px;
+ }
+ .stepCard {
+ width: 100%;
+ margin-top: -30px;
+
+ .box-card {
+ width: 100%;
+ &:deep(.el-card__header){
+ padding: 10px 15px
+ }
+ .card-header {
+ width: 100%;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ &>div:first-of-type{
+ margin-right: 80px;
+ font-size: 18px;
+ font-weight: bold;
+ }
+ }
+ }
+ }
+ &:hover .card-header{
+ color: #0098F5;
+ }
+ &:hover .stepNum{
+ border: 2px solid #0098F5;
+ color: #0098F5;
+ }
+ }
+ .el-input{
+ width: 100% !important;
+ }
+ :deep(.el-date-editor){
+ width: 100%;
+ }
+ .el-select{
+ width: 100%;
+ }
+
+ .inspect-chain :deep(.el-table__row){
+ background: #fff;
+
+ }
+
+ .inspect-chain :deep(.el-table__cell){
+ background: #fff;
+ }
+</style>
diff --git a/src/views/IntelligentXjSys/inspectionTaskManagement/index.vue b/src/views/IntelligentXjSys/inspectionTaskManagement/index.vue
index 5f1e4a9..5e5aedb 100644
--- a/src/views/IntelligentXjSys/inspectionTaskManagement/index.vue
+++ b/src/views/IntelligentXjSys/inspectionTaskManagement/index.vue
@@ -399,7 +399,7 @@
</div>
</template>
-<script lang="ts" setup>
+<script lang="ts">
import { toRefs, reactive, ref } from 'vue';
import { storeToRefs } from 'pinia';
import { initBackEndControlRoutes } from '/@/router/backEnd';
@@ -421,72 +421,60 @@
interface type {
}
+ export default {
+ name: 'workingHoursSet',
+ components: {},
+ setup() {
const userInfo = useUserInfo()
- const { userInfos } = storeToRefs(userInfo);
+ const {userInfos} = storeToRefs(userInfo);
- // 顶部筛选搜索
- const searchType = ref('任务名称')
- const typeOptions = ref([
- {
- name: '日常检查',
- value: '日常检查'
- },
- {
- name: '周期检查',
- value: '周期检查'
- }
- ])
- const createrOptions = ref([
- {
- name: '张三',
- value: '张三'
- },
- {
- name: '李四',
- value: '李四'
- }
- ])
- const inspectorOptions = ref([
- {
- name: '李四',
- value: '李四'
- },
- {
- name: '张三',
- value: '张三'
- }
- ])
- const searchUnit = ref('小时')
- const changeSearch =()=>{
- searchContent.value=''
- }
- const searchContent = ref()
-
-
- const currentPage = ref(1)
- const pageSize = ref(10)
- const chosenIndex = ref(-1)
- const chosenShiftIndex = ref(-1)
- const chosenInspectionIndex = ref(-1)
- const handleSizeChange = (val: number) => {
- console.log(`${val} items per page`)
- }
- const handleCurrentChange = (val: number) => {
- console.log(`current page: ${val}`)
- }
-
- // 时间格式化
- const timeForm = {
- hour12: false,
- year: 'numeric',
- month: '2-digit',
- day: '2-digit',
- hour: '2-digit',
- minute: '2-digit',
- second: '2-digit'
- }
- const tableData = reactive(
- [
+ const state = reactive({
+ searchType: '任务名称',
+ typeOptions: [
+ {
+ name: '日常检查',
+ value: '日常检查'
+ },
+ {
+ name: '周期检查',
+ value: '周期检查'
+ }
+ ],
+ createrOptions: [
+ {
+ name: '张三',
+ value: '张三'
+ },
+ {
+ name: '李四',
+ value: '李四'
+ }
+ ],
+ inspectorOptions: [
+ {
+ name: '李四',
+ value: '李四'
+ },
+ {
+ name: '张三',
+ value: '张三'
+ }
+ ],
+ searchUnit: '小时',
+ searchContent: '',
+ currentPage: 1,
+ pageSize: 10,
+ chosenIndex: null,
+ chosenShiftIndex: null,
+ chosenInspectionIndex: null,
+ dialogDetails: false,
+ dialogAddRecord: false,
+ deleteDialog: false,
+ deleteShiftDialog: false,
+ deleteInspectionDialog: false,
+ dialogAddShift: false,
+ dialogAddInspection: false,
+ tableData: [
{
name: '甲醛装置()列现场岗位巡检',
type: '周期检查',
@@ -497,12 +485,12 @@
startTime: '2022-07-02 13:01:37',
validTime: '30分钟',
createTime: '2022-07-02 12:03:47',
- chainLength: '20',
+ chainLength: 20,
status: '开启',
- shiftSteps:[
+ shiftSteps: [
{
name: '风机系统',
- inspectorData:[
+ inspectorData: [
{
sort: 1,
name: '73011',
@@ -532,7 +520,7 @@
},
{
name: 'A场所',
- inspectorData:[
+ inspectorData: [
{
sort: 1,
name: '73021',
@@ -571,122 +559,153 @@
startTime: '2022-07-02 12:45:37',
validTime: '30分钟',
createTime: '2022-07-02 08:15:41',
- chainLength: '15',
+ chainLength: 15,
status: '开启'
}
- ]
- )
+ ],
+ addRecord: {
+ name: '',
+ type: '',
+ creater: '',
+ inspector: '',
+ frequency: 1,
+ unit: '小时',
+ startTime: '',
+ validTime: '',
+ createTime: '',
+ chainLength: 0,
+ status: '开启',
+ shiftSteps: []
+ },
+ addShift: {},
+ addInspection: {},
+ details: {}
+ })
+
+ // 顶部筛选搜索
+ const changeSearch = () => {
+ state.searchContent = ''
+ }
+
+ const handleSizeChange = (val: number) => {
+ console.log(`${val} items per page`)
+ }
+ const handleCurrentChange = (val: number) => {
+ console.log(`current page: ${val}`)
+ }
+
+ // 时间格式化
+ const timeForm = {
+ hour12: false,
+ year: 'numeric',
+ month: '2-digit',
+ day: '2-digit',
+ hour: '2-digit',
+ minute: '2-digit',
+ second: '2-digit'
+ }
const handleChange = (value) => {
- addRecord.value.content = []
+ state.addRecord.content = []
console.log(JSON.parse(JSON.stringify(value)))
}
const addRef = ref<FormInstance>()
const addShiftRef = ref<FormInstance>()
const addInspectionRef = ref<FormInstance>()
- // 表单校验
+ // 表单校验
const addRules = reactive<FormRules>({
- name:[{required: true, message: '该内容不能为空',trigger:'blur'}],
- type:[{required: true, message: '该内容不能为空',trigger:'blur'}],
- inspector:[{required: true, message: '该内容不能为空',trigger:'blur'}],
- frequency:[{required: true, message: '该内容不能为空',trigger:'blur'}],
- unit:[{required: true, message: '该内容不能为空',trigger:'blur'}],
- startTime:[{required: true, message: '该内容不能为空',trigger:'blur'}],
- validTime:[{required: true, message: '该内容不能为空',trigger:'blur'}]
+ name: [{required: true, message: '该内容不能为空', trigger: 'blur'}],
+ type: [{required: true, message: '该内容不能为空', trigger: 'blur'}],
+ inspector: [{required: true, message: '该内容不能为空', trigger: 'blur'}],
+ frequency: [{required: true, message: '该内容不能为空', trigger: 'blur'}],
+ unit: [{required: true, message: '该内容不能为空', trigger: 'blur'}],
+ startTime: [{required: true, message: '该内容不能为空', trigger: 'blur'}],
+ validTime: [{required: true, message: '该内容不能为空', trigger: 'blur'}]
})
const addShiftRules = reactive<FormRules>({
- name:[{required: true, message: '该内容不能为空',trigger:'blur'}]
+ name: [{required: true, message: '该内容不能为空', trigger: 'blur'}]
})
const addInspectionRules = reactive<FormRules>({
- name:[{required: true, message: '该内容不能为空',trigger:'blur'}],
- norm:[{required: true, message: '该内容不能为空',trigger:'blur'}],
- sort:[{required: true, message: '该内容不能为空',trigger:'blur'}]
+ name: [{required: true, message: '该内容不能为空', trigger: 'blur'}],
+ norm: [{required: true, message: '该内容不能为空', trigger: 'blur'}],
+ sort: [{required: true, message: '该内容不能为空', trigger: 'blur'}]
})
- const dialogDetails = ref(false)
- const dialogAddRecord = ref(false)
- const deleteDialog = ref(false)
- const deleteShiftDialog = ref(false)
- const deleteInspectionDialog = ref(false)
- const dialogAddShift = ref(false)
- const dialogAddInspection = ref(false)
- const addRecord = ref({})
- const addShift = ref({})
- const addInspection = ref({})
- const details = ref({})
- // 查看记录
- const viewRecord = (row) =>{
- details.value = JSON.parse(JSON.stringify(row))
- dialogDetails.value = true
+ // 查看记录
+ const viewRecord = (row) => {
+ state.details = JSON.parse(JSON.stringify(row))
+ state.dialogDetails = true
}
// 删除记录
- const deleteRecord = (index) =>{
- chosenIndex.value = index
- deleteDialog.value = true
+ const deleteRecord = (index) => {
+ state.chosenIndex = index
+ state.deleteDialog = true
}
- const conFirmDelete = ()=> {
- tableData.splice(chosenIndex.value,1)
- deleteDialog.value = false
+ const conFirmDelete = () => {
+ state.tableData.splice(state.chosenIndex, 1)
+ state.deleteDialog = false
}
// 修改添加记录
- const editRecord =(index, row)=>{
- chosenIndex.value = index
- dialogAddRecord.value = true
- addRecord.value = JSON.parse(JSON.stringify(row))
+ const editRecord = (index, row) => {
+ state.chosenIndex = index
+ state.dialogAddRecord = true
+ state.addRecord = JSON.parse(JSON.stringify(row))
}
- const confirmAddRecord = async (formEl: FormInstance | undefined) =>{
+ const confirmAddRecord = async (formEl: FormInstance | undefined) => {
if (!formEl) return
await formEl.validate((valid, fields) => {
if (valid) {
- if(chosenIndex.value == -1){
- if(!addRecord.value.shiftSteps || addRecord.value.shiftSteps.length == 0){
+ if (state.chosenIndex == null) {
+ if (!state.addRecord.shiftSteps || state.addRecord.shiftSteps.length == 0) {
ElMessage({
message: '请先设置巡检链后再提交',
type: 'warning',
})
return
- // 判断每个区域是否都设置了至少一个巡检点,没有的话提示设置
- }else if(addRecord.value.shiftSteps.some(i => !i.inspectorData || i.inspectorData.length==0)){
- for(let i =0;i<addRecord.value.shiftSteps.length;i++){
- if(!addRecord.value.shiftSteps[i].inspectorData||addRecord.value.shiftSteps[i].inspectorData.length==0){
+ // 判断每个区域是否都设置了至少一个巡检点,没有的话提示设置
+ } else if (state.addRecord.shiftSteps.some(i => !i.inspectorData || i.inspectorData.length == 0)) {
+ for (let i = 0; i < state.addRecord.shiftSteps.length; i++) {
+ if (!state.addRecord.shiftSteps[i].inspectorData || state.addRecord.shiftSteps[i].inspectorData.length == 0) {
ElMessage({
- message: '请为'+ addRecord.value.shiftSteps[i].name +'设置巡检点',
+ message: '请为' + state.addRecord.shiftSteps[i].name + '设置巡检点',
type: 'warning',
})
}
}
return
- }else{
- addRecord.value.createTime = new Date().toLocaleString('zh', timeForm).replace(/\//g,'-')
- addRecord.value.chainLength = addRecord.value.shiftSteps.length
- addRecord.value.status = '开启'
- tableData.unshift(addRecord.value)
+ } else {
+ state.addRecord.createTime = new Date().toLocaleString('zh', timeForm).replace(/\//g, '-')
+ state.addRecord.chainLength = state.addRecord.shiftSteps.length
+ console.log('11111111111111')
+ state.addRecord.status = '开启'
+ console.log('222222222222222')
+ state.tableData.unshift(state.addRecord)
}
- }else{
- if(addRecord.value.shiftSteps.length == 0){
+ } else {
+ if (state.addRecord.shiftSteps.length == 0) {
ElMessage({
message: '请先设置巡检链后再提交',
type: 'warning',
})
return
- // 判断每个区域是否都设置了至少一个巡检点,没有的话提示设置
- }else if(addRecord.value.shiftSteps.some(i => !i.inspectorData || i.inspectorData.length==0)){
- for(let i =0;i<addRecord.value.shiftSteps.length;i++){
- if(!addRecord.value.shiftSteps[i].inspectorData||addRecord.value.shiftSteps[i].inspectorData.length==0){
+ // 判断每个区域是否都设置了至少一个巡检点,没有的话提示设置
+ } else if (state.addRecord.shiftSteps.some(i => !i.inspectorData || i.inspectorData.length == 0)) {
+ for (let i = 0; i < state.addRecord.shiftSteps.length; i++) {
+ if (!state.addRecord.shiftSteps[i].inspectorData || state.addRecord.shiftSteps[i].inspectorData.length == 0) {
ElMessage({
- message: '请为'+ addRecord.value.shiftSteps[i].name +'设置巡检点',
+ message: '请为' + state.addRecord.shiftSteps[i].name + '设置巡检点',
type: 'warning',
})
}
}
return
- }else{
- tableData[chosenIndex.value] = addRecord.value
+ } else {
+ state.tableData[state.chosenIndex] = state.addRecord
}
}
- dialogAddRecord.value =false
+ state.dialogAddRecord = false
} else {
console.log('error submit!', fields)
}
@@ -695,64 +714,64 @@
}
// 添加弹窗打开前预操作
- const openAdd =()=>{
- addRecord.value.unit = '小时'
+ const openAdd = () => {
+ state.addRecord.unit = '小时'
}
// 弹窗关闭后判断数据初始化
- const closeAdd =()=>{
- addRecord.value={}
- chosenIndex.value = -1
- addShift.value={}
- chosenShiftIndex.value = -1
+ const closeAdd = () => {
+ state.addRecord = {}
+ state.chosenIndex = null
+ state.addShift = {}
+ state.chosenShiftIndex = null
}
- const indexClear = ()=>{
- chosenIndex.value = -1
+ const indexClear = () => {
+ state.chosenIndex = null
}
- const indexShiftClear = ()=>{
- chosenShiftIndex.value = -1
+ const indexShiftClear = () => {
+ state.chosenShiftIndex = null
}
- const indexInspectionClear = ()=>{
- chosenInspectionIndex.value = -1
- chosenShiftIndex.value = -1
+ const indexInspectionClear = () => {
+ state.chosenInspectionIndex = null
+ state.chosenShiftIndex = null
}
// 排序
- function compare(key){
- return function(value1,value2){
- var val1=value1[key];
- var val2=value2[key];
- return val1-val2;
+ function compare(key) {
+ return function (value1, value2) {
+ var val1 = value1[key];
+ var val2 = value2[key];
+ return val1 - val2;
}
}
// 添加删除巡检设施区域
const addFlow = (index) => {
- dialogAddShift.value = true
- chosenShiftIndex.value = index
+ state.dialogAddShift = true
+ state.chosenShiftIndex = index
}
// 删除巡检区域
const deleteFlow = (index) => {
- deleteShiftDialog.value = true
- chosenShiftIndex.value = index
+ state.deleteShiftDialog = true
+ state.chosenShiftIndex = index
}
const conFirmShiftDelete = () => {
- addRecord.value.shiftSteps.splice( chosenShiftIndex.value,1)
- deleteShiftDialog.value = false
+ state.addRecord.shiftSteps.splice(state.chosenShiftIndex, 1)
+ state.deleteShiftDialog = false
}
const confirmAddShift = async (formEl: FormInstance | undefined) => {
if (!formEl) return
await formEl.validate((valid, fields) => {
if (valid) {
- if(addRecord.value.shiftSteps){
- addRecord.value.shiftSteps.splice(chosenShiftIndex.value+1,0,addShift.value)
- }else{
- addRecord.value.shiftSteps = []
- addRecord.value.shiftSteps.unshift(addShift.value)
+ if (state.addRecord.shiftSteps) {
+ state.addRecord.shiftSteps.splice(state.chosenShiftIndex + 1, 0, state.addShift)
+ } else {
+ state.addRecord.shiftSteps = []
+ state.addRecord.shiftSteps.unshift(state.addShift)
}
- dialogAddShift.value = false
+ state.dialogAddShift = false
} else {
console.log('error submit!', fields)
}
@@ -760,63 +779,107 @@
}
- const addSysInspection =(index)=>{
- dialogAddInspection.value = true
- chosenShiftIndex.value = index
+ const addSysInspection = (index) => {
+ state.dialogAddInspection = true
+ state.chosenShiftIndex = index
}
const confirmAddInspection = async (formEl: FormInstance | undefined) => {
if (!formEl) return
await formEl.validate((valid, fields) => {
if (valid) {
- if(addRecord.value.shiftSteps[chosenShiftIndex.value].inspectorData){
- if(chosenInspectionIndex.value == -1){
- addRecord.value.shiftSteps[chosenShiftIndex.value].inspectorData.unshift(addInspection.value)
- addRecord.value.shiftSteps[chosenShiftIndex.value].inspectorData.sort(compare('sort'))
- }else{
- addRecord.value.shiftSteps[chosenShiftIndex.value].inspectorData[chosenInspectionIndex.value] = addInspection.value
- addRecord.value.shiftSteps[chosenShiftIndex.value].inspectorData.sort(compare('sort'))
+ if (state.addRecord.shiftSteps[state.chosenShiftIndex].inspectorData) {
+ if (state.chosenInspectionIndex == null) {
+ state.addRecord.shiftSteps[state.chosenShiftIndex].inspectorData.unshift(state.addInspection)
+ state.addRecord.shiftSteps[state.chosenShiftIndex].inspectorData.sort(compare('sort'))
+ } else {
+ state.addRecord.shiftSteps[state.chosenShiftIndex].inspectorData[state.chosenInspectionIndex] = state.addInspection
+ state.addRecord.shiftSteps[state.chosenShiftIndex].inspectorData.sort(compare('sort'))
}
- }else{
- addRecord.value.shiftSteps[chosenShiftIndex.value].inspectorData = []
- addRecord.value.shiftSteps[chosenShiftIndex.value].inspectorData.unshift(addInspection.value)
- addRecord.value.shiftSteps[chosenShiftIndex.value].inspectorData.sort(compare('sort'))
+ } else {
+ state.addRecord.shiftSteps[state.chosenShiftIndex].inspectorData = []
+ state.addRecord.shiftSteps[state.chosenShiftIndex].inspectorData.unshift(state.addInspection)
+ state.addRecord.shiftSteps[state.chosenShiftIndex].inspectorData.sort(compare('sort'))
}
- dialogAddInspection.value = false
+ state.dialogAddInspection = false
} else {
console.log('error submit!', fields)
}
})
}
- const deleteInspection = (i,index) =>{
- chosenShiftIndex.value = i
- chosenInspectionIndex.value = index
- deleteInspectionDialog.value = true
+ const deleteInspection = (i, index) => {
+ state.chosenShiftIndex = i
+ state.chosenInspectionIndex = index
+ state.deleteInspectionDialog = true
}
- const editInspection =(i,index, row)=>{
- chosenShiftIndex.value = i
- chosenInspectionIndex.value = index
- dialogAddInspection.value = true
- addInspection.value = JSON.parse(JSON.stringify(row))
+ const editInspection = (i, index, row) => {
+ state.chosenShiftIndex = i
+ state.chosenInspectionIndex = index
+ state.dialogAddInspection = true
+ state.addInspection = JSON.parse(JSON.stringify(row))
}
- const conFirmInspectionDelete=()=>{
- addRecord.value.shiftSteps[chosenShiftIndex.value].inspectorData.splice( chosenInspectionIndex.value,1)
- deleteInspectionDialog.value = false
+ const conFirmInspectionDelete = () => {
+ state.addRecord.shiftSteps[state.chosenShiftIndex].inspectorData.splice(state.chosenInspectionIndex, 1)
+ state.deleteInspectionDialog = false
}
- const closeAddShift =()=>{
- addShift.value={}
- chosenShiftIndex.value = -1
+ const closeAddShift = () => {
+ state.addShift = {}
+ state.chosenShiftIndex = null
}
- const closeAddInspection =()=>{
- addInspection.value={}
- chosenShiftIndex.value = -1
+ const closeAddInspection = () => {
+ state.addInspection = {}
+ state.chosenShiftIndex = null
}
+
// 折线图
const renderMenu = async (value: string) => {
- Session.set('projectId',value)
+ Session.set('projectId', value)
userInfos.value.projectId = value
await initBackEndControlRoutes();
};
+
+ return {
+ addRef,
+ addShiftRef,
+ addInspectionRef,
+ addRules,
+ addShiftRules,
+ addInspectionRules,
+ View,
+ Edit,
+ Delete,
+ Refresh,
+ Plus,
+ changeSearch,
+ handleSizeChange,
+ handleCurrentChange,
+ handleChange,
+ viewRecord,
+ deleteRecord,
+ conFirmDelete,
+ openAdd,
+ editRecord,
+ confirmAddRecord,
+ closeAdd,
+ addFlow,
+ conFirmShiftDelete,
+ confirmAddShift,
+ closeAddShift,
+ deleteInspection,
+ addSysInspection,
+ confirmAddInspection,
+ conFirmInspectionDelete,
+ closeAddInspection,
+ editInspection,
+ deleteFlow,
+ indexClear,
+ indexShiftClear,
+ indexInspectionClear,
+ renderMenu,
+ ...toRefs(state)
+ }
+ }
+ }
</script>
<style scoped lang="scss">
diff --git a/src/views/IntelligentXjSys/intelligentMap/index.vue b/src/views/IntelligentXjSys/intelligentMap/index.vue
new file mode 100644
index 0000000..3df2f3c
--- /dev/null
+++ b/src/views/IntelligentXjSys/intelligentMap/index.vue
@@ -0,0 +1,716 @@
+<template>
+ <div class="container">
+ <div class="big-title"><span></span>大型实验室智能巡检系统<span></span></div>
+ <div style="font-size: 14px;color: #00ffff">{{present}}</div>
+ <div class="blocks">
+ <div class="current-data">
+ <div class="data-area">
+ <img src="../../../assets/loginPage/xj-icon.png">
+ <div>当前巡检:<span>实验室装置区</span></div>
+ </div>
+ <div class="data-spot">
+ <div>
+ <span>巡检点</span>
+ <p>3970A</p>
+ </div>
+ <div>
+ <span>指标</span>
+ <p>压力</p>
+ </div>
+ </div>
+ </div>
+ <div class="line-map">
+ <div class="item item-t item-l">
+ <section>
+ <div class="dot"></div>
+ <div class="pulse"></div>
+ <div class="pulse1"></div>
+ </section>
+ <div>
+ <div><span>巡检点:</span><span>73017</span></div>
+ <div><span>定位状态:</span><span>已完成</span></div>
+ <div><span>压力:</span><span>3.6Bar</span></div>
+ </div>
+ </div>
+ <div class="item item-l">
+ <section>
+ <div class="dot"></div>
+ <div class="pulse"></div>
+ <div class="pulse1"></div>
+ </section>
+ <div>
+ <div><span>巡检点:</span><span>73018</span></div>
+ <div><span>定位状态:</span><span>已完成</span></div>
+ <div><span>压力:</span><span>3.6Bar</span></div>
+ </div>
+ </div>
+ <div></div>
+ <div></div>
+ <div></div>
+ <div></div>
+ <div></div>
+ <div class="item item-l">
+ <section>
+ <div class="dot"></div>
+ <div class="pulse"></div>
+ <div class="pulse1"></div>
+ </section>
+ <div>
+ <div><span>巡检点:</span><span>73016</span></div>
+ <div><span>定位状态:</span><span>已完成</span></div>
+ <div><span>压力:</span><span>3.6Bar</span></div>
+ </div>
+ </div>
+ <div class="item item-l">
+ <section>
+ <div class="dot"></div>
+ <div class="pulse"></div>
+ <div class="pulse1"></div>
+ </section>
+ <div>
+ <div><span>巡检点:</span><span>73019</span></div>
+ <div><span>定位状态:</span><span>已完成</span></div>
+ <div><span>温度:</span><span>80℃</span></div>
+ </div>
+ </div>
+ <div></div>
+ <div></div>
+ <div class="item item-t item-l undone">
+ <section>
+ <div class="dot"></div>
+ <div class="pulse"></div>
+ <div class="pulse1"></div>
+ </section>
+ <div>
+ <div><span>巡检点:</span><span>3970C</span></div>
+ <div><span>定位状态:</span><span>未完成</span></div>
+ <div><span>压力:</span><span>--</span></div>
+ </div>
+ </div>
+ <div class="item item-t undone">
+ <section>
+ <div class="dot"></div>
+ <div class="pulse"></div>
+ <div class="pulse1"></div>
+ </section>
+ <div>
+ <div><span>巡检点:</span><span>3970D</span></div>
+ <div><span>定位状态:</span><span>未完成</span></div>
+ <div><span>压力:</span><span>--</span></div>
+ </div>
+ </div>
+ <div class="item finish">
+ <section>
+ <div class="dot"></div>
+ <div class="pulse"></div>
+ <div class="pulse1"></div>
+ </section>
+ <span></span>
+ <p>
+ 完成巡检
+ </p>
+ </div>
+ <div class="item start">
+ <section>
+ <div class="dot"></div>
+ <div class="pulse"></div>
+ <div class="pulse1"></div>
+ </section>
+ <span></span>
+ <p>
+ 开始巡检
+ </p>
+ </div>
+ <div class="item item-l">
+ <section>
+ <div class="dot"></div>
+ <div class="pulse"></div>
+ <div class="pulse1"></div>
+ </section>
+ <div>
+ <div><span>巡检点:</span><span>73020</span></div>
+ <div><span>定位状态:</span><span>已完成</span></div>
+ <div><span>压力:</span><span>3.6Bar</span></div>
+ </div>
+ </div>
+ <div></div>
+ <div></div>
+ <div class="item item-l undone">
+ <section>
+ <div class="dot"></div>
+ <div class="pulse"></div>
+ <div class="pulse1"></div>
+ </section>
+ <div>
+ <div><span>巡检点:</span><span>3970B</span></div>
+ <div><span>定位状态:</span><span>未完成</span></div>
+ <div><span>压力:</span><span>--</span></div>
+ </div>
+ </div>
+ <div class="pic-tit water">
+ <img src="../../../assets/loginPage/equipment.JPG">
+ <p>实验室装置区</p>
+ </div>
+ <div></div>
+ <div class="pic-tit">
+ <img src="../../../assets/loginPage/wind.JPG">
+ <p>实验室风机系统</p>
+ </div>
+ <div class="item item-l warning">
+ <section>
+ <div class="dot"></div>
+ <div class="pulse"></div>
+ <div class="pulse1"></div>
+ </section>
+ <div>
+ <div><span>巡检点:</span><span>73021</span></div>
+ <div><span>定位状态:</span><span>已完成</span></div>
+ <div><span>温度:</span><span>130℃</span></div>
+ </div>
+ </div>
+ <div></div>
+ <div></div>
+ <div class="item item-l undone">
+ <section>
+ <div class="dot"></div>
+ <div class="pulse"></div>
+ <div class="pulse1"></div>
+ </section>
+ <div>
+ <div><span>巡检点:</span><span>3970A</span></div>
+ <div><span>定位状态:</span><span>未完成</span></div>
+ <div><span>压力:</span><span>--</span></div>
+ </div>
+ </div>
+ <div></div>
+ <div></div>
+ <div class="pic-tit water">
+ <img src="../../../assets/loginPage/watersys.JPG">
+ <p>实验室循环水系统</p>
+ </div>
+ <div class="item item-t">
+ <section>
+ <div class="dot"></div>
+ <div class="pulse"></div>
+ <div class="pulse1"></div>
+ </section>
+ <div>
+ <div><span>巡检点:</span><span>80210</span></div>
+ <div><span>定位状态:</span><span>已完成</span></div>
+ <div><span>温度:</span><span>80摄氏度</span></div>
+ </div>
+ </div>
+ <div class="item item-t">
+ <section>
+ <div class="dot"></div>
+ <div class="pulse"></div>
+ <div class="pulse1"></div>
+ </section>
+ <div>
+ <div><span>巡检点:</span><span>80211</span></div>
+ <div><span>定位状态:</span><span>已完成</span></div>
+ <div><span>温度:</span><span>80摄氏度</span></div>
+ </div>
+ </div>
+ <div class="item item-t">
+ <section>
+ <div class="dot"></div>
+ <div class="pulse"></div>
+ <div class="pulse1"></div>
+ </section>
+ <div>
+ <div><span>巡检点:</span><span>80212</span></div>
+ <div><span>定位状态:</span><span>已完成</span></div>
+ <div><span>温度:</span><span>80摄氏度</span></div>
+ </div>
+ </div>
+ <div class="item">
+ <section>
+ <div class="dot"></div>
+ <div class="pulse"></div>
+ <div class="pulse1"></div>
+ </section>
+ <div>
+ <div><span>巡检点:</span><span>80213</span></div>
+ <div><span>定位状态:</span><span>已完成</span></div>
+ <div><span>温度:</span><span>80摄氏度</span></div>
+ </div>
+ </div>
+ <div></div>
+ <div></div>
+ </div>
+ <div class="section-1">
+
+ </div>
+ <div class="section-2">
+
+ </div>
+ <div class="section-3">
+
+ </div>
+ </div>
+ </div>
+</template>
+
+<script>
+export default {
+ name: 'NewForm',
+ props: {
+
+ },
+ data(){
+ return{
+ present: ''
+ }
+ },
+ created() {
+ setInterval(() => {
+ this.present = new Date().toLocaleString()
+ }, 1000)
+ }
+}
+</script>
+
+<!-- Add "scoped" attribute to limit CSS to this component only -->
+<style scoped lang="scss">
+ @keyframes warn {
+ 0% {
+ transform: scale(0.3);
+ -webkit-transform: scale(0.3);
+ opacity: 0.0;
+ }
+
+ 25% {
+ transform: scale(0.3);
+ -webkit-transform: scale(0.3);
+ opacity: 0.1;
+ }
+
+ 50% {
+ transform: scale(0.5);
+ -webkit-transform: scale(0.5);
+ opacity: 0.3;
+ }
+
+ 75% {
+ transform: scale(0.8);
+ -webkit-transform: scale(0.8);
+ opacity: 0.6;
+ }
+
+ 100% {
+ transform: scale(1);
+ -webkit-transform: scale(1);
+ opacity: 0.0;
+ }
+ }
+
+ @keyframes warn1 {
+ 0% {
+ transform: scale(0.3);
+ -webkit-transform: scale(0.3);
+ opacity: 0.0;
+ }
+
+ 25% {
+ transform: scale(0.3);
+ -webkit-transform: scale(0.3);
+ opacity: 0.1;
+ }
+
+ 50% {
+ transform: scale(0.3);
+ -webkit-transform: scale(0.3);
+ opacity: 0.3;
+ }
+
+ 75% {
+ transform: scale(0.5);
+ -webkit-transform: scale(0.5);
+ opacity: 0.6;
+ }
+
+ 100% {
+ transform: scale(0.8);
+ -webkit-transform: scale(0.8);
+ opacity: 0.0;
+ }
+ }
+
+ @keyframes circle {
+ 0% {
+ transform: rotate(0);
+ -webkit-transform: rotate(0);
+ }
+ 100% {
+ transform: rotate(360deg);
+ -webkit-transform: rotate(360deg);
+ }
+ }
+ .container{
+ width: 100%;
+ height: 100%;
+ position: relative;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ background: url("../../../assets/loginPage/map-bg.jpg") no-repeat center;
+ background-size: 100% 100%;
+ .big-title{
+ height: 40px;
+ line-height: 40px;
+ font-size: 28px;
+ font-weight: bold;
+ margin: 10px 0 20px;
+ text-align: center;
+ color: #fff;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+
+ span{
+ width: 60px;
+ height: 1px;
+ background: #36FCFC;
+ margin: 0 20px;
+ }
+ }
+
+ .blocks{
+ position: relative;
+ width: 100%;
+ height: 100%;
+ padding: 20px 20px 20px 100px;
+ box-sizing: border-box;
+ .line-map{
+ position: absolute;
+ width: calc(100% - 120px);
+ left: 110px;
+ top: 10px;
+ flex-direction: column;
+ align-items: center;
+ z-index: 99;
+ display: grid;
+ grid-template-columns: repeat(7,1fr);
+ grid-gap: 0;
+
+ .item{
+ width: calc((100vw - 120px)/ 7);
+ height: calc((100vh - 130px)/ 5);
+ padding: 20px 40px 20px 20px;
+ position: relative;
+ box-sizing: border-box;
+
+ section{
+ width: 28px;
+ height: 28px;
+ border-radius: 50%;
+ position: absolute;
+ border: 1px solid #00ff66;
+ top: -14px;
+ left: -14px;
+
+ .dot {
+ position: absolute;
+ width: 18px;
+ height: 18px;
+ left: 4px;
+ top: 4px;
+ -webkit-border-radius: 50%;
+ -moz-border-radius: 50%;
+ border: 1px solid #00ff66;
+ border-radius: 50%;
+ background-color:#00ff66;
+ z-index: 2;
+ }
+ .pulse {
+ position: absolute;
+ width: 56px;
+ height: 56px;
+ left: -15px;
+ top: -15px;
+ border: 1px solid #00ff66;
+ -webkit-border-radius: 50%;
+ -moz-border-radius: 50%;
+ border-radius: 50%;
+ z-index: 1;
+ opacity: 0;
+ -webkit-animation: warn 2s ease-out;
+ -moz-animation: warn 2s ease-out;
+ animation: warn 2s ease-out;
+ -webkit-animation-iteration-count: infinite;
+ -moz-animation-iteration-count: infinite;
+ animation-iteration-count: infinite;
+ box-shadow: 1px 1px 30px #00ff66;
+ }
+ .pulse1 {
+ position: absolute;
+ width: 56px;
+ height: 56px;
+ left: -15px;
+ top: -15px;
+ border: 1px solid #3399ff;
+ -webkit-border-radius: 50%;
+ -moz-border-radius: 50%;
+ border-radius: 50%;
+ z-index: 1;
+ opacity: 0;
+ -webkit-animation: warn1 2s ease-out;
+ -moz-animation: warn1 2s ease-out;
+ animation: warn1 2s ease-out;
+ -webkit-animation-iteration-count: infinite;
+ -moz-animation-iteration-count: infinite;
+ animation-iteration-count: infinite;
+ box-shadow: 1px 1px 30px #3399ff;
+ }
+ }
+ &>div{
+ padding: 10px 0;
+ border-radius: 8px;
+ background-image: linear-gradient(to right,rgba(8,109,209,.4),rgba(11,255,255,.2));
+ border: 1px solid rgba(54,252,252,.6);
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+
+ div{
+ &:nth-of-type(2){
+ margin: 5px 0;
+ }
+
+ span{
+ display: inline-block;
+ width: 50%;
+ font-size: 14px;
+ color: #fff;
+ text-align: left;
+
+ &:first-of-type{
+ text-align: right;
+ color: rgba(255,255,255,.8);
+ }
+ }
+ }
+ }
+
+ p{
+ width: 140px;
+ height: 50px;
+ font-size: 18px;
+ line-height: 48px;
+ text-align: center;
+ color: #fff;
+ border-radius: 8px;
+ background-image: linear-gradient(to right,rgba(11,255,255,.2),rgba(8,109,209,.4));
+ border: 1px solid rgba(54,252,252,.6);
+ }
+ }
+
+ .item-t{
+ border-top: 1px solid #36FCFC;
+ }
+ .item-l{
+ border-left: 1px solid #36FCFC;
+ }
+ .warning{
+ &>section{
+ border: 1px solid #ff0000;
+
+ .dot{
+ border: 1px solid #ff0000;
+ background: #ff0000;
+ }
+ .pulse{
+ border: 1px solid #ff0000;
+ box-shadow: 1px 1px 30px #ff0000;
+ }
+ .pulse1{
+ border: 1px solid #ff0000;
+ box-shadow: 1px 1px 30px #ff0000;
+ }
+ }
+
+ &>div{
+ div:last-of-type{
+ span:nth-of-type(2){
+ color: #ff0000;
+ }
+ }
+ }
+ }
+ .undone{
+ &>section{
+ border: 1px solid #ccc;
+
+ .dot{
+ border: 1px solid #ccc;
+ background: #ccc;
+ }
+ .pulse{
+ display: none;
+ }
+ .pulse1{
+ display: none;
+ }
+ }
+ }
+ .pic-tit{
+ display: flex;
+ width: calc((100vw - 120px)/ 7);
+ height: 160px;
+ padding: 20px;
+ transform: translate(-20px,-40%);
+ flex-direction: column;
+ align-items: flex-start;
+
+ img{
+ width: calc((100vw - 120px)/ 7 - 40px);
+ height: 90px;
+ margin-bottom: 10px;
+ border-radius: 4px;
+ }
+ p{
+ font-size: 16px;
+ color: #00ffff;
+ font-weight: bold;
+ }
+ }
+
+ .water{
+ transform: none;
+ }
+ .start{
+ padding: 40px 0;
+ p{
+ margin-top: -21px;
+ margin-left: 20px;
+ }
+ span{
+ width: 1px;
+ height: 50px;
+ background: #36FCFC;
+ position: absolute;
+ top: -10px;
+ left: 0;
+ }
+ section{
+ position: absolute;
+ top: 30px;
+ left: -14px;
+ }
+ }
+ .finish{
+ padding: 0 40px;
+ p{
+ margin-top: -25px;
+ margin-left: 4px;
+ }
+ span{
+ width: 100%;
+ height: 1px;
+ background: #36FCFC;
+ position: absolute;
+ top: 0;
+ left: calc(40px - 100%);
+ }
+ section{
+ position: absolute;
+ top: -14px;
+ left: 30px;
+ }
+ }
+ }
+ .current-data{
+ position: absolute;
+ z-index: 999999;
+ width: 270px;
+ height: 142px;
+ left: 50%;
+ padding: 20px 30px;
+ box-sizing: border-box;
+ transform: translateX(-65%);
+ background: url("../../../assets/loginPage/xj-bg.png") no-repeat center;
+ background-size: 100% 100%;
+
+ .data-area{
+ display: flex;
+ align-items: center;
+ border-bottom: 1px solid #00FFFF;
+ font-weight: bold;
+ padding-bottom: 10px;
+ box-sizing: border-box;
+
+ img{
+ width: 30px;
+ height: 30px;
+ margin-right: 10px;
+ animation: circle 1s ease-in-out infinite;
+ }
+
+ div{
+ font-size: 15px;
+ color: rgba(255,255,255,.8);
+
+ span{
+ color: #00FFFF;
+ }
+ }
+ }
+
+ .data-spot{
+ display: flex;
+ align-items: flex-start;
+ margin-top: 10px;
+
+ &>div{
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ width: 50%;
+ font-size: 14px;
+ color: rgba(255,255,255,.8);
+
+ p{
+ margin-top: 6px;
+ color: #00FFFF;
+ }
+
+ &:first-of-type{
+ border-right: 1px solid #36FCFC;
+ }
+ }
+ }
+ }
+ .section-1{
+ position: absolute;
+ left: 70px;
+ top: -10px;
+ width: calc((200vw - 240px) / 7 + 60px);
+ height: 630px;
+ background: rgba(0,100,190,.1);
+ border: 1px solid rgba(0,100,190,.4);
+ border-radius: 8px;
+ }
+ .section-2{
+ position: absolute;
+ left: calc((400vw - 480px)/ 7 + 70px);
+ top: 150px;
+ width: calc((200vw - 240px) / 7 + 60px);
+ height: 470px;
+ background: rgba(0,100,190,.1);
+ border: 1px solid rgba(0,100,190,.4);
+ border-radius: 8px;
+ }
+ .section-3{
+ position: absolute;
+ left: 100px;
+ top: 630px;
+ width: calc((500vw - 600px)/ 7 + 30px);
+ height: 180px;
+ background: rgba(0,100,190,.1);
+ border: 1px solid rgba(0,100,190,.4);
+ border-radius: 8px;
+ }
+ }
+ }
+</style>
diff --git a/src/views/basicRightsManagement/personnelShiftManagement/holidayManagement/index.vue b/src/views/basicRightsManagement/personnelShiftManagement/holidayManagement/index.vue
index 5ffe431..dcd595a 100644
--- a/src/views/basicRightsManagement/personnelShiftManagement/holidayManagement/index.vue
+++ b/src/views/basicRightsManagement/personnelShiftManagement/holidayManagement/index.vue
@@ -1,6 +1,6 @@
<template>
<div class="home-container">
- <el-scrollbar height="100%">
+ <div style="height: 100%">
<el-row class="homeCard">
<el-col :span="8">
<div class="grid-content topInfo">
@@ -24,12 +24,14 @@
ref="multipleTableRef"
:data="tableData"
style="width: 100%"
+ height="calc(100% - 100px)"
:header-cell-style="{background: '#fafafa'}"
@selection-change="handleSelectionChange"
>
<el-table-column type="selection" width="55" />
<el-table-column property="name" label="休息日名称"/>
<el-table-column property="type" label="休息类型"/>
+ <el-table-column property="info" label="描述信息"/>
<el-table-column fixed="right" label="操作" align="center" width="250">
<template #default="scope">
<el-button link type="primary" size="small" :icon="View" @click="viewRecord(scope.row)">查看</el-button>
@@ -38,22 +40,22 @@
</template>
</el-table-column>
</el-table>
- </div>
- <div class="pageBtn">
- <el-pagination
- v-model:currentPage="currentPage"
- v-model:page-size="pageSize"
- :page-sizes="[10, 15]"
- small=false
- background
- layout="total, sizes, prev, pager, next, jumper"
- :total="100"
- @size-change="handleSizeChange"
- @current-change="handleCurrentChange"
- />
+ <div class="pageBtn">
+ <el-pagination
+ v-model:currentPage="currentPage"
+ v-model:page-size="pageSize"
+ :page-sizes="[10, 15]"
+ small=false
+ background
+ layout="total, sizes, prev, pager, next, jumper"
+ :total="100"
+ @size-change="handleSizeChange"
+ @current-change="handleCurrentChange"
+ />
+ </div>
</div>
</div>
- </el-scrollbar>
+ </div>
<el-dialog v-model="dialogDetails" title="休息日详情">
<el-form :model="details" label-width="120px">
<el-form-item label="名称">
@@ -145,171 +147,175 @@
interface type {
}
- // export default defineComponent({
- // name: 'workCheckinRecord',
- // setup() {
- const userInfo = useUserInfo()
- const { userInfos } = storeToRefs(userInfo);
- const state = reactive<stateType>({});
- const currentPage = ref(1)
- const pageSize = ref(10)
- const chosenIndex = ref(-1)
- const handleSizeChange = (val: number) => {
- console.log(`${val} items per page`)
+ const userInfo = useUserInfo()
+ const { userInfos } = storeToRefs(userInfo);
+ const state = reactive<stateType>({});
+ const currentPage = ref(1)
+ const pageSize = ref(10)
+ const chosenIndex = ref(-1)
+ const handleSizeChange = (val: number) => {
+ console.log(`${val} items per page`)
+ }
+ const handleCurrentChange = (val: number) => {
+ console.log(`current page: ${val}`)
+ }
+ const casProps = {
+ expandTrigger: 'hover',
+ }
+ const tableData = reactive(
+ [
+ {
+ name: '周末休息',
+ type: '每周公休假日',
+ content: ''
+ },
+ {
+ name: '节假日休息',
+ type: '每年法定节假日',
+ content: ''
+ },
+ {
+ name: '每周一、周四休息',
+ type: '自定义休息日,每周',
+ content: ['周一','周四']
+ },
+ {
+ name: '每月休息日休息',
+ type: '自定义休息日,每月',
+ content: ['5','15','25']
}
- const handleCurrentChange = (val: number) => {
- console.log(`current page: ${val}`)
- }
- const casProps = {
- expandTrigger: 'hover',
- }
- const tableData = reactive(
- [
- {
- name: '周末休息',
- type: '每周公休假日',
- content: ''
- },
- {
- name: '节假日休息',
- type: '每年法定节假日',
- content: ''
- },
- {
- name: '每周一、周四休息',
- type: '自定义休息日,每周',
- content: ['周一','周四']
- },
- {
- name: '每月休息日休息',
- type: '自定义休息日,每月',
- content: ['5','15','25']
- }
- ]
- )
- const holidayList =reactive([
+ ]
+ )
+ const holidayList =reactive([
+ {
+ value: '每周公休假日',
+ label: '每周公休假日'
+ },
+ {
+ value: '每年法定节假日',
+ label: '每年法定节假日'
+ },
+ {
+ value: '自定义休息日',
+ label: '自定义休息日',
+ children: [
{
- value: '每周公休假日',
- label: '每周公休假日'
+ value: '每周',
+ label: '每周',
},
{
- value: '每年法定节假日',
- label: '每年法定节假日'
- },
- {
- value: '自定义休息日',
- label: '自定义休息日',
- children: [
- {
- value: '每周',
- label: '每周',
- },
- {
- value: '每月',
- label: '每月',
- }
- ]
+ value: '每月',
+ label: '每月',
}
- ])
- const handleChange = (value) => {
- addRecord.value.content = []
- console.log(JSON.parse(JSON.stringify(value)))
+ ]
+ }
+ ])
+ const handleChange = (value) => {
+ addRecord.value.content = []
+ console.log(JSON.parse(JSON.stringify(value)))
+ }
+ const weekDays = reactive(['周一','周二','周三','周四','周五','周六','周日'])
+ const addRef = ref<FormInstance>()
+ const addRules = reactive<FormRules>({
+ name:[{required: true, message: '该内容不能为空',trigger:'blur'}],
+ type:[{required: true, message: '该内容不能为空',trigger:'blur'}],
+ content:[{required: true, message: '该内容不能为空'}]
+ })
+ const dialogDetails = ref(false)
+ const dialogAddRecord = ref(false)
+ const deleteDialog = ref(false)
+ const addRecord = ref({})
+ const details = ref({})
+ const viewRecord = (row) =>{
+ details.value = JSON.parse(JSON.stringify(row))
+ dialogDetails.value = true
+ }
+ const deleteRecord = (index) =>{
+ chosenIndex.value = index
+ deleteDialog.value = true
+ }
+ const conFirmDelete = ()=> {
+ tableData.splice(chosenIndex.value,1)
+ deleteDialog.value = false
+ }
+ const confirmAddRecord = async (formEl: FormInstance | undefined) =>{
+ if (!formEl) return
+ await formEl.validate((valid, fields) => {
+ if (valid) {
+ if(chosenIndex.value == -1){
+ tableData.unshift(addRecord.value)
+ }else{
+ tableData[chosenIndex.value] = addRecord.value
+ }
+ dialogAddRecord.value =false
+ } else {
+ console.log('error submit!', fields)
}
- const weekDays = reactive(['周一','周二','周三','周四','周五','周六','周日'])
- const addRef = ref<FormInstance>()
- const addRules = reactive<FormRules>({
- name:[{required: true, message: '该内容不能为空',trigger:'blur'}],
- type:[{required: true, message: '该内容不能为空',trigger:'blur'}],
- content:[{required: true, message: '该内容不能为空'}]
- })
- const dialogDetails = ref(false)
- const dialogAddRecord = ref(false)
- const deleteDialog = ref(false)
- const addRecord = ref({})
- const details = ref({})
- const viewRecord = (row) =>{
- details.value = JSON.parse(JSON.stringify(row))
- dialogDetails.value = true
- }
- const deleteRecord = (index) =>{
- chosenIndex.value = index
- deleteDialog.value = true
- }
- const conFirmDelete = ()=> {
- tableData.splice(chosenIndex.value,1)
- deleteDialog.value = false
- }
- const confirmAddRecord = async (formEl: FormInstance | undefined) =>{
- if (!formEl) return
- await formEl.validate((valid, fields) => {
- if (valid) {
- if(chosenIndex.value == -1){
- tableData.unshift(addRecord.value)
- }else{
- tableData[chosenIndex.value] = addRecord.value
- }
- dialogAddRecord.value =false
- } else {
- console.log('error submit!', fields)
- }
- })
+ })
- }
- const closeAdd =()=>{
- addRecord.value={}
- chosenIndex.value = -1
- }
- const indexClear = ()=>{
- chosenIndex.value = -1
- }
- const editRecord =(index, row)=>{
- dialogAddRecord.value = true
- chosenIndex.value = index
- addRecord.value = JSON.parse(JSON.stringify(row))
- }
- // 折线图
- const renderMenu = async (value: string) => {
- Session.set('projectId',value)
- userInfos.value.projectId = value
- await initBackEndControlRoutes();
- };
- // return {
- // renderMenu,
- // multipleTableRef,
- // tableData,
- // currentPage,
- // pageSize,
- // dialogDetails,
- // details,
- // deleteDialog,
- // dialogAddRecord,
- // viewRecord,
- // deleteRecord,
- // handleSizeChange,
- // handleCurrentChange,
- // Plus,
- // Edit,
- // Delete,
- // Search,
- // Download,
- // handleSelectionChange,
- // Refresh,
- // ...toRefs(state),
- // };
- // },
- // });
+ }
+ const closeAdd =()=>{
+ addRecord.value={}
+ chosenIndex.value = -1
+ }
+ const indexClear = ()=>{
+ chosenIndex.value = -1
+ }
+ const editRecord =(index, row)=>{
+ dialogAddRecord.value = true
+ chosenIndex.value = index
+ addRecord.value = JSON.parse(JSON.stringify(row))
+ }
+ // 折线图
+ const renderMenu = async (value: string) => {
+ Session.set('projectId',value)
+ userInfos.value.projectId = value
+ await initBackEndControlRoutes();
+ };
</script>
<style scoped lang="scss">
$homeNavLengh: 8;
.home-container {
- height: 100%;
+ height: calc(100vh - 114px);
+ box-sizing: border-box;
overflow: hidden;
.homeCard{
width: 100%;
padding: 20px;
+ box-sizing: border-box;
background: #fff;
border-radius: 4px;
+
+ .main-card{
+ width: 100%;
+ height: 100%;
+ .cardTop{
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ margin-bottom: 20px;
+ .mainCardBtn{
+ margin: 0;
+ }
+ }
+ .pageBtn{
+ height: 60px;
+ display: flex;
+ align-items: center;
+ justify-content: right;
+
+ .demo-pagination-block + .demo-pagination-block {
+ margin-top: 10px;
+ }
+ .demo-pagination-block .demonstration {
+ margin-bottom: 16px;
+ }
+ }
+ }
+ &:last-of-type{
+ height: calc(100% - 100px);
+ }
}
.el-row{
display: flex;
@@ -333,37 +339,6 @@
white-space: nowrap;
margin-right: 20px;
}
- }
- }
- .mainPages{
- height: 100%;
- display: flex;
- flex-direction: column;
- justify-content: space-between;
- }
- .main-card{
- width: 100%;
- .cardTop{
- display: flex;
- align-items: center;
- justify-content: space-between;
- margin-bottom: 20px;
- .mainCardBtn{
- margin: 0;
- }
- }
- }
- .pageBtn{
- display: flex;
- align-items: center;
- justify-content: right;
- margin-top: 20px;
-
- .demo-pagination-block + .demo-pagination-block {
- margin-top: 10px;
- }
- .demo-pagination-block .demonstration {
- margin-bottom: 16px;
}
}
}
diff --git a/src/views/basicRightsManagement/personnelShiftManagement/holidayTime/index.vue b/src/views/basicRightsManagement/personnelShiftManagement/holidayTime/index.vue
new file mode 100644
index 0000000..7bfacde
--- /dev/null
+++ b/src/views/basicRightsManagement/personnelShiftManagement/holidayTime/index.vue
@@ -0,0 +1,625 @@
+<template>
+ <div class="home-container">
+ <div style="height: 100%">
+ <el-row class="homeCard">
+ <el-col :span="8">
+ <div class="grid-content topInfo">
+ <el-input v-model="searchWord" placeholder="休息日名称"></el-input>
+ <el-button type="primary" @click="searchRecord">查询</el-button>
+ <el-button plain @click="clearSearch">重置</el-button>
+ </div>
+ </el-col>
+ </el-row>
+ <div class="homeCard">
+ <div class="main-card">
+ <el-row class="cardTop">
+ <el-col :span="12" class="mainCardBtn">
+ <el-button type="primary" :icon="Plus" size="default" @click="dialogAddRecord=true">新建</el-button>
+<!-- <el-button type="warning" :icon="Edit" size="default" plain>修改</el-button>-->
+ <el-button type="danger" :icon="Delete" size="default" plain @click="deleteWorkTimePeriods">删除</el-button>
+ </el-col>
+ <el-button type="primary" :icon="Refresh" size="default" @click="reLoadData()"/>
+ </el-row>
+ <el-table
+ ref="multipleTableRef"
+ :data="tableData"
+ style="width: 100%"
+ height="calc(100% - 100px)"
+ :header-cell-style="{background: '#fafafa'}"
+ @selection-change="handleSelectionChange"
+ >
+ <el-table-column type="selection" width="100" />
+ <el-table-column property="name" label="休息日名称"/>
+ <el-table-column property="type" label="休息日类型"/>
+ <el-table-column property="info" label="描述信息"/>
+ <el-table-column fixed="right" label="操作" align="center" width="250">
+ <template #default="scope">
+ <el-button link type="primary" size="small" :icon="View" @click="viewRecord(scope.row)">查看</el-button>
+ <el-button link type="primary" size="small" :icon="Edit" @click="editRecord(scope.$index ,scope.row)">修改</el-button>
+ <el-button link type="danger" size="small" :icon="Delete" @click="deleteRecord(scope.row)">删除</el-button>
+ </template>
+ </el-table-column>
+ </el-table>
+ <div class="pageBtn">
+ <el-pagination
+ v-model:currentPage="pageIndex"
+ v-model:page-size="pageSize"
+ :page-sizes="[10, 15]"
+ small=false
+ background
+ layout="total, sizes, prev, pager, next, jumper"
+ :total="totalSize"
+ @size-change="handleSizeChange"
+ @current-change="handleCurrentChange"
+ />
+ </div>
+ </div>
+ </div>
+ </div>
+ <el-dialog v-model="dialogDetails" title="休息时间">
+ <el-form :model="details" label-width="120px">
+ <el-form-item label="名称">
+ <el-input
+ v-model="details.name"
+ readonly
+ />
+ </el-form-item>
+ <el-form-item label="休假类型">
+ <el-input
+ v-model="details.type"
+ readonly
+ />
+ </el-form-item>
+ <el-form-item label="休假时间" v-if="details.content.length>0">
+ <el-input
+ v-model="details.content"
+ readonly
+ />
+ </el-form-item>
+ <el-form-item label="描述信息" v-if="details.info">
+ <el-input
+ v-model="details.info"
+ type="textarea"
+ readonly
+ />
+ </el-form-item>
+ <el-form-item>
+ <el-button type="primary" @click="dialogDetails = false" size="default">确认</el-button>
+ </el-form-item>
+ </el-form>
+ </el-dialog>
+ <el-dialog v-model="dialogAddRecord" title="休息时间编辑" @close="closeAdd" @open="openAdd">
+ <el-form :model="addRecord" label-width="120px" ref="addRef" :rules="addRules">
+ <el-form-item label="休息日名称" prop="name">
+ <el-input
+ v-model="addRecord.name"
+ >
+ </el-input>
+ </el-form-item>
+ <el-form-item label="休假类型" prop="type">
+ <el-cascader
+ v-model="addRecord.type"
+ :options="holidayList"
+ :props="casProps"
+ @change="handleChange"
+ />
+ </el-form-item>
+ <el-form-item label="选择休假时间" prop="content" v-if="addRecord.type && JSON.parse(JSON.stringify(addRecord.type))[1] == '每周'">
+ <el-checkbox-group v-model="addRecord.content">
+ <el-checkbox v-for="(item,i) in weekDays" :label="item" :key="i"/>
+ </el-checkbox-group>
+ </el-form-item>
+ <el-form-item label="选择休假时间" prop="content" v-if="addRecord.type && JSON.parse(JSON.stringify(addRecord.type))[1] == '每月'">
+ <el-checkbox-group v-model="addRecord.content">
+ <el-checkbox v-for="index in 31" :label="index" :key="index"/>
+ </el-checkbox-group>
+ </el-form-item>
+ <el-form-item label="描述信息" prop="info">
+ <el-input
+ v-model="addRecord.info"
+ type="textarea"
+ >
+ </el-input>
+ </el-form-item>
+ <el-form-item>
+ <el-button type="warning" @click="dialogAddRecord = false" size="default" plain>取消</el-button>
+ <el-button type="primary" @click="confirmAddRecord(addRef)" size="default">确认</el-button>
+ </el-form-item>
+ </el-form>
+ </el-dialog>
+ <el-dialog v-model="deleteDialog" title="提示" width="30%" center @close="indexClear">
+ <span>您确定要删除该条记录吗?</span>
+ <template #footer>
+ <span class="dialog-footer">
+ <el-button @click="deleteDialog = false" size="default">取消</el-button>
+ <el-button type="primary" @click="conFirmDelete" size="default">确认</el-button>
+ </span>
+ </template>
+ </el-dialog>
+ </div>
+</template>
+
+<script lang="ts">
+ import { toRefs, reactive, ref, onMounted } from 'vue';
+ import { storeToRefs } from 'pinia';
+ import { initBackEndControlRoutes } from '/@/router/backEnd';
+ import {useUserInfo} from "/@/stores/userInfo";
+ import { Session } from '/@/utils/storage';
+ import { Edit, View, Plus, Delete, Refresh, Search, Download } from '@element-plus/icons-vue'
+ import { ElTable } from 'element-plus'
+ import { FormInstance, FormRules, ElMessage } from 'element-plus'
+ import { workingHoursApi } from '/@/api/basicDateManage/personShiftManage/workingHours';
+
+
+
+ // 定义接口来定义对象的类型
+ interface stateType {
+ tableData: Array<string>,
+ multipleSelection: Array<any>,
+ deleteArr: Array<any>,
+ dialogDetails: boolean,
+ dialogAddRecord: boolean,
+ deleteDialog: boolean,
+ pageIndex: number,
+ pageSize: number,
+ searchWord: string,
+ totalSize: number,
+ addRecord: {
+ name: string,
+ type: string,
+ content: Array<any>,
+ info: string
+ },
+ details: {
+ name: string,
+ type: string,
+ content: Array<any>,
+ info: string
+ }
+ }
+
+ export default {
+ name: 'workingHours',
+ components:{},
+ setup() {
+ const userInfo = useUserInfo()
+ const {userInfos} = storeToRefs(userInfo);
+
+ const state = reactive<stateType>({
+ pageIndex: 1,
+ pageSize: 10,
+ totalSize: 0,
+ chosenIndex: null,
+ searchWord: '',
+ tableData: [],
+ multipleSelection: [],
+ dialogDetails: false,
+ dialogAddRecord: false,
+ deleteDialog: false,
+ holidayList:[
+ {
+ value: '每周公休假日',
+ label: '每周公休假日'
+ },
+ {
+ value: '每年法定节假日',
+ label: '每年法定节假日'
+ },
+ {
+ value: '自定义休息日',
+ label: '自定义休息日',
+ children: [
+ {
+ value: '每周',
+ label: '每周',
+ },
+ {
+ value: '每月',
+ label: '每月',
+ }
+ ]
+ }
+ ],
+ weekDays: ['周一','周二','周三','周四','周五','周六','周日'],
+ casProps: {
+ expandTrigger: 'hover',
+ },
+ addRecord: {
+ name: '',
+ type: '',
+ content: [],
+ info: ''
+ },
+ details: {
+ name: '',
+ type: '',
+ content: [],
+ info: ''
+ },
+ deleteId: null,
+ deleteArr: []
+ })
+ interface User {
+ name: string,
+ type: string,
+ content: [],
+ info: string
+ }
+
+ const handleChange = (value) => {
+ state.addRecord.content = []
+ console.log(JSON.parse(JSON.stringify(value)))
+ }
+
+ const multipleTableRef = ref<InstanceType<typeof ElTable>>()
+ const toggleSelection = (rows?: User[]) => {
+ if (rows) {
+ rows.forEach((row) => {
+ // TODO: improvement typing when refactor table
+ // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+ // @ts-expect-error
+ multipleTableRef.value!.toggleRowSelection(row, undefined)
+ })
+ } else {
+ multipleTableRef.value!.clearSelection()
+ }
+ }
+
+ // 多选
+ const handleSelectionChange = (val: User[]) => {
+ state.multipleSelection = JSON.parse(JSON.stringify(val))
+ state.deleteArr = state.multipleSelection.map((item)=>{
+ item = item.id
+ return item
+ })
+ }
+
+ const addRef = ref<FormInstance>()
+ const addRules = reactive<FormRules>({
+ name: [{required: true, message: '该内容不能为空', trigger: 'blur'}],
+ type: [{required: true, message: '该内容不能为空', trigger: 'blur'}],
+ content: [{required: true, message: '该内容不能为空', trigger: 'blur'}]
+ })
+
+ // 页面载入时执行方法
+ onMounted(() => {
+ // getWorkTimePeriod()
+ getListByPage()
+ })
+
+ // 获取工作时段列表
+ const getWorkTimePeriod = async () => {
+ let res = await workingHoursApi().getWorkTimePeriod({name: state.searchWord});
+ if (res.data.code === '200') {
+ state.tableData = res.data.data.map((item)=>{
+ item.startHour = item.startHour==null?'00':(item.startHour.toString()[1]?item.startHour.toString():'0'+item.startHour.toString())
+ item.startMin = item.startMin==null?'00':(item.startMin.toString()[1]?item.startMin.toString():'0'+item.startMin.toString())
+ item.endHour = item.endHour==null?'00':(item.endHour.toString()[1]?item.endHour.toString():'0'+item.endHour.toString())
+ item.endMin = item.endMin==null?'00':(item.endMin.toString()[1]?item.endMin.toString():'0'+item.endMin.toString())
+ item.startTime = item.startHour + ':' + item.startMin
+ item.endTime = item.endHour + ':' + item.endMin
+ return item
+ })
+ } else {
+ ElMessage({
+ type: 'warning',
+ message: res.data.msg
+ });
+ }
+ }
+
+ // 分页获取工作时段列表
+ const getListByPage = async ()=>{
+ const data = {pageSize: state.pageSize,pageIndex: state.pageIndex,searchParams:{name: state.searchWord}}
+ let res = await workingHoursApi().postPeriodPage(data);
+ if (res.data.code === '200') {
+ state.tableData = res.data.data.map((item)=>{
+ item.startHour = item.startHour==null?'00':(item.startHour.toString()[1]?item.startHour.toString():'0'+item.startHour.toString())
+ item.startMin = item.startMin==null?'00':(item.startMin.toString()[1]?item.startMin.toString():'0'+item.startMin.toString())
+ item.endHour = item.endHour==null?'00':(item.endHour.toString()[1]?item.endHour.toString():'0'+item.endHour.toString())
+ item.endMin = item.endMin==null?'00':(item.endMin.toString()[1]?item.endMin.toString():'0'+item.endMin.toString())
+ item.startTime = item.startHour + ':' + item.startMin
+ item.endTime = item.endHour + ':' + item.endMin
+ return item
+ })
+ state.totalSize = res.data.total
+ } else {
+ ElMessage({
+ type: 'warning',
+ message: res.data.msg
+ });
+ }
+ }
+
+ // 关键词查询记录
+ const searchRecord = async()=>{
+ if(state.searchWord==''){
+ ElMessage({
+ type: 'warning',
+ message: '请输入查询关键词'
+ });
+ }else{
+ getListByPage()
+ }
+ }
+
+ const clearSearch = async()=>{
+ state.searchWord=''
+ getListByPage()
+ }
+
+ // 添加工作时段
+ const addWorkTimePeriod = async (data:any) => {
+ let res = await workingHoursApi().postWorkTimePeriod(data);
+ if (res.data.code === '200') {
+ ElMessage({
+ type: 'success',
+ message: res.data.msg
+ });
+ getListByPage()
+ } else {
+ ElMessage({
+ type: 'warning',
+ message: res.data.msg
+ });
+ }
+ };
+
+ // 修改工作时段
+ const editWorkTimePeriod = async (data:any) => {
+ let res = await workingHoursApi().updateWorkTimePeriod(data);
+ if (res.data.code === '200') {
+ ElMessage({
+ type: 'success',
+ message: res.data.msg
+ });
+ getListByPage()
+ } else {
+ ElMessage({
+ type: 'warning',
+ message: res.data.msg
+ });
+ }
+ }
+
+ // 删除工作时段
+ const deleteWorkTimePeriod = async (data:any) => {
+ let res = await workingHoursApi().deletWorkTimePeriod(data);
+ if (res.data.code === '200') {
+ ElMessage({
+ type: 'success',
+ message: res.data.msg
+ });
+ getListByPage()
+ } else {
+ ElMessage({
+ type: 'warning',
+ message: res.data.msg
+ });
+ }
+ }
+
+ const deleteRecord = (row) => {
+ state.deleteId = row.id
+ state.deleteDialog = true
+ }
+
+ const conFirmDelete = () => {
+ deleteWorkTimePeriod({ id: state.deleteId })
+ state.deleteDialog = false
+ }
+
+ // 批量删除
+ const deleteWorkTimePeriods = async () => {
+ if(state.deleteArr.length>0){
+ console.log(state.deleteArr)
+ let res = await workingHoursApi().deleteBatchWorkTimePeriod({ids: state.deleteArr});
+ if (res.data.code === '200') {
+ ElMessage({
+ type: 'success',
+ message: res.data.msg
+ });
+ getListByPage()
+ } else {
+ ElMessage({
+ type: 'warning',
+ message: res.data.msg
+ });
+ }
+ }else{
+ ElMessage({
+ type: 'warning',
+ message: '请先选择要删除的记录'
+ });
+ }
+ }
+
+ const handleSizeChange = (val: number) => {
+ state.pageSize = val
+ getListByPage()
+ }
+ const handleCurrentChange = (val: number) => {
+ state.pageIndex = val
+ getListByPage()
+ }
+
+ // 查看记录
+ const viewRecord = (row) => {
+ state.details = row
+ state.dialogDetails = true
+ }
+
+ // 刷新
+ const reLoadData = async () =>{
+ getListByPage()
+ }
+ const editRecord = (index, row) => {
+ state.dialogAddRecord = true
+ state.chosenIndex = index
+ state.addRecord = JSON.parse(JSON.stringify(row))
+ }
+
+ // 新增修改记录
+ const confirmAddRecord = async (formEl: FormInstance | undefined) => {
+ if (!formEl) return
+ await formEl.validate(async (valid, fields) => {
+ if (valid) {
+ const data = {
+ name: state.addRecord.name,
+ info: state.addRecord.info,
+ startHour: Number(state.addRecord.startTime.substring(0, 2)),
+ startMin: Number(state.addRecord.startTime.substring(3)),
+ endHour: Number(state.addRecord.endTime.substring(0, 2)),
+ endMin: Number(state.addRecord.endTime.substring(3))
+ }
+ if (state.chosenIndex == null) {
+ // if (state.addRecord.startTime >= state.addRecord.endTime) {
+ // state.addRecord.endTime = '次日' + state.addRecord.endTime
+ // }
+ // state.tableData.unshift(data)
+ await addWorkTimePeriod(data)
+ } else {
+ // if (state.addRecord.startTime >= state.addRecord.endTime) {
+ // state.addRecord.endTime = '次日' + state.addRecord.endTime
+ // }
+ // state.tableData[state.chosenIndex] = state.addRecord
+ data.id = state.addRecord.id,
+ await editWorkTimePeriod(data)
+ }
+ state.dialogAddRecord = false
+ } else {
+ console.log('error submit!', fields)
+ }
+ })
+
+ }
+ const closeAdd = () => {
+ state.addRecord = {}
+ state.chosenIndex = null
+ }
+ const openAdd = () => {
+ if (state.chosenIndex == null) {
+ state.addRecord.info = ''
+ }
+ }
+ const indexClear = () => {
+ state.deleteId = null
+ }
+
+ // 折线图
+ const renderMenu = async (value: string) => {
+ Session.set('projectId', value)
+ userInfos.value.projectId = value
+ await initBackEndControlRoutes();
+ };
+ return {
+ addRef,
+ addRules,
+ View,
+ Edit,
+ Delete,
+ Refresh,
+ Plus,
+ toggleSelection,
+ handleSelectionChange,
+ deleteWorkTimePeriods,
+ searchRecord,
+ clearSearch,
+ viewRecord,
+ deleteRecord,
+ conFirmDelete,
+ getWorkTimePeriod,
+ getListByPage,
+ reLoadData,
+ deleteWorkTimePeriod,
+ handleSizeChange,
+ handleCurrentChange,
+ confirmAddRecord,
+ closeAdd,
+ openAdd,
+ indexClear,
+ editRecord,
+ ...toRefs(state)
+ };
+ }
+ }
+</script>
+
+<style scoped lang="scss">
+ $homeNavLengh: 8;
+ .home-container {
+ height: calc(100vh - 114px);
+ box-sizing: border-box;
+ overflow: hidden;
+ .homeCard{
+ width: 100%;
+ padding: 20px;
+ box-sizing: border-box;
+ background: #fff;
+ border-radius: 4px;
+
+ .main-card{
+ width: 100%;
+ height: 100%;
+ .cardTop{
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ margin-bottom: 20px;
+ .mainCardBtn{
+ margin: 0;
+ }
+ }
+ .pageBtn{
+ height: 60px;
+ display: flex;
+ align-items: center;
+ justify-content: right;
+
+ .demo-pagination-block + .demo-pagination-block {
+ margin-top: 10px;
+ }
+ .demo-pagination-block .demonstration {
+ margin-bottom: 16px;
+ }
+ }
+ }
+ &:last-of-type{
+ height: calc(100% - 100px);
+ }
+ }
+ .el-row{
+ display: flex;
+ align-items: center;
+ margin-bottom: 20px;
+ &:last-child {
+ margin-bottom: 0;
+ }
+ .grid-content{
+ align-items: center;
+ min-height: 36px;
+ }
+
+ .topInfo {
+ display: flex;
+ align-items: center;
+ font-size: 16px;
+ font-weight: bold;
+
+ &>div{
+ white-space: nowrap;
+ margin-right: 20px;
+ }
+ }
+ }
+ }
+ .el-input{
+ width: 100% !important;
+ }
+ .el-date-editor::v-deep{
+ width: 100%;
+ }
+ .el-select{
+ width: 100%;
+ }
+</style>
diff --git a/src/views/basicRightsManagement/personnelShiftManagement/holidayTimeSet/index.vue b/src/views/basicRightsManagement/personnelShiftManagement/holidayTimeSet/index.vue
new file mode 100644
index 0000000..a3531bc
--- /dev/null
+++ b/src/views/basicRightsManagement/personnelShiftManagement/holidayTimeSet/index.vue
@@ -0,0 +1,567 @@
+<template>
+ <div class="home-container">
+ <div style="height: 100%">
+ <el-row class="homeCard">
+ <el-col :span="8">
+ <div class="grid-content topInfo">
+ <el-input v-model="searchWord" placeholder="休息时间组名称"></el-input>
+ <el-button type="primary" @click="searchRecord">查询</el-button>
+ <el-button plain @click="clearSearch">重置</el-button>
+ </div>
+ </el-col>
+ </el-row>
+ <div class="homeCard">
+ <div class="main-card">
+ <el-row class="cardTop">
+ <el-col :span="12" class="mainCardBtn">
+ <el-button type="primary" :icon="Plus" size="default" @click="dialogAddRecord=true">新建</el-button>
+<!-- <el-button type="warning" :icon="Edit" size="default" plain>修改</el-button>-->
+ <el-button type="danger" :icon="Delete" size="default" plain @click="deleteWorkTimePeriods">删除</el-button>
+ </el-col>
+ <el-button type="primary" :icon="Refresh" size="default" @click="reLoadData()"/>
+ </el-row>
+ <el-table
+ ref="multipleTableRef"
+ :data="tableData"
+ style="width: 100%"
+ height="calc(100% - 100px)"
+ :header-cell-style="{background: '#fafafa'}"
+ @selection-change="handleSelectionChange"
+ >
+ <el-table-column type="selection" width="100" />
+ <el-table-column property="name" label="休息时间组名称"/>
+ <el-table-column property="content" label="关联休息时间"/>
+ <el-table-column property="info" label="描述信息"/>
+ <el-table-column fixed="right" label="操作" align="center" width="250">
+ <template #default="scope">
+ <el-button link type="primary" size="small" :icon="View" @click="viewRecord(scope.row)">查看</el-button>
+ <el-button link type="primary" size="small" :icon="Edit" @click="editRecord(scope.$index ,scope.row)">修改</el-button>
+ <el-button link type="danger" size="small" :icon="Delete" @click="deleteRecord(scope.row)">删除</el-button>
+ </template>
+ </el-table-column>
+ </el-table>
+ <div class="pageBtn">
+ <el-pagination
+ v-model:currentPage="pageIndex"
+ v-model:page-size="pageSize"
+ :page-sizes="[10, 15]"
+ small=false
+ background
+ layout="total, sizes, prev, pager, next, jumper"
+ :total="totalSize"
+ @size-change="handleSizeChange"
+ @current-change="handleCurrentChange"
+ />
+ </div>
+ </div>
+ </div>
+ </div>
+ <el-dialog v-model="dialogDetails" title="休息时间组">
+ <el-form :model="details" label-width="120px">
+ <el-form-item label="时间组名称">
+ <el-input
+ v-model="details.name"
+ readonly
+ />
+ </el-form-item>
+ <el-form-item label="关联休息时间" v-if="details.content.length>0">
+ <el-input
+ v-model="details.content"
+ readonly
+ />
+ </el-form-item>
+ <el-form-item label="描述信息" v-if="details.info">
+ <el-input
+ v-model="details.info"
+ type="textarea"
+ readonly
+ />
+ </el-form-item>
+ <el-form-item>
+ <el-button type="primary" @click="dialogDetails = false" size="default">确认</el-button>
+ </el-form-item>
+ </el-form>
+ </el-dialog>
+ <el-dialog v-model="dialogAddRecord" title="休息时间组编辑" @close="closeAdd" @open="openAdd">
+ <el-form :model="addRecord" label-width="120px" ref="addRef" :rules="addRules">
+ <el-form-item label="时间组名称" prop="name">
+ <el-input
+ v-model="addRecord.name"
+ >
+ </el-input>
+ </el-form-item>
+ <el-form-item label="关联休息时间" prop="content">
+ <el-select v-model="addRecord.content">
+ <el-option label="周末休息" value="周末休息" />
+ <el-option label="节假日休息" value="节假日休息" />
+ </el-select>
+ </el-form-item>
+ <el-form-item label="描述信息" prop="info">
+ <el-input
+ v-model="addRecord.info"
+ type="textarea"
+ >
+ </el-input>
+ </el-form-item>
+ <el-form-item>
+ <el-button type="warning" @click="dialogAddRecord = false" size="default" plain>取消</el-button>
+ <el-button type="primary" @click="confirmAddRecord(addRef)" size="default">确认</el-button>
+ </el-form-item>
+ </el-form>
+ </el-dialog>
+ <el-dialog v-model="deleteDialog" title="提示" width="30%" center @close="indexClear">
+ <span>您确定要删除该条记录吗?</span>
+ <template #footer>
+ <span class="dialog-footer">
+ <el-button @click="deleteDialog = false" size="default">取消</el-button>
+ <el-button type="primary" @click="conFirmDelete" size="default">确认</el-button>
+ </span>
+ </template>
+ </el-dialog>
+ </div>
+</template>
+
+<script lang="ts">
+ import { toRefs, reactive, ref, onMounted } from 'vue';
+ import { storeToRefs } from 'pinia';
+ import { initBackEndControlRoutes } from '/@/router/backEnd';
+ import {useUserInfo} from "/@/stores/userInfo";
+ import { Session } from '/@/utils/storage';
+ import { Edit, View, Plus, Delete, Refresh, Search, Download } from '@element-plus/icons-vue'
+ import { ElTable } from 'element-plus'
+ import { FormInstance, FormRules, ElMessage } from 'element-plus'
+ import { workingHoursApi } from '/@/api/basicDateManage/personShiftManage/workingHours';
+
+
+
+ // 定义接口来定义对象的类型
+ interface stateType {
+ tableData: Array<string>,
+ multipleSelection: Array<any>,
+ deleteArr: Array<any>,
+ dialogDetails: boolean,
+ dialogAddRecord: boolean,
+ deleteDialog: boolean,
+ pageIndex: number,
+ pageSize: number,
+ searchWord: string,
+ totalSize: number,
+ addRecord: {
+ name: string,
+ content: Array<any>,
+ info: string
+ },
+ details: {
+ name: string,
+ content: Array<any>,
+ info: string
+ }
+ }
+
+ export default {
+ name: 'workingHours',
+ components:{},
+ setup() {
+ const userInfo = useUserInfo()
+ const {userInfos} = storeToRefs(userInfo);
+
+ const state = reactive<stateType>({
+ pageIndex: 1,
+ pageSize: 10,
+ totalSize: 0,
+ chosenIndex: null,
+ searchWord: '',
+ tableData: [],
+ multipleSelection: [],
+ dialogDetails: false,
+ dialogAddRecord: false,
+ deleteDialog: false,
+ addRecord: {
+ name: '',
+ content: [],
+ info: ''
+ },
+ details: {
+ name: '',
+ content: [],
+ info: ''
+ },
+ deleteId: null,
+ deleteArr: []
+ })
+ interface User {
+ name: string,
+ content: [],
+ info: string
+ }
+ const multipleTableRef = ref<InstanceType<typeof ElTable>>()
+ const toggleSelection = (rows?: User[]) => {
+ if (rows) {
+ rows.forEach((row) => {
+ // TODO: improvement typing when refactor table
+ // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+ // @ts-expect-error
+ multipleTableRef.value!.toggleRowSelection(row, undefined)
+ })
+ } else {
+ multipleTableRef.value!.clearSelection()
+ }
+ }
+
+ // 多选
+ const handleSelectionChange = (val: User[]) => {
+ state.multipleSelection = JSON.parse(JSON.stringify(val))
+ state.deleteArr = state.multipleSelection.map((item)=>{
+ item = item.id
+ return item
+ })
+ }
+
+ const addRef = ref<FormInstance>()
+ const addRules = reactive<FormRules>({
+ name: [{required: true, message: '该内容不能为空', trigger: 'blur'}],
+ content: [{required: true, message: '该内容不能为空', trigger: 'blur'}]
+ })
+
+ // 页面载入时执行方法
+ onMounted(() => {
+ // getWorkTimePeriod()
+ getListByPage()
+ })
+
+ // 获取工作时段列表
+ const getWorkTimePeriod = async () => {
+ let res = await workingHoursApi().getWorkTimePeriod({name: state.searchWord});
+ if (res.data.code === '200') {
+ state.tableData = res.data.data.map((item)=>{
+ item.startHour = item.startHour==null?'00':(item.startHour.toString()[1]?item.startHour.toString():'0'+item.startHour.toString())
+ item.startMin = item.startMin==null?'00':(item.startMin.toString()[1]?item.startMin.toString():'0'+item.startMin.toString())
+ item.endHour = item.endHour==null?'00':(item.endHour.toString()[1]?item.endHour.toString():'0'+item.endHour.toString())
+ item.endMin = item.endMin==null?'00':(item.endMin.toString()[1]?item.endMin.toString():'0'+item.endMin.toString())
+ item.startTime = item.startHour + ':' + item.startMin
+ item.endTime = item.endHour + ':' + item.endMin
+ return item
+ })
+ } else {
+ ElMessage({
+ type: 'warning',
+ message: res.data.msg
+ });
+ }
+ }
+
+ // 分页获取工作时段列表
+ const getListByPage = async ()=>{
+ const data = {pageSize: state.pageSize,pageIndex: state.pageIndex,searchParams:{name: state.searchWord}}
+ let res = await workingHoursApi().postPeriodPage(data);
+ if (res.data.code === '200') {
+ state.tableData = res.data.data.map((item)=>{
+ item.startHour = item.startHour==null?'00':(item.startHour.toString()[1]?item.startHour.toString():'0'+item.startHour.toString())
+ item.startMin = item.startMin==null?'00':(item.startMin.toString()[1]?item.startMin.toString():'0'+item.startMin.toString())
+ item.endHour = item.endHour==null?'00':(item.endHour.toString()[1]?item.endHour.toString():'0'+item.endHour.toString())
+ item.endMin = item.endMin==null?'00':(item.endMin.toString()[1]?item.endMin.toString():'0'+item.endMin.toString())
+ item.startTime = item.startHour + ':' + item.startMin
+ item.endTime = item.endHour + ':' + item.endMin
+ return item
+ })
+ state.totalSize = res.data.total
+ } else {
+ ElMessage({
+ type: 'warning',
+ message: res.data.msg
+ });
+ }
+ }
+
+ // 关键词查询记录
+ const searchRecord = async()=>{
+ if(state.searchWord==''){
+ ElMessage({
+ type: 'warning',
+ message: '请输入查询关键词'
+ });
+ }else{
+ getListByPage()
+ }
+ }
+
+ const clearSearch = async()=>{
+ state.searchWord=''
+ getListByPage()
+ }
+
+ // 添加工作时段
+ const addWorkTimePeriod = async (data:any) => {
+ let res = await workingHoursApi().postWorkTimePeriod(data);
+ if (res.data.code === '200') {
+ ElMessage({
+ type: 'success',
+ message: res.data.msg
+ });
+ getListByPage()
+ } else {
+ ElMessage({
+ type: 'warning',
+ message: res.data.msg
+ });
+ }
+ };
+
+ // 修改工作时段
+ const editWorkTimePeriod = async (data:any) => {
+ let res = await workingHoursApi().updateWorkTimePeriod(data);
+ if (res.data.code === '200') {
+ ElMessage({
+ type: 'success',
+ message: res.data.msg
+ });
+ getListByPage()
+ } else {
+ ElMessage({
+ type: 'warning',
+ message: res.data.msg
+ });
+ }
+ }
+
+ // 删除工作时段
+ const deleteWorkTimePeriod = async (data:any) => {
+ let res = await workingHoursApi().deletWorkTimePeriod(data);
+ if (res.data.code === '200') {
+ ElMessage({
+ type: 'success',
+ message: res.data.msg
+ });
+ getListByPage()
+ } else {
+ ElMessage({
+ type: 'warning',
+ message: res.data.msg
+ });
+ }
+ }
+
+ const deleteRecord = (row) => {
+ state.deleteId = row.id
+ state.deleteDialog = true
+ }
+
+ const conFirmDelete = () => {
+ deleteWorkTimePeriod({ id: state.deleteId })
+ state.deleteDialog = false
+ }
+
+ // 批量删除
+ const deleteWorkTimePeriods = async () => {
+ if(state.deleteArr.length>0){
+ console.log(state.deleteArr)
+ let res = await workingHoursApi().deleteBatchWorkTimePeriod({ids: state.deleteArr});
+ if (res.data.code === '200') {
+ ElMessage({
+ type: 'success',
+ message: res.data.msg
+ });
+ getListByPage()
+ } else {
+ ElMessage({
+ type: 'warning',
+ message: res.data.msg
+ });
+ }
+ }else{
+ ElMessage({
+ type: 'warning',
+ message: '请先选择要删除的记录'
+ });
+ }
+ }
+
+ const handleSizeChange = (val: number) => {
+ state.pageSize = val
+ getListByPage()
+ }
+ const handleCurrentChange = (val: number) => {
+ state.pageIndex = val
+ getListByPage()
+ }
+
+ // 查看记录
+ const viewRecord = (row) => {
+ state.details = row
+ state.dialogDetails = true
+ }
+
+ // 刷新
+ const reLoadData = async () =>{
+ getListByPage()
+ }
+ const editRecord = (index, row) => {
+ state.dialogAddRecord = true
+ state.chosenIndex = index
+ state.addRecord = JSON.parse(JSON.stringify(row))
+ }
+
+ // 新增修改记录
+ const confirmAddRecord = async (formEl: FormInstance | undefined) => {
+ if (!formEl) return
+ await formEl.validate(async (valid, fields) => {
+ if (valid) {
+ const data = {
+ name: state.addRecord.name,
+ info: state.addRecord.info,
+ startHour: Number(state.addRecord.startTime.substring(0, 2)),
+ startMin: Number(state.addRecord.startTime.substring(3)),
+ endHour: Number(state.addRecord.endTime.substring(0, 2)),
+ endMin: Number(state.addRecord.endTime.substring(3))
+ }
+ if (state.chosenIndex == null) {
+ // if (state.addRecord.startTime >= state.addRecord.endTime) {
+ // state.addRecord.endTime = '次日' + state.addRecord.endTime
+ // }
+ // state.tableData.unshift(data)
+ await addWorkTimePeriod(data)
+ } else {
+ // if (state.addRecord.startTime >= state.addRecord.endTime) {
+ // state.addRecord.endTime = '次日' + state.addRecord.endTime
+ // }
+ // state.tableData[state.chosenIndex] = state.addRecord
+ data.id = state.addRecord.id,
+ await editWorkTimePeriod(data)
+ }
+ state.dialogAddRecord = false
+ } else {
+ console.log('error submit!', fields)
+ }
+ })
+
+ }
+ const closeAdd = () => {
+ state.addRecord = {}
+ state.chosenIndex = null
+ }
+ const openAdd = () => {
+ if (state.chosenIndex == null) {
+ state.addRecord.info = ''
+ }
+ }
+ const indexClear = () => {
+ state.deleteId = null
+ }
+
+ // 折线图
+ const renderMenu = async (value: string) => {
+ Session.set('projectId', value)
+ userInfos.value.projectId = value
+ await initBackEndControlRoutes();
+ };
+ return {
+ addRef,
+ addRules,
+ View,
+ Edit,
+ Delete,
+ Refresh,
+ Plus,
+ toggleSelection,
+ handleSelectionChange,
+ deleteWorkTimePeriods,
+ searchRecord,
+ clearSearch,
+ viewRecord,
+ deleteRecord,
+ conFirmDelete,
+ getWorkTimePeriod,
+ getListByPage,
+ reLoadData,
+ deleteWorkTimePeriod,
+ handleSizeChange,
+ handleCurrentChange,
+ confirmAddRecord,
+ closeAdd,
+ openAdd,
+ indexClear,
+ editRecord,
+ ...toRefs(state)
+ };
+ }
+ }
+</script>
+
+<style scoped lang="scss">
+ $homeNavLengh: 8;
+ .home-container {
+ height: calc(100vh - 114px);
+ box-sizing: border-box;
+ overflow: hidden;
+ .homeCard{
+ width: 100%;
+ padding: 20px;
+ box-sizing: border-box;
+ background: #fff;
+ border-radius: 4px;
+
+ .main-card{
+ width: 100%;
+ height: 100%;
+ .cardTop{
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ margin-bottom: 20px;
+ .mainCardBtn{
+ margin: 0;
+ }
+ }
+ .pageBtn{
+ height: 60px;
+ display: flex;
+ align-items: center;
+ justify-content: right;
+
+ .demo-pagination-block + .demo-pagination-block {
+ margin-top: 10px;
+ }
+ .demo-pagination-block .demonstration {
+ margin-bottom: 16px;
+ }
+ }
+ }
+ &:last-of-type{
+ height: calc(100% - 100px);
+ }
+ }
+ .el-row{
+ display: flex;
+ align-items: center;
+ margin-bottom: 20px;
+ &:last-child {
+ margin-bottom: 0;
+ }
+ .grid-content{
+ align-items: center;
+ min-height: 36px;
+ }
+
+ .topInfo {
+ display: flex;
+ align-items: center;
+ font-size: 16px;
+ font-weight: bold;
+
+ &>div{
+ white-space: nowrap;
+ margin-right: 20px;
+ }
+ }
+ }
+ }
+ .el-input{
+ width: 100% !important;
+ }
+ .el-date-editor::v-deep{
+ width: 100%;
+ }
+ .el-select{
+ width: 100%;
+ }
+</style>
diff --git a/src/views/basicRightsManagement/personnelShiftManagement/personnelManagement/index.vue b/src/views/basicRightsManagement/personnelShiftManagement/personnelManagement/index.vue
index 6274717..9ed7d58 100644
--- a/src/views/basicRightsManagement/personnelShiftManagement/personnelManagement/index.vue
+++ b/src/views/basicRightsManagement/personnelShiftManagement/personnelManagement/index.vue
@@ -1,6 +1,6 @@
<template>
<div class="home-container">
- <el-scrollbar height="100%">
+ <div style="height: 100%">
<el-row class="homeCard">
<el-col :span="8">
<div class="grid-content topInfo">
@@ -24,6 +24,7 @@
ref="multipleTableRef"
:data="tableData"
style="width: 100%"
+ height="calc(100% - 100px)"
:header-cell-style="{background: '#fafafa'}"
@selection-change="handleSelectionChange"
>
@@ -42,22 +43,22 @@
</template>
</el-table-column>
</el-table>
- </div>
- <div class="pageBtn">
- <el-pagination
- v-model:currentPage="currentPage"
- v-model:page-size="pageSize"
- :page-sizes="[10, 15]"
- small=false
- background
- layout="total, sizes, prev, pager, next, jumper"
- :total="100"
- @size-change="handleSizeChange"
- @current-change="handleCurrentChange"
- />
+ <div class="pageBtn">
+ <el-pagination
+ v-model:currentPage="currentPage"
+ v-model:page-size="pageSize"
+ :page-sizes="[10, 15]"
+ small=false
+ background
+ layout="total, sizes, prev, pager, next, jumper"
+ :total="100"
+ @size-change="handleSizeChange"
+ @current-change="handleCurrentChange"
+ />
+ </div>
</div>
</div>
- </el-scrollbar>
+ </div>
<el-dialog v-model="dialogDetails" title="人员排班">
<el-form :model="details" label-width="120px">
<el-form-item label="排班名称">
@@ -164,148 +165,152 @@
interface type {
}
- // export default defineComponent({
- // name: 'workCheckinRecord',
- // setup() {
- const userInfo = useUserInfo()
- const { userInfos } = storeToRefs(userInfo);
- const state = reactive<stateType>({});
- const currentPage = ref(1)
- const pageSize = ref(10)
- const chosenIndex = ref(-1)
- const casProps = {
- expandTrigger: 'hover',
- multiple: true,
- emitPath: false,
- checkStrictly: false
+ const userInfo = useUserInfo()
+ const { userInfos } = storeToRefs(userInfo);
+ const state = reactive<stateType>({});
+ const currentPage = ref(1)
+ const pageSize = ref(10)
+ const chosenIndex = ref(-1)
+ const casProps = {
+ expandTrigger: 'hover',
+ multiple: true,
+ emitPath: false,
+ checkStrictly: false
+ }
+ const handleSizeChange = (val: number) => {
+ console.log(`${val} items per page`)
+ }
+ const handleCurrentChange = (val: number) => {
+ console.log(`current page: ${val}`)
+ }
+ const tableData = reactive(
+ [
+ {
+ schedName: 'A车间三班三倒',
+ schedPlan: '三班三倒',
+ restType: ['每周公休假日'],
+ team: 'A车间班组',
+ startTime: '2022-07-14',
+ endTime: '2022-07-16'
+ },
+ {
+ schedName: 'B车间常白班',
+ schedPlan: '常白班',
+ restType: ['自定义休息日/每周'],
+ team: 'B车间班组',
+ startTime: '2022-07-16',
+ endTime: '2022-07-20'
+ },
+ ]
+ )
+ const addRef = ref<FormInstance>()
+ const addRules = reactive<FormRules>({
+ schedName:[{required: true, message: '该内容不能为空',trigger:'blur'}],
+ schedPlan:[{required: true, message: '该内容不能为空',trigger:'blur'}],
+ restType:[{required: true, message: '该内容不能为空',trigger:'blur'}],
+ team:[{required: true, message: '该内容不能为空',trigger:'blur'}],
+ timeRange:[{required: true, message: '该内容不能为空',trigger:'blur'}]
+ })
+ const dialogDetails = ref(false)
+ const dialogAddRecord = ref(false)
+ const deleteDialog = ref(false)
+ const addRecord = ref({})
+ const details = ref({})
+ const viewRecord = (row) =>{
+ details.value = JSON.parse(JSON.stringify(row))
+ dialogDetails.value = true
+ }
+ const deleteRecord = (index) =>{
+ chosenIndex.value = index
+ deleteDialog.value = true
+ }
+ const conFirmDelete = ()=> {
+ tableData.splice(chosenIndex.value,1)
+ deleteDialog.value = false
+ }
+ const confirmAddRecord = async (formEl: FormInstance | undefined) =>{
+ if (!formEl) return
+ await formEl.validate((valid, fields) => {
+ if (valid) {
+ if(chosenIndex.value == -1){
+ addRecord.value.startTime = JSON.parse(JSON.stringify(addRecord.value.timeRange))[0]
+ addRecord.value.endTime = JSON.parse(JSON.stringify(addRecord.value.timeRange))[1]
+ tableData.unshift(addRecord.value)
+ }else{
+ addRecord.value.startTime = JSON.parse(JSON.stringify(addRecord.value.timeRange))[0]
+ addRecord.value.endTimeTime = JSON.parse(JSON.stringify(addRecord.value.timeRange))[1]
+ tableData[chosenIndex.value] = addRecord.value
+ }
+ dialogAddRecord.value =false
+ } else {
+ console.log('error submit!', fields)
}
- const handleSizeChange = (val: number) => {
- console.log(`${val} items per page`)
- }
- const handleCurrentChange = (val: number) => {
- console.log(`current page: ${val}`)
- }
- const tableData = reactive(
- [
- {
- schedName: 'A车间三班三倒',
- schedPlan: '三班三倒',
- restType: ['每周公休假日'],
- team: 'A车间班组',
- startTime: '2022-07-14',
- endTime: '2022-07-16'
- },
- {
- schedName: 'B车间常白班',
- schedPlan: '常白班',
- restType: ['自定义休息日/每周'],
- team: 'B车间班组',
- startTime: '2022-07-16',
- endTime: '2022-07-20'
- },
- ]
- )
- const addRef = ref<FormInstance>()
- const addRules = reactive<FormRules>({
- schedName:[{required: true, message: '该内容不能为空',trigger:'blur'}],
- schedPlan:[{required: true, message: '该内容不能为空',trigger:'blur'}],
- restType:[{required: true, message: '该内容不能为空',trigger:'blur'}],
- team:[{required: true, message: '该内容不能为空',trigger:'blur'}],
- timeRange:[{required: true, message: '该内容不能为空',trigger:'blur'}]
- })
- const dialogDetails = ref(false)
- const dialogAddRecord = ref(false)
- const deleteDialog = ref(false)
- const addRecord = ref({})
- const details = ref({})
- const viewRecord = (row) =>{
- details.value = JSON.parse(JSON.stringify(row))
- dialogDetails.value = true
- }
- const deleteRecord = (index) =>{
- chosenIndex.value = index
- deleteDialog.value = true
- }
- const conFirmDelete = ()=> {
- tableData.splice(chosenIndex.value,1)
- deleteDialog.value = false
- }
- const confirmAddRecord = async (formEl: FormInstance | undefined) =>{
- if (!formEl) return
- await formEl.validate((valid, fields) => {
- if (valid) {
- if(chosenIndex.value == -1){
- addRecord.value.startTime = JSON.parse(JSON.stringify(addRecord.value.timeRange))[0]
- addRecord.value.endTime = JSON.parse(JSON.stringify(addRecord.value.timeRange))[1]
- tableData.unshift(addRecord.value)
- }else{
- addRecord.value.startTime = JSON.parse(JSON.stringify(addRecord.value.timeRange))[0]
- addRecord.value.endTimeTime = JSON.parse(JSON.stringify(addRecord.value.timeRange))[1]
- tableData[chosenIndex.value] = addRecord.value
- }
- dialogAddRecord.value =false
- } else {
- console.log('error submit!', fields)
- }
- })
+ })
- }
- const closeAdd =()=>{
- addRecord.value={}
- chosenIndex.value = -1
- }
- const indexClear = ()=>{
- chosenIndex.value = -1
- }
- const editRecord =(index, row)=>{
- dialogAddRecord.value = true
- chosenIndex.value = index
- addRecord.value = JSON.parse(JSON.stringify(row))
- addRecord.value.timeRange= [addRecord.value.startTime,addRecord.value.endTime]
- }
- // 折线图
- const renderMenu = async (value: string) => {
- Session.set('projectId',value)
- userInfos.value.projectId = value
- await initBackEndControlRoutes();
- };
- // return {
- // renderMenu,
- // multipleTableRef,
- // tableData,
- // currentPage,
- // pageSize,
- // dialogDetails,
- // details,
- // deleteDialog,
- // dialogAddRecord,
- // viewRecord,
- // deleteRecord,
- // handleSizeChange,
- // handleCurrentChange,
- // Plus,
- // Edit,
- // Delete,
- // Search,
- // Download,
- // handleSelectionChange,
- // Refresh,
- // ...toRefs(state),
- // };
- // },
- // });
+ }
+ const closeAdd =()=>{
+ addRecord.value={}
+ chosenIndex.value = -1
+ }
+ const indexClear = ()=>{
+ chosenIndex.value = -1
+ }
+ const editRecord =(index, row)=>{
+ dialogAddRecord.value = true
+ chosenIndex.value = index
+ addRecord.value = JSON.parse(JSON.stringify(row))
+ addRecord.value.timeRange= [addRecord.value.startTime,addRecord.value.endTime]
+ }
+ // 折线图
+ const renderMenu = async (value: string) => {
+ Session.set('projectId',value)
+ userInfos.value.projectId = value
+ await initBackEndControlRoutes();
+ };
</script>
<style scoped lang="scss">
$homeNavLengh: 8;
.home-container {
- height: 100%;
+ height: calc(100vh - 114px);
+ box-sizing: border-box;
overflow: hidden;
.homeCard{
width: 100%;
padding: 20px;
+ box-sizing: border-box;
background: #fff;
border-radius: 4px;
+
+ .main-card{
+ width: 100%;
+ height: 100%;
+ .cardTop{
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ margin-bottom: 20px;
+ .mainCardBtn{
+ margin: 0;
+ }
+ }
+ .pageBtn{
+ height: 60px;
+ display: flex;
+ align-items: center;
+ justify-content: right;
+
+ .demo-pagination-block + .demo-pagination-block {
+ margin-top: 10px;
+ }
+ .demo-pagination-block .demonstration {
+ margin-bottom: 16px;
+ }
+ }
+ }
+ &:last-of-type{
+ height: calc(100% - 100px);
+ }
}
.el-row{
display: flex;
@@ -329,37 +334,6 @@
white-space: nowrap;
margin-right: 20px;
}
- }
- }
- .mainPages{
- height: 100%;
- display: flex;
- flex-direction: column;
- justify-content: space-between;
- }
- .main-card{
- width: 100%;
- .cardTop{
- display: flex;
- align-items: center;
- justify-content: space-between;
- margin-bottom: 20px;
- .mainCardBtn{
- margin: 0;
- }
- }
- }
- .pageBtn{
- display: flex;
- align-items: center;
- justify-content: right;
- margin-top: 20px;
-
- .demo-pagination-block + .demo-pagination-block {
- margin-top: 10px;
- }
- .demo-pagination-block .demonstration {
- margin-bottom: 16px;
}
}
}
diff --git a/src/views/basicRightsManagement/personnelShiftManagement/shiftManagement/index.vue b/src/views/basicRightsManagement/personnelShiftManagement/shiftManagement/index.vue
index 97994c2..4d5b471 100644
--- a/src/views/basicRightsManagement/personnelShiftManagement/shiftManagement/index.vue
+++ b/src/views/basicRightsManagement/personnelShiftManagement/shiftManagement/index.vue
@@ -1,6 +1,6 @@
<template>
<div class="home-container">
- <el-scrollbar height="100%">
+ <div style="height: 100%">
<el-row class="homeCard">
<el-col :span="8">
<div class="grid-content topInfo">
@@ -24,6 +24,7 @@
ref="multipleTableRef"
:data="tableData"
style="width: 100%"
+ height="calc(100% - 100px)"
:header-cell-style="{background: '#fafafa'}"
@selection-change="handleSelectionChange"
>
@@ -38,22 +39,22 @@
</template>
</el-table-column>
</el-table>
- </div>
- <div class="pageBtn">
- <el-pagination
- v-model:currentPage="currentPage"
- v-model:page-size="pageSize"
- :page-sizes="[10, 15]"
- small=false
- background
- layout="total, sizes, prev, pager, next, jumper"
- :total="100"
- @size-change="handleSizeChange"
- @current-change="handleCurrentChange"
- />
+ <div class="pageBtn">
+ <el-pagination
+ v-model:currentPage="currentPage"
+ v-model:page-size="pageSize"
+ :page-sizes="[10, 15]"
+ small=false
+ background
+ layout="total, sizes, prev, pager, next, jumper"
+ :total="100"
+ @size-change="handleSizeChange"
+ @current-change="handleCurrentChange"
+ />
+ </div>
</div>
</div>
- </el-scrollbar>
+ </div>
<el-dialog v-model="dialogDetails" title="排班方案">
<el-form :model="details" label-width="120px">
<el-form-item label="名称">
@@ -230,223 +231,227 @@
interface type {
}
- // export default defineComponent({
- // name: 'workCheckinRecord',
- // setup() {
- const userInfo = useUserInfo()
- const { userInfos } = storeToRefs(userInfo);
- const state = reactive<stateType>({});
- const currentPage = ref(1)
- const pageSize = ref(10)
- const chosenIndex = ref(-1)
- const chosenShiftIndex = ref(-1)
- const handleSizeChange = (val: number) => {
- console.log(`${val} items per page`)
- }
- const handleCurrentChange = (val: number) => {
- console.log(`current page: ${val}`)
- }
- const casProps = {
- expandTrigger: 'hover',
- }
- const tableData = reactive(
- [
+ const userInfo = useUserInfo()
+ const { userInfos } = storeToRefs(userInfo);
+ const state = reactive<stateType>({});
+ const currentPage = ref(1)
+ const pageSize = ref(10)
+ const chosenIndex = ref(-1)
+ const chosenShiftIndex = ref(-1)
+ const handleSizeChange = (val: number) => {
+ console.log(`${val} items per page`)
+ }
+ const handleCurrentChange = (val: number) => {
+ console.log(`current page: ${val}`)
+ }
+ const casProps = {
+ expandTrigger: 'hover',
+ }
+ const tableData = reactive(
+ [
+ {
+ name: '三班三倒',
+ type: '循环班',
+ shiftSteps:[
{
- name: '三班三倒',
- type: '循环班',
- shiftSteps:[
- {
- name: '第一班',
- days: '5',
- rest: '1',
- timeRange: '三班三倒早班'
- },
- {
- name: '第二班',
- days: '5',
- rest: '2',
- timeRange: '三班三倒中班'
- },
- {
- name: '第三班',
- days: '5',
- rest: '3',
- timeRange: '三班三倒夜班'
- }
- ]
+ name: '第一班',
+ days: '5',
+ rest: '1',
+ timeRange: '三班三倒早班'
},
{
- name: '常白班',
- type: '固定班'
+ name: '第二班',
+ days: '5',
+ rest: '2',
+ timeRange: '三班三倒中班'
+ },
+ {
+ name: '第三班',
+ days: '5',
+ rest: '3',
+ timeRange: '三班三倒夜班'
}
]
- )
- const handleChange = (value) => {
- addRecord.value.content = []
- console.log(JSON.parse(JSON.stringify(value)))
+ },
+ {
+ name: '常白班',
+ type: '固定班'
}
- const addRef = ref<FormInstance>()
- const addShiftRef = ref<FormInstance>()
- const addRules = reactive<FormRules>({
- name:[{required: true, message: '该内容不能为空',trigger:'blur'}],
- type:[{required: true, message: '该内容不能为空',trigger:'blur'}],
- timeRange:[{required: true, message: '该内容不能为空',trigger:'blur'}]
- })
- const addShiftRules = reactive<FormRules>({
- name:[{required: true, message: '该内容不能为空',trigger:'blur'}],
- days:[{required: true, message: '该内容不能为空',trigger:'blur'}],
- rest:[{required: true,message: '该内容不能为空',trigger: 'blur'}],
- timeRange:[{required: true, message: '该内容不能为空',trigger:'blur'}]
- })
- const dialogDetails = ref(false)
- const dialogAddRecord = ref(false)
- const deleteDialog = ref(false)
- const deleteShiftDialog = ref(false)
- const dialogAddShift = ref(false)
- const addRecord = ref({})
- const addShift = ref({})
- const details = ref({})
- const viewRecord = (row) =>{
- details.value = JSON.parse(JSON.stringify(row))
- dialogDetails.value = true
- }
- const deleteRecord = (index) =>{
- chosenIndex.value = index
- deleteDialog.value = true
- }
- const conFirmDelete = ()=> {
- tableData.splice(chosenIndex.value,1)
- deleteDialog.value = false
- }
- const confirmAddRecord = async (formEl: FormInstance | undefined) =>{
- if (!formEl) return
- await formEl.validate((valid, fields) => {
- if (valid) {
- if(chosenIndex.value == -1){
- if(addRecord.value.type == '循环班' && (!addRecord.value.shiftSteps || addRecord.value.shiftSteps.length == 0)){
- ElMessage({
- message: '请先设置自定义排班后再提交',
- type: 'warning',
- })
- return
- }else{
- tableData.unshift(addRecord.value)
- }
- }else{
- if(addRecord.value.type == '循环班' && addRecord.value.shiftSteps.length == 0){
- ElMessage({
- message: '请先设置自定义排班后再提交',
- type: 'warning',
- })
- return
- }else{
- if(addRecord.value.type == '固定班'){delete addRecord.value.shiftSteps}
- console.log(addRecord.value,'addRecord')
- tableData[chosenIndex.value] = addRecord.value
- }
- }
- dialogAddRecord.value =false
- } else {
- console.log('error submit!', fields)
+ ]
+ )
+ const handleChange = (value) => {
+ addRecord.value.content = []
+ console.log(JSON.parse(JSON.stringify(value)))
+ }
+ const addRef = ref<FormInstance>()
+ const addShiftRef = ref<FormInstance>()
+ const addRules = reactive<FormRules>({
+ name:[{required: true, message: '该内容不能为空',trigger:'blur'}],
+ type:[{required: true, message: '该内容不能为空',trigger:'blur'}],
+ timeRange:[{required: true, message: '该内容不能为空',trigger:'blur'}]
+ })
+ const addShiftRules = reactive<FormRules>({
+ name:[{required: true, message: '该内容不能为空',trigger:'blur'}],
+ days:[{required: true, message: '该内容不能为空',trigger:'blur'}],
+ rest:[{required: true,message: '该内容不能为空',trigger: 'blur'}],
+ timeRange:[{required: true, message: '该内容不能为空',trigger:'blur'}]
+ })
+ const dialogDetails = ref(false)
+ const dialogAddRecord = ref(false)
+ const deleteDialog = ref(false)
+ const deleteShiftDialog = ref(false)
+ const dialogAddShift = ref(false)
+ const addRecord = ref({})
+ const addShift = ref({})
+ const details = ref({})
+ const viewRecord = (row) =>{
+ details.value = JSON.parse(JSON.stringify(row))
+ dialogDetails.value = true
+ }
+ const deleteRecord = (index) =>{
+ chosenIndex.value = index
+ deleteDialog.value = true
+ }
+ const conFirmDelete = ()=> {
+ tableData.splice(chosenIndex.value,1)
+ deleteDialog.value = false
+ }
+ const confirmAddRecord = async (formEl: FormInstance | undefined) =>{
+ if (!formEl) return
+ await formEl.validate((valid, fields) => {
+ if (valid) {
+ if(chosenIndex.value == -1){
+ if(addRecord.value.type == '循环班' && (!addRecord.value.shiftSteps || addRecord.value.shiftSteps.length == 0)){
+ ElMessage({
+ message: '请先设置自定义排班后再提交',
+ type: 'warning',
+ })
+ return
+ }else{
+ tableData.unshift(addRecord.value)
}
- })
-
- }
- const closeAdd =()=>{
- addRecord.value={}
- chosenIndex.value = -1
- addShift.value={}
- chosenShiftIndex.value = -1
- }
- const indexClear = ()=>{
- chosenIndex.value = -1
- }
- const indexShiftClear = ()=>{
- chosenShiftIndex.value = -1
- }
- const editRecord =(index, row)=>{
- dialogAddRecord.value = true
- chosenIndex.value = index
- addRecord.value = JSON.parse(JSON.stringify(row))
- }
-
- // 添加删除排班步骤
- const addFlow = (index) => {
- dialogAddShift.value = true
- chosenShiftIndex.value = index
- }
- const deleteFlow = (index) => {
- deleteShiftDialog.value = true
- chosenShiftIndex.value = index
- }
- const conFirmShiftDelete = () => {
- addRecord.value.shiftSteps.splice( chosenShiftIndex.value,1)
- deleteShiftDialog.value = false
- }
- const confirmAddShift = async (formEl: FormInstance | undefined) => {
- if (!formEl) return
- await formEl.validate((valid, fields) => {
- if (valid) {
- if(addRecord.value.shiftSteps){
- addRecord.value.shiftSteps.splice(chosenShiftIndex.value+1,0,addShift.value)
- }else{
- addRecord.value.shiftSteps = []
- addRecord.value.shiftSteps.unshift(addShift.value)
- }
- dialogAddShift.value = false
- } else {
- console.log('error submit!', fields)
+ }else{
+ if(addRecord.value.type == '循环班' && addRecord.value.shiftSteps.length == 0){
+ ElMessage({
+ message: '请先设置自定义排班后再提交',
+ type: 'warning',
+ })
+ return
+ }else{
+ if(addRecord.value.type == '固定班'){delete addRecord.value.shiftSteps}
+ console.log(addRecord.value,'addRecord')
+ tableData[chosenIndex.value] = addRecord.value
}
- })
+ }
+ dialogAddRecord.value =false
+ } else {
+ console.log('error submit!', fields)
+ }
+ })
+ }
+ const closeAdd =()=>{
+ addRecord.value={}
+ chosenIndex.value = -1
+ addShift.value={}
+ chosenShiftIndex.value = -1
+ }
+ const indexClear = ()=>{
+ chosenIndex.value = -1
+ }
+ const indexShiftClear = ()=>{
+ chosenShiftIndex.value = -1
+ }
+ const editRecord =(index, row)=>{
+ dialogAddRecord.value = true
+ chosenIndex.value = index
+ addRecord.value = JSON.parse(JSON.stringify(row))
+ }
+
+ // 添加删除排班步骤
+ const addFlow = (index) => {
+ dialogAddShift.value = true
+ chosenShiftIndex.value = index
+ }
+ const deleteFlow = (index) => {
+ deleteShiftDialog.value = true
+ chosenShiftIndex.value = index
+ }
+ const conFirmShiftDelete = () => {
+ addRecord.value.shiftSteps.splice( chosenShiftIndex.value,1)
+ deleteShiftDialog.value = false
+ }
+ const confirmAddShift = async (formEl: FormInstance | undefined) => {
+ if (!formEl) return
+ await formEl.validate((valid, fields) => {
+ if (valid) {
+ if(addRecord.value.shiftSteps){
+ addRecord.value.shiftSteps.splice(chosenShiftIndex.value+1,0,addShift.value)
+ }else{
+ addRecord.value.shiftSteps = []
+ addRecord.value.shiftSteps.unshift(addShift.value)
+ }
+ dialogAddShift.value = false
+ } else {
+ console.log('error submit!', fields)
}
- const closeAddShift =()=>{
- addShift.value={}
- chosenShiftIndex.value = -1
- }
- // 折线图
- const renderMenu = async (value: string) => {
- Session.set('projectId',value)
- userInfos.value.projectId = value
- await initBackEndControlRoutes();
- };
- // return {
- // renderMenu,
- // multipleTableRef,
- // tableData,
- // currentPage,
- // pageSize,
- // dialogDetails,
- // details,
- // deleteDialog,
- // dialogAddRecord,
- // viewRecord,
- // deleteRecord,
- // handleSizeChange,
- // handleCurrentChange,
- // Plus,
- // Edit,
- // Delete,
- // Search,
- // Download,
- // handleSelectionChange,
- // Refresh,
- // ...toRefs(state),
- // };
- // },
- // });
+ })
+
+ }
+ const closeAddShift =()=>{
+ addShift.value={}
+ chosenShiftIndex.value = -1
+ }
+ // 折线图
+ const renderMenu = async (value: string) => {
+ Session.set('projectId',value)
+ userInfos.value.projectId = value
+ await initBackEndControlRoutes();
+ };
</script>
<style scoped lang="scss">
$homeNavLengh: 8;
.home-container {
- height: 100%;
+ height: calc(100vh - 114px);
+ box-sizing: border-box;
overflow: hidden;
.homeCard{
width: 100%;
padding: 20px;
+ box-sizing: border-box;
background: #fff;
border-radius: 4px;
+
+ .main-card{
+ width: 100%;
+ height: 100%;
+ .cardTop{
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ margin-bottom: 20px;
+ .mainCardBtn{
+ margin: 0;
+ }
+ }
+ .pageBtn{
+ height: 60px;
+ display: flex;
+ align-items: center;
+ justify-content: right;
+
+ .demo-pagination-block + .demo-pagination-block {
+ margin-top: 10px;
+ }
+ .demo-pagination-block .demonstration {
+ margin-bottom: 16px;
+ }
+ }
+ }
+ &:last-of-type{
+ height: calc(100% - 100px);
+ }
}
.el-row{
display: flex;
@@ -470,37 +475,6 @@
white-space: nowrap;
margin-right: 20px;
}
- }
- }
- .mainPages{
- height: 100%;
- display: flex;
- flex-direction: column;
- justify-content: space-between;
- }
- .main-card{
- width: 100%;
- .cardTop{
- display: flex;
- align-items: center;
- justify-content: space-between;
- margin-bottom: 20px;
- .mainCardBtn{
- margin: 0;
- }
- }
- }
- .pageBtn{
- display: flex;
- align-items: center;
- justify-content: right;
- margin-top: 20px;
-
- .demo-pagination-block + .demo-pagination-block {
- margin-top: 10px;
- }
- .demo-pagination-block .demonstration {
- margin-bottom: 16px;
}
}
}
diff --git a/src/views/basicRightsManagement/personnelShiftManagement/teamManagement/index.vue b/src/views/basicRightsManagement/personnelShiftManagement/teamManagement/index.vue
index 04f674a..c0bbe06 100644
--- a/src/views/basicRightsManagement/personnelShiftManagement/teamManagement/index.vue
+++ b/src/views/basicRightsManagement/personnelShiftManagement/teamManagement/index.vue
@@ -1,6 +1,6 @@
<template>
<div class="home-container">
- <el-scrollbar height="100%">
+ <div style="height: 100%">
<el-row class="homeCard">
<el-col :span="8">
<div class="grid-content topInfo">
@@ -24,6 +24,7 @@
ref="multipleTableRef"
:data="tableData"
style="width: 100%"
+ height="calc(100% - 100px)"
:header-cell-style="{background: '#fafafa'}"
@selection-change="handleSelectionChange"
>
@@ -38,22 +39,22 @@
</template>
</el-table-column>
</el-table>
- </div>
- <div class="pageBtn">
- <el-pagination
- v-model:currentPage="currentPage"
- v-model:page-size="pageSize"
- :page-sizes="[10, 15]"
- small=false
- background
- layout="total, sizes, prev, pager, next, jumper"
- :total="100"
- @size-change="handleSizeChange"
- @current-change="handleCurrentChange"
- />
+ <div class="pageBtn">
+ <el-pagination
+ v-model:currentPage="currentPage"
+ v-model:page-size="pageSize"
+ :page-sizes="[10, 15]"
+ small=false
+ background
+ layout="total, sizes, prev, pager, next, jumper"
+ :total="100"
+ @size-change="handleSizeChange"
+ @current-change="handleCurrentChange"
+ />
+ </div>
</div>
</div>
- </el-scrollbar>
+ </div>
<el-dialog v-model="dialogDetails" title="班组信息">
<el-form :model="details" label-width="120px">
<el-form-item label="班组名称">
@@ -127,194 +128,198 @@
interface type {
}
- // export default defineComponent({
- // name: 'workCheckinRecord',
- // setup() {
- const userInfo = useUserInfo()
- const { userInfos } = storeToRefs(userInfo);
- const state = reactive<stateType>({});
- const currentPage = ref(1)
- const pageSize = ref(10)
- const chosenIndex = ref(-1)
- const casProps = {
- expandTrigger: 'hover',
- multiple: true,
- emitPath: false,
- checkStrictly: false
- }
- const handleSizeChange = (val: number) => {
- console.log(`${val} items per page`)
- }
- const handleCurrentChange = (val: number) => {
- console.log(`current page: ${val}`)
- }
- const workerList =reactive([
+ const userInfo = useUserInfo()
+ const { userInfos } = storeToRefs(userInfo);
+ const state = reactive<stateType>({});
+ const currentPage = ref(1)
+ const pageSize = ref(10)
+ const chosenIndex = ref(-1)
+ const casProps = {
+ expandTrigger: 'hover',
+ multiple: true,
+ emitPath: false,
+ checkStrictly: false
+ }
+ const handleSizeChange = (val: number) => {
+ console.log(`${val} items per page`)
+ }
+ const handleCurrentChange = (val: number) => {
+ console.log(`current page: ${val}`)
+ }
+ const workerList =reactive([
+ {
+ value: 'A部门车间',
+ label: 'A部门车间',
+ children: [
{
- value: 'A部门车间',
- label: 'A部门车间',
- children: [
- {
- value: '刘能',
- label: '刘能',
- },
- {
- value: '赵四',
- label: '赵四',
- },
- {
- value: '谢广坤',
- label: '谢广坤',
- },
- {
- value: '王大拿',
- label: '王大拿',
- },
- {
- value: '刘能',
- label: '刘能',
- },
- {
- value: '赵四',
- label: '赵四',
- }
- ]
+ value: '刘能',
+ label: '刘能',
},
{
- value: 'B部门车间',
- label: 'B部门车间',
- children: [
- {
- value: '刘备',
- label: '刘备',
- },
- {
- value: '关羽',
- label: '关羽',
- },
- {
- value: '张飞',
- label: '张飞',
- },
- {
- value: '赵云',
- label: '赵云',
- },
- {
- value: '黄忠',
- label: '黄忠',
- },
- {
- value: '马超',
- label: '马超',
- }
- ]
+ value: '赵四',
+ label: '赵四',
+ },
+ {
+ value: '谢广坤',
+ label: '谢广坤',
+ },
+ {
+ value: '王大拿',
+ label: '王大拿',
+ },
+ {
+ value: '刘能',
+ label: '刘能',
+ },
+ {
+ value: '赵四',
+ label: '赵四',
}
- ])
- const tableData = reactive(
- [
- {
- teamName: 'A车间班组',
- teamMember: ['张三','李四','李羽飞']
- },
- {
- teamName: 'B车间班组',
- teamMember: ['刘能','赵四','谢广坤']
- },
- ]
- )
- const addRef = ref<FormInstance>()
- const addRules = reactive<FormRules>({
- teamName:[{required: true, message: '该内容不能为空',trigger:'blur'}],
- teamMember:[{required: true, message: '该内容不能为空',trigger:'blur'}]
- })
- const dialogDetails = ref(false)
- const dialogAddRecord = ref(false)
- const deleteDialog = ref(false)
- const addRecord = ref({})
- const details = ref({})
- const viewRecord = (row) =>{
- details.value = JSON.parse(JSON.stringify(row))
- dialogDetails.value = true
+ ]
+ },
+ {
+ value: 'B部门车间',
+ label: 'B部门车间',
+ children: [
+ {
+ value: '刘备',
+ label: '刘备',
+ },
+ {
+ value: '关羽',
+ label: '关羽',
+ },
+ {
+ value: '张飞',
+ label: '张飞',
+ },
+ {
+ value: '赵云',
+ label: '赵云',
+ },
+ {
+ value: '黄忠',
+ label: '黄忠',
+ },
+ {
+ value: '马超',
+ label: '马超',
+ }
+ ]
+ }
+ ])
+ const tableData = reactive(
+ [
+ {
+ teamName: 'A车间班组',
+ teamMember: ['张三','李四','李羽飞']
+ },
+ {
+ teamName: 'B车间班组',
+ teamMember: ['刘能','赵四','谢广坤']
+ },
+ ]
+ )
+ const addRef = ref<FormInstance>()
+ const addRules = reactive<FormRules>({
+ teamName:[{required: true, message: '该内容不能为空',trigger:'blur'}],
+ teamMember:[{required: true, message: '该内容不能为空',trigger:'blur'}]
+ })
+ const dialogDetails = ref(false)
+ const dialogAddRecord = ref(false)
+ const deleteDialog = ref(false)
+ const addRecord = ref({})
+ const details = ref({})
+ const viewRecord = (row) =>{
+ details.value = JSON.parse(JSON.stringify(row))
+ dialogDetails.value = true
+ }
+ const deleteRecord = (index) =>{
+ chosenIndex.value = index
+ deleteDialog.value = true
+ }
+ const conFirmDelete = ()=> {
+ tableData.splice(chosenIndex.value,1)
+ deleteDialog.value = false
+ }
+ const confirmAddRecord = async (formEl: FormInstance | undefined) =>{
+ if (!formEl) return
+ await formEl.validate((valid, fields) => {
+ if (valid) {
+ if(chosenIndex.value == -1){
+ tableData.unshift(addRecord.value)
+ }else{
+ tableData[chosenIndex.value] = addRecord.value
+ }
+ dialogAddRecord.value =false
+ } else {
+ console.log('error submit!', fields)
}
- const deleteRecord = (index) =>{
- chosenIndex.value = index
- deleteDialog.value = true
- }
- const conFirmDelete = ()=> {
- tableData.splice(chosenIndex.value,1)
- deleteDialog.value = false
- }
- const confirmAddRecord = async (formEl: FormInstance | undefined) =>{
- if (!formEl) return
- await formEl.validate((valid, fields) => {
- if (valid) {
- if(chosenIndex.value == -1){
- tableData.unshift(addRecord.value)
- }else{
- tableData[chosenIndex.value] = addRecord.value
- }
- dialogAddRecord.value =false
- } else {
- console.log('error submit!', fields)
- }
- })
+ })
- }
- const closeAdd =()=>{
- addRecord.value={}
- chosenIndex.value = -1
- }
- const indexClear = ()=>{
- chosenIndex.value = -1
- }
- const editRecord =(index, row)=>{
- dialogAddRecord.value = true
- chosenIndex.value = index
- addRecord.value = JSON.parse(JSON.stringify(row))
- }
- // 折线图
- const renderMenu = async (value: string) => {
- Session.set('projectId',value)
- userInfos.value.projectId = value
- await initBackEndControlRoutes();
- };
- // return {
- // renderMenu,
- // multipleTableRef,
- // tableData,
- // currentPage,
- // pageSize,
- // dialogDetails,
- // details,
- // deleteDialog,
- // dialogAddRecord,
- // viewRecord,
- // deleteRecord,
- // handleSizeChange,
- // handleCurrentChange,
- // Plus,
- // Edit,
- // Delete,
- // Search,
- // Download,
- // handleSelectionChange,
- // Refresh,
- // ...toRefs(state),
- // };
- // },
- // });
+ }
+ const closeAdd =()=>{
+ addRecord.value={}
+ chosenIndex.value = -1
+ }
+ const indexClear = ()=>{
+ chosenIndex.value = -1
+ }
+ const editRecord =(index, row)=>{
+ dialogAddRecord.value = true
+ chosenIndex.value = index
+ addRecord.value = JSON.parse(JSON.stringify(row))
+ }
+ // 折线图
+ const renderMenu = async (value: string) => {
+ Session.set('projectId',value)
+ userInfos.value.projectId = value
+ await initBackEndControlRoutes();
+ };
</script>
<style scoped lang="scss">
$homeNavLengh: 8;
.home-container {
- height: 100%;
+ height: calc(100vh - 114px);
+ box-sizing: border-box;
overflow: hidden;
.homeCard{
width: 100%;
padding: 20px;
+ box-sizing: border-box;
background: #fff;
border-radius: 4px;
+
+ .main-card{
+ width: 100%;
+ height: 100%;
+ .cardTop{
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ margin-bottom: 20px;
+ .mainCardBtn{
+ margin: 0;
+ }
+ }
+ .pageBtn{
+ height: 60px;
+ display: flex;
+ align-items: center;
+ justify-content: right;
+
+ .demo-pagination-block + .demo-pagination-block {
+ margin-top: 10px;
+ }
+ .demo-pagination-block .demonstration {
+ margin-bottom: 16px;
+ }
+ }
+ }
+ &:last-of-type{
+ height: calc(100% - 100px);
+ }
}
.el-row{
display: flex;
@@ -338,37 +343,6 @@
white-space: nowrap;
margin-right: 20px;
}
- }
- }
- .mainPages{
- height: 100%;
- display: flex;
- flex-direction: column;
- justify-content: space-between;
- }
- .main-card{
- width: 100%;
- .cardTop{
- display: flex;
- align-items: center;
- justify-content: space-between;
- margin-bottom: 20px;
- .mainCardBtn{
- margin: 0;
- }
- }
- }
- .pageBtn{
- display: flex;
- align-items: center;
- justify-content: right;
- margin-top: 20px;
-
- .demo-pagination-block + .demo-pagination-block {
- margin-top: 10px;
- }
- .demo-pagination-block .demonstration {
- margin-bottom: 16px;
}
}
}
diff --git a/src/views/basicRightsManagement/personnelShiftManagement/workingHours/index.vue b/src/views/basicRightsManagement/personnelShiftManagement/workingHours/index.vue
index bb15eed..682c49e 100644
--- a/src/views/basicRightsManagement/personnelShiftManagement/workingHours/index.vue
+++ b/src/views/basicRightsManagement/personnelShiftManagement/workingHours/index.vue
@@ -1,12 +1,12 @@
<template>
<div class="home-container">
- <el-scrollbar height="100%">
+ <div style="height: 100%">
<el-row class="homeCard">
<el-col :span="8">
<div class="grid-content topInfo">
<el-input v-model="searchWord" placeholder="工作时段名称"></el-input>
- <el-button type="primary">查询</el-button>
- <el-button plain>重置</el-button>
+ <el-button type="primary" @click="searchRecord">查询</el-button>
+ <el-button plain @click="clearSearch">重置</el-button>
</div>
</el-col>
</el-row>
@@ -16,57 +16,70 @@
<el-col :span="12" class="mainCardBtn">
<el-button type="primary" :icon="Plus" size="default" @click="dialogAddRecord=true">新建</el-button>
<!-- <el-button type="warning" :icon="Edit" size="default" plain>修改</el-button>-->
- <el-button type="danger" :icon="Delete" size="default" plain>删除</el-button>
+ <el-button type="danger" :icon="Delete" size="default" plain @click="deleteWorkTimePeriods">删除</el-button>
</el-col>
- <el-button type="primary" :icon="Refresh" size="default"/>
+ <el-button type="primary" :icon="Refresh" size="default" @click="reLoadData()"/>
</el-row>
<el-table
ref="multipleTableRef"
:data="tableData"
style="width: 100%"
+ height="calc(100% - 100px)"
:header-cell-style="{background: '#fafafa'}"
@selection-change="handleSelectionChange"
>
<el-table-column type="selection" width="100" />
<el-table-column property="name" label="工作时段名称"/>
- <el-table-column property="range" label="排班时段"/>
+ <el-table-column property="startTime" label="开始时间"/>
+ <el-table-column property="endTime" label="结束时间"/>
+ <el-table-column property="info" label="描述信息"/>
<el-table-column fixed="right" label="操作" align="center" width="250">
<template #default="scope">
<el-button link type="primary" size="small" :icon="View" @click="viewRecord(scope.row)">查看</el-button>
<el-button link type="primary" size="small" :icon="Edit" @click="editRecord(scope.$index ,scope.row)">修改</el-button>
- <el-button link type="danger" size="small" :icon="Delete" @click="deleteRecord(scope.$index)">删除</el-button>
+ <el-button link type="danger" size="small" :icon="Delete" @click="deleteRecord(scope.row)">删除</el-button>
</template>
</el-table-column>
</el-table>
- </div>
- <div class="pageBtn">
- <el-pagination
- v-model:currentPage="currentPage"
- v-model:page-size="pageSize"
- :page-sizes="[10, 15]"
- small=false
- background
- layout="total, sizes, prev, pager, next, jumper"
- :total="100"
- @size-change="handleSizeChange"
- @current-change="handleCurrentChange"
- />
+ <div class="pageBtn">
+ <el-pagination
+ v-model:currentPage="pageIndex"
+ v-model:page-size="pageSize"
+ :page-sizes="[10, 15]"
+ small=false
+ background
+ layout="total, sizes, prev, pager, next, jumper"
+ :total="totalSize"
+ @size-change="handleSizeChange"
+ @current-change="handleCurrentChange"
+ />
+ </div>
</div>
</div>
- </el-scrollbar>
+ </div>
<el-dialog v-model="dialogDetails" title="工作时段">
<el-form :model="details" label-width="120px">
<el-form-item label="工作时段名称">
<el-input
v-model="details.name"
- class="input-with-select"
readonly
/>
</el-form-item>
- <el-form-item label="排班时段">
+ <el-form-item label="开始时间">
<el-input
- v-model="details.range"
- class="input-with-select"
+ v-model="details.startTime"
+ readonly
+ />
+ </el-form-item>
+ <el-form-item label="结束时间">
+ <el-input
+ v-model="details.endTime"
+ readonly
+ />
+ </el-form-item>
+ <el-form-item label="描述信息">
+ <el-input
+ v-model="details.info"
readonly
/>
</el-form-item>
@@ -75,7 +88,7 @@
</el-form-item>
</el-form>
</el-dialog>
- <el-dialog v-model="dialogAddRecord" title="工作时段编辑" @close="closeAdd">
+ <el-dialog v-model="dialogAddRecord" title="工作时段编辑" @close="closeAdd" @open="openAdd">
<el-form :model="addRecord" label-width="120px" ref="addRef" :rules="addRules">
<el-form-item label="工作时段名称" prop="name">
<el-input
@@ -84,22 +97,27 @@
</el-input>
</el-form-item>
<el-form-item label="上班开始时间" prop="startTime">
- <el-time-select
+ <el-time-picker
v-model="addRecord.startTime"
- start="00:00"
- step="00:15"
- end="24:00"
+ format="HH:mm"
+ value-format="HH:mm"
placeholder="Select time"
/>
</el-form-item>
<el-form-item label="上班结束时间" prop="endTime">
- <el-time-select
+ <el-time-picker
v-model="addRecord.endTime"
- start="00:00"
- step="00:15"
- end="24:00"
+ format="HH:mm"
+ value-format="HH:mm"
placeholder="Select time"
/>
+ </el-form-item>
+ <el-form-item label="描述信息" prop="info">
+ <el-input
+ v-model="addRecord.info"
+ type="textarea"
+ >
+ </el-input>
</el-form-item>
<el-form-item>
<el-button type="warning" @click="dialogAddRecord = false" size="default" plain>取消</el-button>
@@ -119,167 +137,420 @@
</div>
</template>
-<script lang="ts" setup>
- import { toRefs, reactive, ref } from 'vue';
+<script lang="ts">
+ import { toRefs, reactive, ref, onMounted } from 'vue';
import { storeToRefs } from 'pinia';
import { initBackEndControlRoutes } from '/@/router/backEnd';
import {useUserInfo} from "/@/stores/userInfo";
import { Session } from '/@/utils/storage';
import { Edit, View, Plus, Delete, Refresh, Search, Download } from '@element-plus/icons-vue'
import { ElTable } from 'element-plus'
- import { FormInstance, FormRules } from 'element-plus'
- let global: any = {
- homeChartOne: null,
- homeChartTwo: null,
- homeCharThree: null,
- dispose: [null, '', undefined],
- };
+ import { FormInstance, FormRules, ElMessage } from 'element-plus'
+ import { workingHoursApi } from '/@/api/basicDateManage/personShiftManage/workingHours';
+
+
+ // 定义接口来定义对象的类型
interface stateType {
- homeOne: Array <type>
+ tableData: Array<string>,
+ multipleSelection: Array<any>,
+ deleteArr: Array<any>,
+ dialogDetails: boolean,
+ dialogAddRecord: boolean,
+ deleteDialog: boolean,
+ pageIndex: number,
+ pageSize: number,
+ searchWord: string,
+ totalSize: number,
+ addRecord: {
+ name: string,
+ startTime: string,
+ endTime: string,
+ info: string
+ },
+ details: {
+ name: string,
+ startTime: string,
+ endTime: string,
+ info: string
+ }
}
- interface type {
- }
- // export default defineComponent({
- // name: 'workCheckinRecord',
- // setup() {
- const userInfo = useUserInfo()
- const { userInfos } = storeToRefs(userInfo);
- const state = reactive<stateType>({});
- const currentPage = ref(1)
- const pageSize = ref(10)
- const chosenIndex = ref(-1)
- const handleSizeChange = (val: number) => {
- console.log(`${val} items per page`)
- }
- const handleCurrentChange = (val: number) => {
- console.log(`current page: ${val}`)
- }
- const tableData = reactive(
- [
- {
- name: '四班三倒早班',
- range: '04:00 - 12:00'
- },
- {
- name: '四班三倒中班',
- range: '12:00 - 20:00'
- },
- {
- name: '四班三倒中班',
- range: '20:00 - 次日04:00'
- },
- {
- name: '常白班',
- range: '08:00 - 18:00'
- }
- ]
- )
- const addRef = ref<FormInstance>()
- const addRules = reactive<FormRules>({
- name:[{required: true, message: '该内容不能为空',trigger:'blur'}],
- startTime:[{required: true, message: '该内容不能为空',trigger:'blur'}],
- endTime:[{required: true, message: '该内容不能为空',trigger:'blur'}]
- })
- const dialogDetails = ref(false)
- const dialogAddRecord = ref(false)
- const deleteDialog = ref(false)
- const addRecord = ref({})
- const details = ref({})
- const viewRecord = (row) =>{
- details.value = JSON.parse(JSON.stringify(row))
- dialogDetails.value = true
- }
- const deleteRecord = (index) =>{
- chosenIndex.value = index
- deleteDialog.value = true
- }
- const conFirmDelete = ()=> {
- tableData.splice(chosenIndex.value,1)
- deleteDialog.value = false
- }
- const confirmAddRecord = async (formEl: FormInstance | undefined) =>{
- if (!formEl) return
- await formEl.validate((valid, fields) => {
- if (valid) {
- if(chosenIndex.value == -1){
- if(addRecord.value.startTime >= addRecord.value.endTime){
- addRecord.value.endTime = '次日' + addRecord.value.endTime
- }
- addRecord.value.range = addRecord.value.startTime + '\xa0-\xa0' + addRecord.value.endTime
- tableData.unshift(addRecord.value)
- }else{
- if(addRecord.value.startTime >= addRecord.value.endTime){
- addRecord.value.endTime = '次日' + addRecord.value.endTime
- }
- addRecord.value.range = addRecord.value.startTime + '\xa0-\xa0' + addRecord.value.endTime
- tableData[chosenIndex.value] = addRecord.value
- }
- dialogAddRecord.value =false
- } else {
- console.log('error submit!', fields)
- }
+ export default {
+ name: 'workingHours',
+ components:{},
+ setup() {
+ const userInfo = useUserInfo()
+ const {userInfos} = storeToRefs(userInfo);
+
+ const state = reactive<stateType>({
+ pageIndex: 1,
+ pageSize: 10,
+ totalSize: 0,
+ chosenIndex: null,
+ searchWord: '',
+ tableData: [],
+ multipleSelection: [],
+ dialogDetails: false,
+ dialogAddRecord: false,
+ deleteDialog: false,
+ addRecord: {
+ name: '',
+ startTime: '',
+ endTime: '',
+ info: ''
+ },
+ details: {
+ name: '',
+ startTime: '',
+ endTime: '',
+ info: ''
+ },
+ deleteId: null,
+ deleteArr: []
+ })
+ interface User {
+ name: string,
+ startTime: string,
+ endTime: string,
+ info: string
+ }
+ const multipleTableRef = ref<InstanceType<typeof ElTable>>()
+ const toggleSelection = (rows?: User[]) => {
+ if (rows) {
+ rows.forEach((row) => {
+ // TODO: improvement typing when refactor table
+ // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+ // @ts-expect-error
+ multipleTableRef.value!.toggleRowSelection(row, undefined)
})
+ } else {
+ multipleTableRef.value!.clearSelection()
+ }
+ }
+ // 多选
+ const handleSelectionChange = (val: User[]) => {
+ state.multipleSelection = JSON.parse(JSON.stringify(val))
+ state.deleteArr = state.multipleSelection.map((item)=>{
+ item = item.id
+ return item
+ })
+ }
+
+ const addRef = ref<FormInstance>()
+ const addRules = reactive<FormRules>({
+ name: [{required: true, message: '该内容不能为空', trigger: 'blur'}],
+ startTime: [{required: true, message: '该内容不能为空', trigger: 'blur'}],
+ endTime: [{required: true, message: '该内容不能为空', trigger: 'blur'}]
+ })
+
+ // 页面载入时执行方法
+ onMounted(() => {
+ // getWorkTimePeriod()
+ getListByPage()
+ })
+
+ // 获取工作时段列表
+ const getWorkTimePeriod = async () => {
+ let res = await workingHoursApi().getWorkTimePeriod({name: state.searchWord});
+ if (res.data.code === '200') {
+ state.tableData = res.data.data.map((item)=>{
+ item.startHour = item.startHour==null?'00':(item.startHour.toString()[1]?item.startHour.toString():'0'+item.startHour.toString())
+ item.startMin = item.startMin==null?'00':(item.startMin.toString()[1]?item.startMin.toString():'0'+item.startMin.toString())
+ item.endHour = item.endHour==null?'00':(item.endHour.toString()[1]?item.endHour.toString():'0'+item.endHour.toString())
+ item.endMin = item.endMin==null?'00':(item.endMin.toString()[1]?item.endMin.toString():'0'+item.endMin.toString())
+ item.startTime = item.startHour + ':' + item.startMin
+ item.endTime = item.endHour + ':' + item.endMin
+ return item
+ })
+ } else {
+ ElMessage({
+ type: 'warning',
+ message: res.data.msg
+ });
}
- const closeAdd =()=>{
- addRecord.value={}
- chosenIndex.value = -1
+ }
+
+ // 分页获取工作时段列表
+ const getListByPage = async ()=>{
+ const data = {pageSize: state.pageSize,pageIndex: state.pageIndex,searchParams:{name: state.searchWord}}
+ let res = await workingHoursApi().postPeriodPage(data);
+ if (res.data.code === '200') {
+ state.tableData = res.data.data.map((item)=>{
+ item.startHour = item.startHour==null?'00':(item.startHour.toString()[1]?item.startHour.toString():'0'+item.startHour.toString())
+ item.startMin = item.startMin==null?'00':(item.startMin.toString()[1]?item.startMin.toString():'0'+item.startMin.toString())
+ item.endHour = item.endHour==null?'00':(item.endHour.toString()[1]?item.endHour.toString():'0'+item.endHour.toString())
+ item.endMin = item.endMin==null?'00':(item.endMin.toString()[1]?item.endMin.toString():'0'+item.endMin.toString())
+ item.startTime = item.startHour + ':' + item.startMin
+ item.endTime = item.endHour + ':' + item.endMin
+ return item
+ })
+ state.totalSize = res.data.total
+ } else {
+ ElMessage({
+ type: 'warning',
+ message: res.data.msg
+ });
}
- const indexClear = ()=>{
- chosenIndex.value = -1
+ }
+
+ // 关键词查询记录
+ const searchRecord = async()=>{
+ if(state.searchWord==''){
+ ElMessage({
+ type: 'warning',
+ message: '请输入查询关键词'
+ });
+ }else{
+ getListByPage()
}
- const editRecord =(index, row)=>{
- dialogAddRecord.value = true
- chosenIndex.value = index
- addRecord.value = JSON.parse(JSON.stringify(row))
- addRecord.value.startTime = addRecord.value.range.substring(0,5)
- addRecord.value.endTime = addRecord.value.range.substring(8)
+ }
+
+ const clearSearch = async()=>{
+ state.searchWord=''
+ getListByPage()
+ }
+
+ // 添加工作时段
+ const addWorkTimePeriod = async (data:any) => {
+ let res = await workingHoursApi().postWorkTimePeriod(data);
+ if (res.data.code === '200') {
+ ElMessage({
+ type: 'success',
+ message: res.data.msg
+ });
+ getListByPage()
+ } else {
+ ElMessage({
+ type: 'warning',
+ message: res.data.msg
+ });
}
- // 折线图
- const renderMenu = async (value: string) => {
- Session.set('projectId',value)
- userInfos.value.projectId = value
- await initBackEndControlRoutes();
- };
- // return {
- // renderMenu,
- // multipleTableRef,
- // tableData,
- // currentPage,
- // pageSize,
- // dialogDetails,
- // details,
- // deleteDialog,
- // dialogAddRecord,
- // viewRecord,
- // deleteRecord,
- // handleSizeChange,
- // handleCurrentChange,
- // Plus,
- // Edit,
- // Delete,
- // Search,
- // Download,
- // handleSelectionChange,
- // Refresh,
- // ...toRefs(state),
- // };
- // },
- // });
+ };
+
+ // 修改工作时段
+ const editWorkTimePeriod = async (data:any) => {
+ let res = await workingHoursApi().updateWorkTimePeriod(data);
+ if (res.data.code === '200') {
+ ElMessage({
+ type: 'success',
+ message: res.data.msg
+ });
+ getListByPage()
+ } else {
+ ElMessage({
+ type: 'warning',
+ message: res.data.msg
+ });
+ }
+ }
+
+ // 删除工作时段
+ const deleteWorkTimePeriod = async (data:any) => {
+ let res = await workingHoursApi().deletWorkTimePeriod(data);
+ if (res.data.code === '200') {
+ ElMessage({
+ type: 'success',
+ message: res.data.msg
+ });
+ getListByPage()
+ } else {
+ ElMessage({
+ type: 'warning',
+ message: res.data.msg
+ });
+ }
+ }
+
+ const deleteRecord = (row) => {
+ state.deleteId = row.id
+ state.deleteDialog = true
+ }
+
+ const conFirmDelete = () => {
+ deleteWorkTimePeriod({ id: state.deleteId })
+ state.deleteDialog = false
+ }
+
+ // 批量删除
+ const deleteWorkTimePeriods = async () => {
+ if(state.deleteArr.length>0){
+ console.log(state.deleteArr)
+ let res = await workingHoursApi().deleteBatchWorkTimePeriod({ids: state.deleteArr});
+ if (res.data.code === '200') {
+ ElMessage({
+ type: 'success',
+ message: res.data.msg
+ });
+ getListByPage()
+ } else {
+ ElMessage({
+ type: 'warning',
+ message: res.data.msg
+ });
+ }
+ }else{
+ ElMessage({
+ type: 'warning',
+ message: '请先选择要删除的记录'
+ });
+ }
+ }
+
+ const handleSizeChange = (val: number) => {
+ state.pageSize = val
+ getListByPage()
+ }
+ const handleCurrentChange = (val: number) => {
+ state.pageIndex = val
+ getListByPage()
+ }
+
+ // 查看记录
+ const viewRecord = (row) => {
+ state.details = row
+ state.dialogDetails = true
+ }
+
+ // 刷新
+ const reLoadData = async () =>{
+ getListByPage()
+ }
+ const editRecord = (index, row) => {
+ state.dialogAddRecord = true
+ state.chosenIndex = index
+ state.addRecord = JSON.parse(JSON.stringify(row))
+ }
+
+ // 新增修改记录
+ const confirmAddRecord = async (formEl: FormInstance | undefined) => {
+ if (!formEl) return
+ await formEl.validate(async (valid, fields) => {
+ if (valid) {
+ const data = {
+ name: state.addRecord.name,
+ info: state.addRecord.info,
+ startHour: Number(state.addRecord.startTime.substring(0, 2)),
+ startMin: Number(state.addRecord.startTime.substring(3)),
+ endHour: Number(state.addRecord.endTime.substring(0, 2)),
+ endMin: Number(state.addRecord.endTime.substring(3))
+ }
+ if (state.chosenIndex == null) {
+ // if (state.addRecord.startTime >= state.addRecord.endTime) {
+ // state.addRecord.endTime = '次日' + state.addRecord.endTime
+ // }
+ // state.tableData.unshift(data)
+ await addWorkTimePeriod(data)
+ } else {
+ // if (state.addRecord.startTime >= state.addRecord.endTime) {
+ // state.addRecord.endTime = '次日' + state.addRecord.endTime
+ // }
+ // state.tableData[state.chosenIndex] = state.addRecord
+ data.id = state.addRecord.id,
+ await editWorkTimePeriod(data)
+ }
+ state.dialogAddRecord = false
+ } else {
+ console.log('error submit!', fields)
+ }
+ })
+
+ }
+ const closeAdd = () => {
+ state.addRecord = {}
+ state.chosenIndex = null
+ }
+ const openAdd = () => {
+ if (state.chosenIndex == null) {
+ state.addRecord.info = ''
+ }
+ }
+ const indexClear = () => {
+ state.deleteId = null
+ }
+
+ // 折线图
+ const renderMenu = async (value: string) => {
+ Session.set('projectId', value)
+ userInfos.value.projectId = value
+ await initBackEndControlRoutes();
+ };
+ return {
+ addRef,
+ addRules,
+ View,
+ Edit,
+ Delete,
+ Refresh,
+ Plus,
+ toggleSelection,
+ handleSelectionChange,
+ deleteWorkTimePeriods,
+ searchRecord,
+ clearSearch,
+ viewRecord,
+ deleteRecord,
+ conFirmDelete,
+ getWorkTimePeriod,
+ getListByPage,
+ reLoadData,
+ deleteWorkTimePeriod,
+ handleSizeChange,
+ handleCurrentChange,
+ confirmAddRecord,
+ closeAdd,
+ openAdd,
+ indexClear,
+ editRecord,
+ ...toRefs(state)
+ };
+ }
+ }
</script>
<style scoped lang="scss">
$homeNavLengh: 8;
.home-container {
- height: 100%;
+ height: calc(100vh - 114px);
+ box-sizing: border-box;
overflow: hidden;
.homeCard{
width: 100%;
padding: 20px;
+ box-sizing: border-box;
background: #fff;
border-radius: 4px;
+
+ .main-card{
+ width: 100%;
+ height: 100%;
+ .cardTop{
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ margin-bottom: 20px;
+ .mainCardBtn{
+ margin: 0;
+ }
+ }
+ .pageBtn{
+ height: 60px;
+ display: flex;
+ align-items: center;
+ justify-content: right;
+
+ .demo-pagination-block + .demo-pagination-block {
+ margin-top: 10px;
+ }
+ .demo-pagination-block .demonstration {
+ margin-bottom: 16px;
+ }
+ }
+ }
+ &:last-of-type{
+ height: calc(100% - 100px);
+ }
}
.el-row{
display: flex;
@@ -303,37 +574,6 @@
white-space: nowrap;
margin-right: 20px;
}
- }
- }
- .mainPages{
- height: 100%;
- display: flex;
- flex-direction: column;
- justify-content: space-between;
- }
- .main-card{
- width: 100%;
- .cardTop{
- display: flex;
- align-items: center;
- justify-content: space-between;
- margin-bottom: 20px;
- .mainCardBtn{
- margin: 0;
- }
- }
- }
- .pageBtn{
- display: flex;
- align-items: center;
- justify-content: right;
- margin-top: 20px;
-
- .demo-pagination-block + .demo-pagination-block {
- margin-top: 10px;
- }
- .demo-pagination-block .demonstration {
- margin-bottom: 16px;
}
}
}
diff --git a/src/views/basicRightsManagement/personnelShiftManagement/workingHoursSet/index.vue b/src/views/basicRightsManagement/personnelShiftManagement/workingHoursSet/index.vue
new file mode 100644
index 0000000..31dc29b
--- /dev/null
+++ b/src/views/basicRightsManagement/personnelShiftManagement/workingHoursSet/index.vue
@@ -0,0 +1,573 @@
+<template>
+ <div class="home-container">
+ <div style="height: 100%">
+ <el-row class="homeCard">
+ <el-col :span="8">
+ <div class="grid-content topInfo">
+ <el-input v-model="searchWord" placeholder="工作时段名称"></el-input>
+ <el-button type="primary" @click="searchRecord">查询</el-button>
+ <el-button plain @click="clearSearch">重置</el-button>
+ </div>
+ </el-col>
+ </el-row>
+ <div class="homeCard">
+ <div class="main-card">
+ <el-row class="cardTop">
+ <el-col :span="12" class="mainCardBtn">
+ <el-button type="primary" :icon="Plus" size="default" @click="dialogAddRecord=true">新建</el-button>
+<!-- <el-button type="warning" :icon="Edit" size="default" plain>修改</el-button>-->
+ <el-button type="danger" :icon="Delete" size="default" plain @click="deleteWorkTimePeriods">删除</el-button>
+ </el-col>
+ <el-button type="primary" :icon="Refresh" size="default" @click="reLoadData()"/>
+ </el-row>
+ <el-table
+ ref="multipleTableRef"
+ :data="tableData"
+ style="width: 100%"
+ height="calc(100% - 100px)"
+ :header-cell-style="{background: '#fafafa'}"
+ @selection-change="handleSelectionChange"
+ >
+ <el-table-column type="selection" width="100" />
+ <el-table-column property="name" label="工作时间组名称"/>
+ <el-table-column property="timeRange" label="关联工作时段"/>
+ <el-table-column property="info" label="描述信息"/>
+ <el-table-column fixed="right" label="操作" align="center" width="250">
+ <template #default="scope">
+ <el-button link type="primary" size="small" :icon="View" @click="viewRecord(scope.row)">查看</el-button>
+ <el-button link type="primary" size="small" :icon="Edit" @click="editRecord(scope.$index ,scope.row)">修改</el-button>
+ <el-button link type="danger" size="small" :icon="Delete" @click="deleteRecord(scope.row)">删除</el-button>
+ </template>
+ </el-table-column>
+ </el-table>
+ <div class="pageBtn">
+ <el-pagination
+ v-model:currentPage="pageIndex"
+ v-model:page-size="pageSize"
+ :page-sizes="[10, 15]"
+ small=false
+ background
+ layout="total, sizes, prev, pager, next, jumper"
+ :total="totalSize"
+ @size-change="handleSizeChange"
+ @current-change="handleCurrentChange"
+ />
+ </div>
+ </div>
+ </div>
+ </div>
+ <el-dialog v-model="dialogDetails" title="工作时间组">
+ <el-form :model="details" label-width="120px">
+ <el-form-item label="工作时间组名称">
+ <el-input
+ v-model="details.name"
+ readonly
+ />
+ </el-form-item>
+ <el-form-item label="关联工作时段">
+ <el-input
+ v-model="details.timeRange"
+ readonly
+ />
+ </el-form-item>
+ <el-form-item label="描述信息">
+ <el-input
+ v-model="details.info"
+ readonly
+ />
+ </el-form-item>
+ <el-form-item>
+ <el-button type="primary" @click="dialogDetails = false" size="default">确认</el-button>
+ </el-form-item>
+ </el-form>
+ </el-dialog>
+ <el-dialog v-model="dialogAddRecord" title="工作时间组编辑" @close="closeAdd" @open="openAdd">
+ <el-form :model="addRecord" label-width="120px" ref="addRef" :rules="addRules">
+ <el-form-item label="工作时间组名称" prop="name">
+ <el-input
+ v-model="addRecord.name"
+ >
+ </el-input>
+ </el-form-item>
+ <el-form-item label="关联工作时段" prop="timeRange">
+ <el-select v-model="addRecord.timeRange" multiple placeholder="请选择">
+ <el-option v-for="(item,index) in timeList" :key="index" :label="item.name" :value="item.name" />
+ </el-select>
+ </el-form-item>
+ <el-form-item label="描述信息" prop="info">
+ <el-input
+ v-model="addRecord.info"
+ type="textarea"
+ >
+ </el-input>
+ </el-form-item>
+ <el-form-item>
+ <el-button type="warning" @click="dialogAddRecord = false" size="default" plain>取消</el-button>
+ <el-button type="primary" @click="confirmAddRecord(addRef)" size="default">确认</el-button>
+ </el-form-item>
+ </el-form>
+ </el-dialog>
+ <el-dialog v-model="deleteDialog" title="提示" width="30%" center @close="indexClear">
+ <span>您确定要删除该条记录吗?</span>
+ <template #footer>
+ <span class="dialog-footer">
+ <el-button @click="deleteDialog = false" size="default">取消</el-button>
+ <el-button type="primary" @click="conFirmDelete" size="default">确认</el-button>
+ </span>
+ </template>
+ </el-dialog>
+ </div>
+</template>
+
+<script lang="ts">
+ import { toRefs, reactive, ref, onMounted } from 'vue';
+ import { storeToRefs } from 'pinia';
+ import { initBackEndControlRoutes } from '/@/router/backEnd';
+ import {useUserInfo} from "/@/stores/userInfo";
+ import { Session } from '/@/utils/storage';
+ import { Edit, View, Plus, Delete, Refresh, Search, Download } from '@element-plus/icons-vue'
+ import { ElTable } from 'element-plus'
+ import { FormInstance, FormRules, ElMessage } from 'element-plus'
+ import { workingHoursApi } from '/@/api/basicDateManage/personShiftManage/workingHoursSet';
+
+
+
+ // 定义接口来定义对象的类型
+ interface stateType {
+ tableData: Array<string>,
+ multipleSelection: Array<any>,
+ deleteArr: Array<any>,
+ timeList: Array<any>,
+ dialogDetails: boolean,
+ dialogAddRecord: boolean,
+ deleteDialog: boolean,
+ pageIndex: number,
+ chosenIndex: any,
+ deleteId: any,
+ pageSize: number,
+ searchWord: string,
+ totalSize: number,
+ addRecord: {
+ name: string,
+ timeRange: Array<any>,
+ info: string,
+ startTime: string,
+ endTime: string
+ },
+ details: {
+ name: string,
+ timeRange: Array<any>,
+ info: string
+ }
+ }
+
+ export default {
+ name: 'workingHoursSet',
+ components:{},
+ setup() {
+ const userInfo = useUserInfo()
+ const {userInfos} = storeToRefs(userInfo);
+
+ const state = reactive<stateType>({
+ pageIndex: 1,
+ pageSize: 10,
+ totalSize: 0,
+ chosenIndex: null,
+ searchWord: '',
+ tableData: [],
+ timeList: [],
+ multipleSelection: [],
+ dialogDetails: false,
+ dialogAddRecord: false,
+ deleteDialog: false,
+ addRecord: {
+ name: '',
+ timeRange: [],
+ info: '',
+ startTime: '',
+ endTime: ''
+ },
+ details: {
+ name: '',
+ timeRange: [],
+ info: ''
+ },
+ deleteId: null,
+ deleteArr: []
+ })
+ interface User {
+ name: string,
+ timeRange: [],
+ info: string
+ }
+ const multipleTableRef = ref<InstanceType<typeof ElTable>>()
+ const toggleSelection = (rows?: User[]) => {
+ if (rows) {
+ rows.forEach((row) => {
+ // TODO: improvement typing when refactor table
+ // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+ // @ts-expect-error
+ multipleTableRef.value!.toggleRowSelection(row, undefined)
+ })
+ } else {
+ multipleTableRef.value!.clearSelection()
+ }
+ }
+
+ // 多选
+ const handleSelectionChange = (val: User[]) => {
+ state.multipleSelection = JSON.parse(JSON.stringify(val))
+ state.deleteArr = state.multipleSelection.map((item)=>{
+ item = item.id
+ return item
+ })
+ }
+
+ const addRef = ref<FormInstance>()
+ const addRules = reactive<FormRules>({
+ name: [{required: true, message: '该内容不能为空', trigger: 'blur'}],
+ startTime: [{required: true, message: '该内容不能为空', trigger: 'blur'}],
+ endTime: [{required: true, message: '该内容不能为空', trigger: 'blur'}]
+ })
+
+ // 页面载入时执行方法
+ onMounted(() => {
+ // getWorkTimePeriod()
+ getListByPage()
+ })
+
+ // 获取工作时段列表
+ // const getWorkTimePeriod = async () => {
+ // let res = await workingHoursApi().getWorkTimePeriod({ name: state.searchWord });
+ // if (res.data.code === '200') {
+ // state.tableData = res.data.data.map((item)=>{
+ // item.startHour = item.startHour==null?'00':(item.startHour.toString()[1]?item.startHour.toString():'0'+item.startHour.toString())
+ // item.startMin = item.startMin==null?'00':(item.startMin.toString()[1]?item.startMin.toString():'0'+item.startMin.toString())
+ // item.endHour = item.endHour==null?'00':(item.endHour.toString()[1]?item.endHour.toString():'0'+item.endHour.toString())
+ // item.endMin = item.endMin==null?'00':(item.endMin.toString()[1]?item.endMin.toString():'0'+item.endMin.toString())
+ // item.startTime = item.startHour + ':' + item.startMin
+ // item.endTime = item.endHour + ':' + item.endMin
+ // return item
+ // })
+ // } else {
+ // ElMessage({
+ // type: 'warning',
+ // message: res.data.msg
+ // });
+ // }
+ // }
+
+ // 分页获取工作时段列表
+ const getListByPage = async ()=>{
+ const data = {pageSize: state.pageSize,pageIndex: state.pageIndex,searchParams:{name: state.searchWord}}
+ let res = await workingHoursApi().postPeriodPage(data);
+ if (res.data.code === '200') {
+ state.tableData = res.data.data.map((item)=>{
+ item.startHour = item.startHour==null?'00':(item.startHour.toString()[1]?item.startHour.toString():'0'+item.startHour.toString())
+ item.startMin = item.startMin==null?'00':(item.startMin.toString()[1]?item.startMin.toString():'0'+item.startMin.toString())
+ item.endHour = item.endHour==null?'00':(item.endHour.toString()[1]?item.endHour.toString():'0'+item.endHour.toString())
+ item.endMin = item.endMin==null?'00':(item.endMin.toString()[1]?item.endMin.toString():'0'+item.endMin.toString())
+ item.startTime = item.startHour + ':' + item.startMin
+ item.endTime = item.endHour + ':' + item.endMin
+ return item
+ })
+ state.totalSize = res.data.total
+ } else {
+ ElMessage({
+ type: 'warning',
+ message: res.data.msg
+ });
+ }
+ }
+
+ // 关键词查询记录
+ const searchRecord = async()=>{
+ if(state.searchWord==''){
+ ElMessage({
+ type: 'warning',
+ message: '请输入查询关键词'
+ });
+ }else{
+ getListByPage()
+ }
+ }
+
+ const clearSearch = async()=>{
+ state.searchWord=''
+ getListByPage()
+ }
+
+ // 添加工作时段
+ const addWorkTimePeriod = async (data:any) => {
+ let res = await workingHoursApi().postWorkTimePeriod(data);
+ if (res.data.code === '200') {
+ ElMessage({
+ type: 'success',
+ message: res.data.msg
+ });
+ getListByPage()
+ } else {
+ ElMessage({
+ type: 'warning',
+ message: res.data.msg
+ });
+ }
+ };
+
+ // 修改工作时段
+ const editWorkTimePeriod = async (data:any) => {
+ let res = await workingHoursApi().updateWorkTimePeriod(data);
+ if (res.data.code === '200') {
+ ElMessage({
+ type: 'success',
+ message: res.data.msg
+ });
+ getListByPage()
+ } else {
+ ElMessage({
+ type: 'warning',
+ message: res.data.msg
+ });
+ }
+ }
+
+ // 删除工作时段
+ const deleteWorkTimePeriod = async (data:any) => {
+ let res = await workingHoursApi().deletWorkTimePeriod(data);
+ if (res.data.code === '200') {
+ ElMessage({
+ type: 'success',
+ message: res.data.msg
+ });
+ getListByPage()
+ } else {
+ ElMessage({
+ type: 'warning',
+ message: res.data.msg
+ });
+ }
+ }
+
+ const deleteRecord = (row) => {
+ state.deleteId = row.id
+ state.deleteDialog = true
+ }
+
+ const conFirmDelete = () => {
+ deleteWorkTimePeriod({ id: state.deleteId })
+ state.deleteDialog = false
+ }
+
+ // 批量删除
+ const deleteWorkTimePeriods = async () => {
+ if(state.deleteArr.length>0){
+ console.log(state.deleteArr)
+ let res = await workingHoursApi().deleteBatchWorkTimePeriod({ids: state.deleteArr});
+ if (res.data.code === '200') {
+ ElMessage({
+ type: 'success',
+ message: res.data.msg
+ });
+ getListByPage()
+ } else {
+ ElMessage({
+ type: 'warning',
+ message: res.data.msg
+ });
+ }
+ }else{
+ ElMessage({
+ type: 'warning',
+ message: '请先选择要删除的记录'
+ });
+ }
+ }
+
+ const handleSizeChange = (val: number) => {
+ state.pageSize = val
+ getListByPage()
+ }
+ const handleCurrentChange = (val: number) => {
+ state.pageIndex = val
+ getListByPage()
+ }
+
+ // 查看记录
+ const viewRecord = (row) => {
+ state.details = row
+ state.dialogDetails = true
+ }
+
+ // 刷新
+ const reLoadData = async () =>{
+ getListByPage()
+ }
+ const editRecord = (index, row) => {
+ state.dialogAddRecord = true
+ state.chosenIndex = index
+ state.addRecord = JSON.parse(JSON.stringify(row))
+ }
+
+ // 新增修改记录
+ const confirmAddRecord = async (formEl: FormInstance | undefined) => {
+ if (!formEl) return
+ await formEl.validate(async (valid, fields) => {
+ if (valid) {
+ const data = {
+ name: state.addRecord.name,
+ info: state.addRecord.info,
+ startHour: Number(state.addRecord.startTime.substring(0, 2)),
+ startMin: Number(state.addRecord.startTime.substring(3)),
+ endHour: Number(state.addRecord.endTime.substring(0, 2)),
+ endMin: Number(state.addRecord.endTime.substring(3))
+ }
+ if (state.chosenIndex == null) {
+ // if (state.addRecord.startTime >= state.addRecord.endTime) {
+ // state.addRecord.endTime = '次日' + state.addRecord.endTime
+ // }
+ // state.tableData.unshift(data)
+ await addWorkTimePeriod(data)
+ } else {
+ // if (state.addRecord.startTime >= state.addRecord.endTime) {
+ // state.addRecord.endTime = '次日' + state.addRecord.endTime
+ // }
+ // state.tableData[state.chosenIndex] = state.addRecord
+ data.id = state.addRecord.id,
+ await editWorkTimePeriod(data)
+ }
+ state.dialogAddRecord = false
+ } else {
+ console.log('error submit!', fields)
+ }
+ })
+
+ }
+ const closeAdd = () => {
+ state.addRecord = {}
+ state.chosenIndex = null
+ }
+ const openAdd = () => {
+ if (state.chosenIndex == null) {
+ state.addRecord.info = ''
+ }
+ }
+ const indexClear = () => {
+ state.deleteId = null
+ }
+
+ // 折线图
+ const renderMenu = async (value: string) => {
+ Session.set('projectId', value)
+ userInfos.value.projectId = value
+ await initBackEndControlRoutes();
+ };
+ return {
+ addRef,
+ addRules,
+ View,
+ Edit,
+ Delete,
+ Refresh,
+ Plus,
+ toggleSelection,
+ handleSelectionChange,
+ deleteWorkTimePeriods,
+ searchRecord,
+ clearSearch,
+ viewRecord,
+ deleteRecord,
+ conFirmDelete,
+ getListByPage,
+ reLoadData,
+ deleteWorkTimePeriod,
+ handleSizeChange,
+ handleCurrentChange,
+ confirmAddRecord,
+ closeAdd,
+ openAdd,
+ indexClear,
+ editRecord,
+ ...toRefs(state)
+ };
+ }
+ }
+</script>
+
+<style scoped lang="scss">
+ $homeNavLengh: 8;
+ .home-container {
+ height: calc(100vh - 114px);
+ box-sizing: border-box;
+ overflow: hidden;
+ .homeCard{
+ width: 100%;
+ padding: 20px;
+ box-sizing: border-box;
+ background: #fff;
+ border-radius: 4px;
+
+ .main-card{
+ width: 100%;
+ height: 100%;
+ .cardTop{
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ margin-bottom: 20px;
+ .mainCardBtn{
+ margin: 0;
+ }
+ }
+ .pageBtn{
+ height: 60px;
+ display: flex;
+ align-items: center;
+ justify-content: right;
+
+ .demo-pagination-block + .demo-pagination-block {
+ margin-top: 10px;
+ }
+ .demo-pagination-block .demonstration {
+ margin-bottom: 16px;
+ }
+ }
+ }
+ &:last-of-type{
+ height: calc(100% - 100px);
+ }
+ }
+ .el-row{
+ display: flex;
+ align-items: center;
+ margin-bottom: 20px;
+ &:last-child {
+ margin-bottom: 0;
+ }
+ .grid-content{
+ align-items: center;
+ min-height: 36px;
+ }
+
+ .topInfo {
+ display: flex;
+ align-items: center;
+ font-size: 16px;
+ font-weight: bold;
+
+ &>div{
+ white-space: nowrap;
+ margin-right: 20px;
+ }
+ }
+ }
+ }
+ .el-input{
+ width: 100% !important;
+ }
+ .el-date-editor::v-deep{
+ width: 100%;
+ }
+ .el-select{
+ width: 100%;
+ }
+</style>
diff --git a/src/views/intellectInspect/inspectTaskManage/inspectTask/index.vue b/src/views/intellectInspect/inspectTaskManage/inspectTask/index.vue
index fe95193..3af583a 100644
--- a/src/views/intellectInspect/inspectTaskManage/inspectTask/index.vue
+++ b/src/views/intellectInspect/inspectTaskManage/inspectTask/index.vue
@@ -1,11 +1,953 @@
<template>
- <div>1235</div>
+ <div class="home-container">
+ <div style="height: 100%">
+ <el-row class="homeCard">
+ <el-col :span="12">
+ <div class="grid-content topInfo">
+ <el-select v-model="searchType" @change="changeSearch" placeholder="任务名称">
+ <el-option label="巡检任务类型" value="巡检任务类型" />
+ <el-option label="创建人" value="创建人" />
+ <el-option label="巡检班组" value="巡检班组" />
+ <el-option label="检查频次" value="检查频次" />
+ <el-option label="开始时间" value="开始时间" />
+ </el-select>
+ <el-input v-model="searchContent" v-if="searchType == '任务名称'" placeholder="请输入任务名称"></el-input>
+ <el-input
+ v-else-if="searchType == '检查频次'"
+ v-model="searchContent"
+ placeholder="请输入检查频次"
+ >
+ <template #append>
+ <el-select v-model="searchUnit" placeholder="选择单位">
+ <el-option label="分钟" value="分钟" />
+ <el-option label="小时" value="小时" />
+ <el-option label="天" value="天" />
+ </el-select>
+ </template>
+ </el-input>
+ <el-select v-model="searchContent" v-else-if="searchType == '巡检任务类型'" placeholder="请选择任务类型">
+ <el-option v-for="(item,index) in typeOptions" :label="item.name" :value="item.value" :key="index"/>
+ </el-select>
+ <el-select v-model="searchContent" v-else-if="searchType == '创建人'" placeholder="请选择创建人">
+ <el-option v-for="(item,index) in createrOptions" :label="item.name" :value="item.value" :key="index"/>
+ </el-select>
+ <el-select v-model="searchContent" v-else-if="searchType == '巡检班组'" placeholder="请选择巡检班组">
+ <el-option v-for="(item,index) in inspectorOptions" :label="item.name" :value="item.value" :key="index"/>
+ </el-select>
+ <el-date-picker
+ v-model="searchContent"
+ type="date"
+ v-else
+ :placeholder="'请选择' + searchType"
+ size="large"
+ style="margin-right: 20px"
+ />
+ <el-button type="primary">查询</el-button>
+ <el-button plain>重置</el-button>
+ </div>
+ </el-col>
+ </el-row>
+ <div class="homeCard">
+ <div class="main-card">
+ <el-row class="cardTop">
+ <el-col :span="12" class="mainCardBtn">
+ <el-button type="primary" :icon="Plus" size="default" @click="dialogAddRecord=true">新建</el-button>
+ <el-button type="danger" :icon="Delete" size="default" plain>删除</el-button>
+ </el-col>
+ <el-button type="primary" :icon="Refresh" size="default"/>
+ </el-row>
+ <el-table
+ ref="multipleTableRef"
+ :data="tableData"
+ style="width: 100%"
+ height="calc(100% - 100px)"
+ :header-cell-style="{background: '#fafafa'}"
+ @selection-change="handleSelectionChange"
+ >
+ <el-table-column type="selection" width="55" />
+ <el-table-column property="name" label="任务名称" width="200"/>
+ <el-table-column property="type" label="任务类型"/>
+ <el-table-column property="execClassgroup" label="巡检班组"/>
+ <el-table-column property="frequency" label="检查频次"/>
+ <el-table-column property="unit" label="频次单位"/>
+ <el-table-column property="chainLength" label="巡检链长度" width="160"/>
+ <el-table-column property="startTime" label="任务开始时间" width="180"/>
+<!-- <el-table-column property="validTime" label="任务有效时间" width="180"/>-->
+ <el-table-column property="creater" label="创建人"/>
+ <el-table-column property="createTime" label="创建时间" width="180"/>
+ <el-table-column property="status" label="状态" width="60"/>
+ <el-table-column fixed="right" label="操作" align="center" width="300">
+ <template #default="scope">
+ <el-button link type="primary" size="small" :icon="View" @click="viewRecord(scope.row)">查看</el-button>
+ <el-button link type="primary" size="small" :icon="Edit" @click="editRecord(scope.$index ,scope.row)">修改</el-button>
+ <el-switch
+ v-model="scope.row.status"
+ inline-prompt
+ active-text="开"
+ inactive-text="关"
+ active-value="开启"
+ inactive-value="关闭"
+ style="margin: 0 10px"
+ />
+ <el-button link type="danger" size="small" :icon="Delete" @click="deleteRecord(scope.$index)">删除</el-button>
+ </template>
+ </el-table-column>
+ </el-table>
+ <div class="pageBtn">
+ <el-pagination
+ v-model:currentPage="currentPage"
+ v-model:page-size="pageSize"
+ :page-sizes="[10, 15]"
+ small=false
+ background
+ layout="total, sizes, prev, pager, next, jumper"
+ :total="100"
+ @size-change="handleSizeChange"
+ @current-change="handleCurrentChange"
+ />
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <el-dialog v-model="dialogDetails" title="巡检任务">
+ <el-form :model="details" label-width="120px">
+ <el-row>
+ <el-col :span="12" style="margin-bottom: 20px">
+ <el-form-item label="任务名称">
+ <el-input
+ v-model="details.name"
+ readonly
+ />
+ </el-form-item>
+ </el-col>
+ <el-col :span="12" style="margin-bottom: 20px">
+ <el-form-item label="任务类型">
+ <el-input
+ v-model="details.type"
+ readonly
+ />
+ </el-form-item>
+ </el-col>
+ <el-col :span="12" style="margin-bottom: 20px">
+ <el-form-item label="巡检部门">
+ <el-input
+ v-model="details.execDepId"
+ readonly
+ />
+ </el-form-item>
+ </el-col>
+ <el-col :span="12" style="margin-bottom: 20px">
+ <el-form-item label="巡检班组">
+ <el-input
+ v-model="details.execClassgroup"
+ readonly
+ />
+ </el-form-item>
+ </el-col>
+ <el-col :span="12" style="margin-bottom: 20px">
+ <el-form-item label="检查频次" prop="frequency">
+ <el-input
+ v-model="details.frequency"
+ readonly
+ >
+ <template #append>
+ <el-input
+ v-model="details.unit"
+ readonly
+ />
+ </template>
+ </el-input>
+ </el-form-item>
+ </el-col>
+ <el-col :span="12" style="margin-bottom: 20px">
+ <el-form-item label="提前通知时间">
+ <el-input
+ v-model="details.noticeTime"
+ readonly
+ />
+ </el-form-item>
+ </el-col>
+ <el-col :span="12" style="margin-bottom: 20px">
+ <el-form-item label="任务开始时间">
+ <el-input
+ v-model="details.startTime"
+ readonly
+ />
+ </el-form-item>
+ </el-col>
+ <el-col :span="12" style="margin-bottom: 20px">
+ <el-form-item label="周期有效时间">
+ <el-input
+ v-model="details.validTime"
+ readonly
+ />
+ </el-form-item>
+ </el-col>
+ <el-col :span="24" style="margin-bottom: 20px">
+ <el-form-item label="巡检链">
+ <div style="width: 100%;margin-left: -30px">
+ <div v-for="(item,index) in details.shiftSteps" class="stepItem">
+ <div class="stepNum">{{index+1}}</div>
+ <div class="stepCard">
+ <el-card class="box-card">
+ <template #header>
+ <div class="card-header">
+ <div>{{item.pointId}}</div>
+ </div>
+ </template>
+ <div class="text item">所属设备区域:<span>{{item.regionUuid}}</span></div>
+ <div class="text item">关联RFID:<span>{{item.rfidId}}</span></div>
+ <div class="text item">巡检指标:<span>{{item.quotaId}}</span></div>
+ <div class="text item">数据填报类型:<span>{{item.dataReportType}}</span></div>
+ <div class="text item">数据参考值:<span>{{item.firstReferenceValue?item.firstReferenceValue:(item.secondReferenceValue?item.secondReferenceValue:item.thirdReferenceValue)}}</span></div>
+ </el-card>
+ </div>
+ </div>
+ </div>
+ </el-form-item>
+ </el-col>
+ <el-form-item>
+ <el-button type="primary" @click="dialogDetails = false" size="default">确认</el-button>
+ </el-form-item>
+ </el-row>
+ </el-form>
+ </el-dialog>
+
+ <el-dialog v-model="dialogAddRecord" title="巡检任务编辑" @close="closeAdd" @open="openAdd">
+ <el-form :model="addRecord" label-width="120px" ref="addRef" :rules="addRules">
+ <el-row>
+ <el-col :span="12" style="margin-bottom: 20px">
+ <el-form-item label="任务名称" prop="name">
+ <el-input
+ v-model="addRecord.name"
+ >
+ </el-input>
+ </el-form-item>
+ </el-col>
+ <el-col :span="12" style="margin-bottom: 20px">
+ <el-form-item label="任务类型" prop="type">
+ <el-select v-model="addRecord.type">
+ <el-option label="日常检查" value="日常检查" />
+ <el-option label="周期检查" value="周期检查" />
+ </el-select>
+ </el-form-item>
+ </el-col>
+ <el-col :span="12" style="margin-bottom: 20px">
+ <el-form-item label="巡检部门" prop="validTime">
+ <el-select v-model="addRecord.execDepId" placeholder="请选择">
+ <el-option label="部门一" value="部门一" />
+ <el-option label="部门二" value="部门二" />
+ </el-select>
+ </el-form-item>
+ </el-col>
+ <el-col :span="12" style="margin-bottom: 20px">
+ <el-form-item label="巡检班组" prop="execClassgroupId">
+ <el-select v-model="addRecord.execClassgroup" placeholder="请选择">
+ <el-option label="班组1" value="班组1" />
+ <el-option label="班组2" value="班组2" />
+ <el-option label="班组3" value="班组3" />
+ </el-select>
+ </el-form-item>
+ </el-col>
+ <el-col :span="12" style="margin-bottom: 20px">
+ <el-form-item label="检查频次" prop="frequency">
+ <el-input
+ v-model="addRecord.frequency"
+ placeholder="请输入检查频次"
+ >
+ <template #append>
+ <el-select v-model="addRecord.unit" placeholder="选择单位">
+ <el-option label="分钟" value="分钟" />
+ <el-option label="小时" value="小时" />
+ <el-option label="天" value="天" />
+ </el-select>
+ </template>
+ </el-input>
+ </el-form-item>
+ </el-col>
+ <el-col :span="12" style="margin-bottom: 20px">
+ <el-form-item label="提前通知时间" prop="noticeTime">
+ <el-select v-model="addRecord.noticeTime" placeholder="选择时间">
+ <el-option label="15分钟" value="15分钟" />
+ <el-option label="30分钟" value="30分钟" />
+ <el-option label="45分钟" value="45分钟" />
+ <el-option label="60分钟" value="60分钟" />
+ <el-option label="75分钟" value="75分钟" />
+ <el-option label="90分钟" value="90分钟" />
+ </el-select>
+ </el-form-item>
+ </el-col>
+ <el-col :span="12" style="margin-bottom: 20px">
+ <el-form-item label="周期开始时间" prop="startTime">
+ <el-date-picker
+ v-model="addRecord.startTime"
+ type="datetime"
+ format="YYYY/MM/DD HH:mm:ss" value-format="YYYY-MM-DD HH:mm:ss"
+ />
+ </el-form-item>
+ </el-col>
+ <el-col :span="12" style="margin-bottom: 20px">
+ <el-form-item label="任务有效时间" prop="validTime">
+ <el-select v-model="addRecord.validTime" placeholder="选择时间">
+ <el-option label="15分钟" value="15分钟" />
+ <el-option label="30分钟" value="30分钟" />
+ <el-option label="45分钟" value="45分钟" />
+ <el-option label="60分钟" value="60分钟" />
+ <el-option label="75分钟" value="75分钟" />
+ <el-option label="90分钟" value="90分钟" />
+ </el-select>
+ </el-form-item>
+ </el-col>
+ <el-col :span="24">
+ <el-form-item label="创建巡检链">
+ <div style="width: 100%;margin-bottom: 20px">
+ <el-button type="primary" :icon="Plus" size="default" @click="dialogAddShift = true">新增巡检点</el-button>
+ </div>
+ <div style="width: 100%;margin-left: -30px">
+ <div v-for="(item,index) in addRecord.shiftSteps" class="stepItem">
+ <div class="stepNum">{{index+1}}</div>
+ <div class="stepCard">
+ <el-card class="box-card">
+ <template #header>
+ <div class="card-header">
+ <div>{{item.pointId}}</div>
+ </div>
+ </template>
+ <div class="text item">所属设备区域:<span>{{item.regionUuid}}</span></div>
+ <div class="text item">关联RFID:<span>{{item.rfidId}}</span></div>
+ <div class="text item">巡检指标:<span>{{item.quotaId}}</span></div>
+ <div class="text item">数据填报类型:<span>{{item.dataReportType}}</span></div>
+ <div class="text item">数据参考值:<span>{{item.firstReferenceValue?item.firstReferenceValue:(item.secondReferenceValue?item.secondReferenceValue:item.thirdReferenceValue)}}</span></div>
+ </el-card>
+ </div>
+ <div>
+<!-- <el-button type="primary" size="default" @click="addFlow(index)">新增下一区域</el-button>-->
+ <el-button type="primary" size="default" @click="editFlow(index)">修改</el-button>
+ <el-button type="danger" size="default" @click="deleteFlow(index)">删除</el-button>
+ </div>
+ </div>
+ </div>
+ </el-form-item>
+ </el-col>
+ </el-row>
+ <el-form-item>
+ <el-button type="warning" @click="dialogAddRecord = false" size="default" plain>取消</el-button>
+ <el-button type="primary" @click="confirmAddRecord(addRef)" size="default">确认</el-button>
+ </el-form-item>
+ </el-form>
+ </el-dialog>
+ <el-dialog v-model="deleteDialog" title="提示" width="30%" center @close="indexClear">
+ <span>您确定要删除该条记录吗?</span>
+ <template #footer>
+ <span class="dialog-footer">
+ <el-button @click="deleteDialog = false" size="default">取消</el-button>
+ <el-button type="primary" @click="conFirmDelete" size="default">确认</el-button>
+ </span>
+ </template>
+ </el-dialog>
+ <el-dialog v-model="deleteShiftDialog" title="提示" width="30%" center @close="indexShiftClear">
+ <span>您确定要删除该巡检点吗?</span>
+ <template #footer>
+ <span class="dialog-footer">
+ <el-button @click="deleteShiftDialog = false" size="default">取消</el-button>
+ <el-button type="primary" @click="conFirmShiftDelete" size="default">确认</el-button>
+ </span>
+ </template>
+ </el-dialog>
+ <el-dialog v-model="dialogAddShift" title="新增巡检点" @close="closeAddShift">
+ <el-form :model="addShift" label-width="120px" ref="addShiftRef" :rules="addShiftRules">
+ <el-form-item label="选择巡检点" prop="pointId">
+ <el-select v-model="addShift.pointId">
+ <el-option label="73011" value="73011" />
+ <el-option label="73012" value="73012" />
+ </el-select>
+ </el-form-item>
+ <el-form-item label="所属设备区域">
+ <el-input
+ v-model="addShift.regionId"
+ readonly
+ />
+ </el-form-item>
+ <el-form-item label="关联RFID">
+ <el-input
+ v-model="addShift.rfidId"
+ readonly
+ />
+ </el-form-item>
+ <el-form-item label="选择巡检指标" prop="quotaId">
+ <el-input v-model="addShift.quotaId" placeholder="Please input">
+ <template #append>{{addShift.quotaUnit}}</template>
+ </el-input>
+ </el-form-item>
+ <el-form-item label="数据填报类型" prop="dataReportType">
+ <el-select v-model="addShift.dataReportType">
+ <el-option label="选择" value="选择" />
+ <el-option label="填空" value="填空" />
+ <el-option label="选择并填空" value="选择并填空" />
+ </el-select>
+ </el-form-item>
+ <el-form-item v-if="addShift.dataReportType == '选择' || addShift.dataReportType == '选择并填空'" label="数据参考值" prop="firstReferenceValue">
+ <el-select v-model="addShift.firstReferenceValue">
+ <el-option label="正常" value="正常" />
+ <el-option label="异常" value="异常" />
+ </el-select>
+ </el-form-item>
+ <el-form-item v-if="addShift.dataReportType == '填空' || addShift.dataReportType == '选择并填空'" label="数据参考值">
+ <el-input
+ v-model="addShift.secondReferenceValue"
+ type="number"
+ placeholder="请根据需求选择前方符号后再填写参考值,非必填"
+ >
+ <template #prepend>
+ <el-select v-model="addShift.secondReferenceSign" placeholder="Select" style="width: 115px">
+ <el-option label=">" value=">" />
+ <el-option label=">=" value=">=" />
+ </el-select>
+ </template>
+ </el-input>
+ </el-form-item>
+ <el-form-item v-if="addShift.dataReportType == '填空' || addShift.dataReportType == '选择并填空'" label="">
+ <el-input
+ v-model="addShift.thirdReferenceValue"
+ type="number"
+ placeholder="请根据需求选择前方符号后再填写参考值,非必填"
+ >
+ <template #prepend>
+ <el-select v-model="addShift.thirdReferenceSign" placeholder="Select" style="width: 115px">
+ <el-option label="<" value="<"/>
+ <el-option label="<=" value="<="/>
+ </el-select>
+ </template>
+ </el-input>
+ </el-form-item>
+ <el-form-item>
+ <el-button type="warning" @click="dialogAddShift = false" size="default" plain>取消</el-button>
+ <el-button type="primary" @click="confirmAddShift(addShiftRef)" size="default">确认</el-button>
+ </el-form-item>
+ </el-form>
+ </el-dialog>
+ </div>
</template>
-<script>
-export default {
- name: 'index'
-};
+<script lang="ts">
+ import { toRefs, reactive, ref } from 'vue';
+ import { storeToRefs } from 'pinia';
+ import { initBackEndControlRoutes } from '/@/router/backEnd';
+ import {useUserInfo} from "/@/stores/userInfo";
+ import { Session } from '/@/utils/storage';
+ import { Edit, View, Plus, Delete, Refresh, Search, Download } from '@element-plus/icons-vue'
+ import { ElTable, ElMessage } from 'element-plus'
+ import { FormInstance, FormRules } from 'element-plus'
+ let global: any = {
+ homeChartOne: null,
+ homeChartTwo: null,
+ homeCharThree: null,
+ dispose: [null, '', undefined],
+ };
+
+ interface stateType {
+ homeOne: Array <type>
+ }
+ interface type {
+
+ }
+ export default {
+ name: 'workingHoursSet',
+ components: {},
+ setup() {
+ const userInfo = useUserInfo()
+ const {userInfos} = storeToRefs(userInfo);
+
+ const state = reactive({
+ searchType: '任务名称',
+ typeOptions: [
+ {
+ name: '日常检查',
+ value: '日常检查'
+ },
+ {
+ name: '周期检查',
+ value: '周期检查'
+ }
+ ],
+ createrOptions: [
+ {
+ name: '张三',
+ value: '张三'
+ },
+ {
+ name: '李四',
+ value: '李四'
+ }
+ ],
+ inspectorOptions: [
+ {
+ name: '李四',
+ value: '李四'
+ },
+ {
+ name: '张三',
+ value: '张三'
+ }
+ ],
+ searchUnit: '小时',
+ searchContent: '',
+ currentPage: 1,
+ pageSize: 10,
+ chosenIndex: null,
+ chosenShiftIndex: null,
+ chosenInspectionIndex: null,
+ dialogDetails: false,
+ dialogAddRecord: false,
+ deleteDialog: false,
+ deleteShiftDialog: false,
+ deleteInspectionDialog: false,
+ dialogAddShift: false,
+ tableData: [
+ {
+ name: '甲醛装置()列现场岗位巡检',
+ type: '周期检查',
+ creater: '管理员A',
+ execClassgroup: '张三',
+ frequency: 2,
+ unit: '小时',
+ noticeTime: '2022-07-02 13:01:37',
+ startTime: '2022-07-02 13:01:37',
+ validTime: '30分钟',
+ createTime: '2022-07-02 12:03:47',
+ chainLength: 20,
+ status: '开启',
+ shiftSteps: [
+ {
+ pointId: 73011,
+ regionUuid: '风机系统',
+ rfidId: 21054,
+ quotaId: '压力',
+ dataReportType: '选择'
+ },
+ {
+ name: 'A场所',
+ inspectorData: [
+ {
+ sort: 1,
+ name: '73021',
+ section: '风机系统',
+ rfid: '风机系统1标签',
+ norm: '风机声音',
+ reference: '10<正常<50'
+ },
+ {
+ sort: 2,
+ name: '73022',
+ section: '风机系统',
+ rfid: '风机系统2标签',
+ norm: '设备温度',
+ reference: '20<正常<50'
+ },
+ {
+ sort: 3,
+ name: '73023',
+ section: '风机系统',
+ rfid: '风机系统3标签',
+ norm: '风机震动',
+ reference: '30<正常<50'
+ }
+ ]
+ }
+ ]
+ },
+ {
+ name: 'A车间日常巡检',
+ type: '日常检查',
+ creater: '管理员B',
+ execClassgroup: '李四',
+ frequency: 4,
+ unit: '小时',
+ noticeTime: '2022-07-02 13:01:37',
+ startTime: '2022-07-02 12:45:37',
+ validTime: '30分钟',
+ createTime: '2022-07-02 08:15:41',
+ chainLength: 15,
+ status: '开启'
+ }
+ ],
+ addRecord: {
+ name: '',
+ type: '',
+ creater: '',
+ inspector: '',
+ frequency: 1,
+ unit: '小时',
+ startTime: '',
+ validTime: '',
+ createTime: '',
+ chainLength: 0,
+ status: '开启',
+ shiftSteps: []
+ },
+ addShift: {
+ secondReferenceSign: '>',
+ thirdReferenceSign: '<'
+ },
+ details: {}
+ })
+
+ // 顶部筛选搜索
+ const changeSearch = () => {
+ state.searchContent = ''
+ }
+
+ const handleSizeChange = (val: number) => {
+ console.log(`${val} items per page`)
+ }
+ const handleCurrentChange = (val: number) => {
+ console.log(`current page: ${val}`)
+ }
+
+ // 时间格式化
+ const timeForm = {
+ hour12: false,
+ year: 'numeric',
+ month: '2-digit',
+ day: '2-digit',
+ hour: '2-digit',
+ minute: '2-digit',
+ second: '2-digit'
+ }
+ const handleChange = (value) => {
+ state.addRecord.content = []
+ console.log(JSON.parse(JSON.stringify(value)))
+ }
+ const addRef = ref<FormInstance>()
+ const addShiftRef = ref<FormInstance>()
+ const addInspectionRef = ref<FormInstance>()
+
+ // 表单校验
+ const addRules = reactive<FormRules>({
+ name: [{required: true, message: '该内容不能为空', trigger: 'blur'}],
+ type: [{required: true, message: '该内容不能为空', trigger: 'blur'}],
+ execClassgroupId: [{required: true, message: '该内容不能为空', trigger: 'blur'}],
+ frequency: [{required: true, message: '该内容不能为空', trigger: 'blur'}],
+ unit: [{required: true, message: '该内容不能为空', trigger: 'blur'}],
+ noticeTime: [{required: true, message: '该内容不能为空', trigger: 'blur'}],
+ startTime: [{required: true, message: '该内容不能为空', trigger: 'blur'}],
+ validTime: [{required: true, message: '该内容不能为空', trigger: 'blur'}]
+ })
+ const addShiftRules = reactive<FormRules>({
+ pointId: [{required: true, message: '该内容不能为空', trigger: 'blur'}],
+ quotaId: [{required: true, message: '该内容不能为空', trigger: 'blur'}],
+ dataReportType: [{required: true, message: '该内容不能为空', trigger: 'blur'}],
+ firstReferenceValue: [{required: true, message: '该内容不能为空', trigger: 'blur'}]
+ })
+
+ // 查看记录
+ const viewRecord = (row) => {
+ state.details = JSON.parse(JSON.stringify(row))
+ state.dialogDetails = true
+ }
+
+ // 删除记录
+ const deleteRecord = (index) => {
+ state.chosenIndex = index
+ state.deleteDialog = true
+ }
+ const conFirmDelete = () => {
+ state.tableData.splice(state.chosenIndex, 1)
+ state.deleteDialog = false
+ }
+
+ // 修改添加记录
+ const editRecord = (index, row) => {
+ state.chosenIndex = index
+ state.dialogAddRecord = true
+ state.addRecord = JSON.parse(JSON.stringify(row))
+ }
+ const confirmAddRecord = async (formEl: FormInstance | undefined) => {
+ if (!formEl) return
+ await formEl.validate((valid, fields) => {
+ if (valid) {
+ if (state.chosenIndex == null) {
+ if (!state.addRecord.shiftSteps || state.addRecord.shiftSteps.length == 0) {
+ ElMessage({
+ message: '请先设置巡检链后再提交',
+ type: 'warning',
+ })
+ return
+ } else {
+ state.addRecord.createTime = new Date().toLocaleString('zh', timeForm).replace(/\//g, '-')
+ state.addRecord.chainLength = state.addRecord.shiftSteps.length
+ state.addRecord.status = '开启'
+ state.tableData.unshift(state.addRecord)
+ }
+ } else {
+ if (state.addRecord.shiftSteps.length == 0) {
+ ElMessage({
+ message: '请先设置巡检链后再提交',
+ type: 'warning',
+ })
+ return
+ } else {
+ state.tableData[state.chosenIndex] = state.addRecord
+ }
+ }
+ state.dialogAddRecord = false
+ } else {
+ console.log('error submit!', fields)
+ }
+ })
+
+ }
+
+ // 添加弹窗打开前预操作
+ const openAdd = () => {
+ state.addRecord.unit = '小时'
+ }
+
+ // 弹窗关闭后判断数据初始化
+ const closeAdd = () => {
+ state.addRecord = {}
+ state.chosenIndex = null
+ state.addShift = {}
+ state.chosenShiftIndex = null
+ }
+ const indexClear = () => {
+ state.chosenIndex = null
+ }
+ const indexShiftClear = () => {
+ state.chosenShiftIndex = null
+ }
+
+ // 排序
+ // function compare(key) {
+ // return function (value1, value2) {
+ // var val1 = value1[key];
+ // var val2 = value2[key];
+ // return val1 - val2;
+ // }
+ // }
+
+ // 添加删除巡检设施区域
+ // const addFlow = (index) => {
+ // state.dialogAddShift = true
+ // state.chosenShiftIndex = index
+ // }
+
+ // 编辑巡检点
+ const editFlow = (index) =>{
+ state.chosenShiftIndex = index
+ state.addShift = JSON.parse(JSON.stringify(state.addRecord.shiftSteps[index]))
+ state.dialogAddShift = true
+ }
+
+ // 删除巡检点
+ const deleteFlow = (index) => {
+ state.deleteShiftDialog = true
+ state.chosenShiftIndex = index
+ }
+ const conFirmShiftDelete = () => {
+ state.addRecord.shiftSteps.splice(state.chosenShiftIndex, 1)
+ state.deleteShiftDialog = false
+ }
+ // 增加修改巡检点
+ const confirmAddShift = async (formEl: FormInstance | undefined) => {
+ if (!formEl) return
+ await formEl.validate((valid, fields) => {
+ if (valid) {
+ if(state.chosenShiftIndex == null){
+ if(!state.addRecord.shiftSteps){state.addRecord.shiftSteps = []}
+ state.addRecord.shiftSteps.push(state.addShift)
+ }else{
+ state.addRecord.shiftSteps[state.chosenShiftIndex] = state.addShift
+ }
+ state.dialogAddShift = false
+ } else {
+ console.log('error submit!', fields)
+ }
+ })
+ }
+
+ const closeAddShift = () => {
+ state.addShift = {}
+ state.chosenShiftIndex = null
+ }
+
+ // 折线图
+ const renderMenu = async (value: string) => {
+ Session.set('projectId', value)
+ userInfos.value.projectId = value
+ await initBackEndControlRoutes();
+ };
+
+ return {
+ addRef,
+ addShiftRef,
+ addInspectionRef,
+ addRules,
+ addShiftRules,
+ View,
+ Edit,
+ Delete,
+ Refresh,
+ Plus,
+ changeSearch,
+ handleSizeChange,
+ handleCurrentChange,
+ handleChange,
+ viewRecord,
+ deleteRecord,
+ conFirmDelete,
+ openAdd,
+ editRecord,
+ confirmAddRecord,
+ closeAdd,
+ conFirmShiftDelete,
+ confirmAddShift,
+ closeAddShift,
+ editFlow,
+ deleteFlow,
+ indexClear,
+ indexShiftClear,
+ renderMenu,
+ ...toRefs(state)
+ }
+ }
+ }
</script>
-<style scoped></style>
+<style scoped lang="scss">
+ $homeNavLengh: 8;
+ .home-container {
+ height: calc(100vh - 114px);
+ box-sizing: border-box;
+ overflow: hidden;
+ .homeCard{
+ width: 100%;
+ padding: 20px;
+ box-sizing: border-box;
+ background: #fff;
+ border-radius: 4px;
+
+ .main-card{
+ width: 100%;
+ height: 100%;
+ .cardTop{
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ margin-bottom: 20px;
+ .mainCardBtn{
+ margin: 0;
+ }
+ }
+ .pageBtn{
+ height: 60px;
+ display: flex;
+ align-items: center;
+ justify-content: right;
+
+ .demo-pagination-block + .demo-pagination-block {
+ margin-top: 10px;
+ }
+ .demo-pagination-block .demonstration {
+ margin-bottom: 16px;
+ }
+ }
+ }
+ &:last-of-type{
+ height: calc(100% - 100px);
+ }
+ }
+ .el-row{
+ display: flex;
+ align-items: center;
+ margin-bottom: 20px;
+ &:last-child {
+ margin-bottom: 0;
+ }
+ .grid-content{
+ align-items: center;
+ min-height: 36px;
+ }
+
+ .topInfo {
+ display: flex;
+ align-items: center;
+ font-size: 16px;
+ font-weight: bold;
+
+ &>div{
+ white-space: nowrap;
+ margin-right: 20px;
+ }
+ }
+ }
+ }
+ .stepItem{
+ width: 100%;
+ display: flex;
+ align-items: flex-start;
+ margin-bottom: 30px;
+ margin-left: 30px;
+ padding-bottom: 30px;
+ border-left: 2px solid #ccc;
+ &:first-of-type{
+ margin-top: 30px;
+ }
+ &:last-of-type{
+ margin-bottom: 0;
+ border-left: none;
+ }
+ .stepNum {
+ width: 30px;
+ height: 30px;
+ border-radius: 15px;
+ box-sizing: border-box;
+ color: #333;
+ border: 1px solid #999;
+ line-height: 28px;
+ text-align: center;
+ margin-right: 10px;
+ margin-left: -16px;
+ margin-top: -30px;
+ }
+ .stepCard {
+ width: 100%;
+ margin-top: -30px;
+
+ .box-card {
+ width: 100%;
+ &:deep(.el-card__header){
+ padding: 10px 15px
+ }
+ .card-header {
+ width: 100%;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ &>div:first-of-type{
+ margin-right: 80px;
+ font-size: 18px;
+ font-weight: bold;
+ }
+ }
+ }
+ }
+ &:hover .card-header{
+ color: #0098F5;
+ }
+ &:hover .stepNum{
+ border: 2px solid #0098F5;
+ color: #0098F5;
+ }
+ }
+ .el-input{
+ width: 100% !important;
+ }
+ :deep(.el-date-editor){
+ width: 100%;
+ }
+ .el-select{
+ width: 100%;
+ }
+</style>
diff --git a/src/views/riskWarningSys/accidentLevel/index.vue b/src/views/riskWarningSys/accidentLevel/index.vue
index a876414..0fecae2 100644
--- a/src/views/riskWarningSys/accidentLevel/index.vue
+++ b/src/views/riskWarningSys/accidentLevel/index.vue
@@ -1,6 +1,6 @@
<template>
<div class="home-container">
- <el-scrollbar height="100%">
+ <div style="height: 100%">
<div class="homeCard">
<div class="main-card">
<el-row class="cardTop">
@@ -15,6 +15,7 @@
ref="multipleTableRef"
:data="tableData"
style="width: 100%"
+ height="calc(100% - 100px)"
:header-cell-style="{background: '#fafafa'}"
@selection-change="handleSelectionChange"
>
@@ -36,22 +37,22 @@
</template>
</el-table-column>
</el-table>
- </div>
- <div class="pageBtn">
- <el-pagination
- v-model:currentPage="currentPage"
- v-model:page-size="pageSize"
- :page-sizes="[10, 15]"
- small=false
- background
- layout="total, sizes, prev, pager, next, jumper"
- :total="100"
- @size-change="handleSizeChange"
- @current-change="handleCurrentChange"
- />
+ <div class="pageBtn">
+ <el-pagination
+ v-model:currentPage="currentPage"
+ v-model:page-size="pageSize"
+ :page-sizes="[10, 15]"
+ small=false
+ background
+ layout="total, sizes, prev, pager, next, jumper"
+ :total="100"
+ @size-change="handleSizeChange"
+ @current-change="handleCurrentChange"
+ />
+ </div>
</div>
</div>
- </el-scrollbar>
+ </div>
<el-dialog v-model="dialogDetails" title="查看详情">
<el-form :model="details" label-width="120px">
<el-form-item label="所属月份">
@@ -264,7 +265,7 @@
)
const addRef = ref<FormInstance>()
const addRules = reactive<FormRules>({
- month:[{required: true, message: '该内容不能为空'}],
+ month:[{required: true, message: '该内容不能为空',trigger:'blur'}],
level:[{required: true, message: '该内容不能为空',trigger:'blur'}],
amount:[{required: true, message: '该内容不能为空',trigger:'blur'}],
death:[{required: true, message: '该内容不能为空',trigger:'blur'}],
@@ -330,14 +331,48 @@
<style scoped lang="scss">
$homeNavLengh: 8;
.home-container {
- height: 100%;
+ height: calc(100vh - 114px);
+ box-sizing: border-box;
overflow: hidden;
- padding: 20px;
+
.homeCard{
width: 100%;
padding: 20px;
+ box-sizing: border-box;
background: #fff;
border-radius: 4px;
+
+ .main-card{
+ width: 100%;
+ height: 100%;
+ .cardTop{
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ margin-bottom: 20px;
+ .mainCardBtn{
+ margin: 0;
+ }
+ }
+ .pageBtn{
+ height: 60px;
+ display: flex;
+ align-items: center;
+ justify-content: right;
+
+ .demo-pagination-block + .demo-pagination-block {
+ margin-top: 10px;
+ }
+ .demo-pagination-block .demonstration {
+ margin-bottom: 16px;
+ }
+ }
+ }
+
+ &:last-of-type{
+ height: 100%;
+ }
+
}
.el-row{
display: flex;
@@ -361,37 +396,6 @@
white-space: nowrap;
margin-right: 20px;
}
- }
- }
- .mainPages{
- height: 100%;
- display: flex;
- flex-direction: column;
- justify-content: space-between;
- }
- .main-card{
- width: 100%;
- .cardTop{
- display: flex;
- align-items: center;
- justify-content: space-between;
- margin-bottom: 20px;
- .mainCardBtn{
- margin: 0;
- }
- }
- }
- .pageBtn{
- display: flex;
- align-items: center;
- justify-content: right;
- margin-top: 20px;
-
- .demo-pagination-block + .demo-pagination-block {
- margin-top: 10px;
- }
- .demo-pagination-block .demonstration {
- margin-bottom: 16px;
}
}
}
diff --git a/src/views/riskWarningSys/educationAndTraining/index.vue b/src/views/riskWarningSys/educationAndTraining/index.vue
index 39b1979..54ddaf0 100644
--- a/src/views/riskWarningSys/educationAndTraining/index.vue
+++ b/src/views/riskWarningSys/educationAndTraining/index.vue
@@ -1,6 +1,6 @@
<template>
<div class="home-container">
- <el-scrollbar height="100%">
+ <div style="height: 100%">
<div class="homeCard">
<div class="main-card">
<el-row class="cardTop">
@@ -15,6 +15,7 @@
ref="multipleTableRef"
:data="tableData"
style="width: 100%"
+ height="calc(100% - 100px)"
:header-cell-style="{background: '#fafafa'}"
@selection-change="handleSelectionChange"
>
@@ -33,22 +34,22 @@
</template>
</el-table-column>
</el-table>
- </div>
- <div class="pageBtn">
- <el-pagination
- v-model:currentPage="currentPage"
- v-model:page-size="pageSize"
- :page-sizes="[10, 15]"
- small=false
- background
- layout="total, sizes, prev, pager, next, jumper"
- :total="100"
- @size-change="handleSizeChange"
- @current-change="handleCurrentChange"
- />
+ <div class="pageBtn">
+ <el-pagination
+ v-model:currentPage="currentPage"
+ v-model:page-size="pageSize"
+ :page-sizes="[10, 15]"
+ small=false
+ background
+ layout="total, sizes, prev, pager, next, jumper"
+ :total="100"
+ @size-change="handleSizeChange"
+ @current-change="handleCurrentChange"
+ />
+ </div>
</div>
</div>
- </el-scrollbar>
+ </div>
<el-dialog v-model="dialogDetails" title="查看详情">
<el-form :model="details" label-width="120px">
<el-form-item label="所属月份">
@@ -203,7 +204,7 @@
)
const addRef = ref<FormInstance>()
const addRules = reactive<FormRules>({
- month:[{required: true, message: '该内容不能为空'}],
+ month:[{required: true, message: '该内容不能为空',trigger:'blur'}],
level:[{required: true, message: '该内容不能为空',trigger:'blur'}],
amount:[{required: true, message: '该内容不能为空',trigger:'blur'}],
eduTime:[{required: true, message: '该内容不能为空',trigger:'blur'}]
@@ -266,14 +267,48 @@
<style scoped lang="scss">
$homeNavLengh: 8;
.home-container {
- height: 100%;
+ height: calc(100vh - 114px);
+ box-sizing: border-box;
overflow: hidden;
- padding: 20px;
+
.homeCard{
width: 100%;
padding: 20px;
+ box-sizing: border-box;
background: #fff;
border-radius: 4px;
+
+ .main-card{
+ width: 100%;
+ height: 100%;
+ .cardTop{
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ margin-bottom: 20px;
+ .mainCardBtn{
+ margin: 0;
+ }
+ }
+ .pageBtn{
+ height: 60px;
+ display: flex;
+ align-items: center;
+ justify-content: right;
+
+ .demo-pagination-block + .demo-pagination-block {
+ margin-top: 10px;
+ }
+ .demo-pagination-block .demonstration {
+ margin-bottom: 16px;
+ }
+ }
+ }
+
+ &:last-of-type{
+ height: 100%;
+ }
+
}
.el-row{
display: flex;
@@ -297,37 +332,6 @@
white-space: nowrap;
margin-right: 20px;
}
- }
- }
- .mainPages{
- height: 100%;
- display: flex;
- flex-direction: column;
- justify-content: space-between;
- }
- .main-card{
- width: 100%;
- .cardTop{
- display: flex;
- align-items: center;
- justify-content: space-between;
- margin-bottom: 20px;
- .mainCardBtn{
- margin: 0;
- }
- }
- }
- .pageBtn{
- display: flex;
- align-items: center;
- justify-content: right;
- margin-top: 20px;
-
- .demo-pagination-block + .demo-pagination-block {
- margin-top: 10px;
- }
- .demo-pagination-block .demonstration {
- margin-bottom: 16px;
}
}
}
diff --git a/src/views/riskWarningSys/emergencyDrills/index.vue b/src/views/riskWarningSys/emergencyDrills/index.vue
index 76722d5..d3e372d 100644
--- a/src/views/riskWarningSys/emergencyDrills/index.vue
+++ b/src/views/riskWarningSys/emergencyDrills/index.vue
@@ -1,6 +1,6 @@
<template>
<div class="home-container">
- <el-scrollbar height="100%">
+ <div style="height: 100%">
<div class="homeCard">
<div class="main-card">
<el-row class="cardTop">
@@ -15,6 +15,7 @@
ref="multipleTableRef"
:data="tableData"
style="width: 100%"
+ height="calc(100% - 100px)"
:header-cell-style="{background: '#fafafa'}"
@selection-change="handleSelectionChange"
>
@@ -33,22 +34,22 @@
</template>
</el-table-column>
</el-table>
- </div>
- <div class="pageBtn">
- <el-pagination
- v-model:currentPage="currentPage"
- v-model:page-size="pageSize"
- :page-sizes="[10, 15]"
- small=false
- background
- layout="total, sizes, prev, pager, next, jumper"
- :total="100"
- @size-change="handleSizeChange"
- @current-change="handleCurrentChange"
- />
+ <div class="pageBtn">
+ <el-pagination
+ v-model:currentPage="currentPage"
+ v-model:page-size="pageSize"
+ :page-sizes="[10, 15]"
+ small=false
+ background
+ layout="total, sizes, prev, pager, next, jumper"
+ :total="100"
+ @size-change="handleSizeChange"
+ @current-change="handleCurrentChange"
+ />
+ </div>
</div>
</div>
- </el-scrollbar>
+ </div>
<el-dialog v-model="dialogDetails" title="查看详情">
<el-form :model="details" label-width="120px">
<el-form-item label="所属月份">
@@ -202,7 +203,7 @@
)
const addRef = ref<FormInstance>()
const addRules = reactive<FormRules>({
- month:[{required: true, message: '该内容不能为空'}],
+ month:[{required: true, message: '该内容不能为空',trigger:'blur'}],
level:[{required: true, message: '该内容不能为空',trigger:'blur'}],
amount:[{required: true, message: '该内容不能为空',trigger:'blur'}],
aftTime:[{required: true, message: '该内容不能为空',trigger:'blur'}]
@@ -265,14 +266,48 @@
<style scoped lang="scss">
$homeNavLengh: 8;
.home-container {
- height: 100%;
+ height: calc(100vh - 114px);
+ box-sizing: border-box;
overflow: hidden;
- padding: 20px;
+
.homeCard{
width: 100%;
padding: 20px;
+ box-sizing: border-box;
background: #fff;
border-radius: 4px;
+
+ .main-card{
+ width: 100%;
+ height: 100%;
+ .cardTop{
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ margin-bottom: 20px;
+ .mainCardBtn{
+ margin: 0;
+ }
+ }
+ .pageBtn{
+ height: 60px;
+ display: flex;
+ align-items: center;
+ justify-content: right;
+
+ .demo-pagination-block + .demo-pagination-block {
+ margin-top: 10px;
+ }
+ .demo-pagination-block .demonstration {
+ margin-bottom: 16px;
+ }
+ }
+ }
+
+ &:last-of-type{
+ height: 100%;
+ }
+
}
.el-row{
display: flex;
@@ -296,37 +331,6 @@
white-space: nowrap;
margin-right: 20px;
}
- }
- }
- .mainPages{
- height: 100%;
- display: flex;
- flex-direction: column;
- justify-content: space-between;
- }
- .main-card{
- width: 100%;
- .cardTop{
- display: flex;
- align-items: center;
- justify-content: space-between;
- margin-bottom: 20px;
- .mainCardBtn{
- margin: 0;
- }
- }
- }
- .pageBtn{
- display: flex;
- align-items: center;
- justify-content: right;
- margin-top: 20px;
-
- .demo-pagination-block + .demo-pagination-block {
- margin-top: 10px;
- }
- .demo-pagination-block .demonstration {
- margin-bottom: 16px;
}
}
}
diff --git a/src/views/riskWarningSys/riskLevel/index.vue b/src/views/riskWarningSys/riskLevel/index.vue
index c4cfb64..a9f8673 100644
--- a/src/views/riskWarningSys/riskLevel/index.vue
+++ b/src/views/riskWarningSys/riskLevel/index.vue
@@ -1,6 +1,6 @@
<template>
<div class="home-container">
- <el-scrollbar height="100%">
+ <div style="height: 100%">
<div class="homeCard">
<div class="main-card">
<el-row class="cardTop">
@@ -15,6 +15,7 @@
ref="multipleTableRef"
:data="tableData"
style="width: 100%"
+ height="calc(100% - 100px)"
:header-cell-style="{background: '#fafafa'}"
@selection-change="handleSelectionChange"
>
@@ -32,7 +33,6 @@
</template>
</el-table-column>
</el-table>
- </div>
<div class="pageBtn">
<el-pagination
v-model:currentPage="currentPage"
@@ -46,8 +46,9 @@
@current-change="handleCurrentChange"
/>
</div>
+ </div>
</div>
- </el-scrollbar>
+ </div>
<el-dialog v-model="dialogDetails" title="查看详情">
<el-form :model="details" label-width="120px">
<el-form-item label="所属月份">
@@ -178,12 +179,30 @@
level: '高风险',
amount: 2,
updateTime: '2022-07-26 15:55:00'
+ },
+ {
+ month: '2022-07',
+ level: '低风险',
+ amount: 1,
+ updateTime: '2022-07-26 15:55:00'
+ },
+ {
+ month: '2022-06',
+ level: '高风险',
+ amount: 2,
+ updateTime: '2022-07-26 15:55:00'
+ },
+ {
+ month: '2022-07',
+ level: '低风险',
+ amount: 1,
+ updateTime: '2022-07-26 15:55:00'
}
]
)
const addRef = ref<FormInstance>()
const addRules = reactive<FormRules>({
- month:[{required: true, message: '该内容不能为空'}],
+ month:[{required: true, message: '该内容不能为空',trigger:'blur'}],
level:[{required: true, message: '该内容不能为空',trigger:'blur'}],
amount:[{required: true, message: '该内容不能为空',trigger:'blur'}]
})
@@ -245,14 +264,48 @@
<style scoped lang="scss">
$homeNavLengh: 8;
.home-container {
- height: 100%;
+ height: calc(100vh - 114px);
+ box-sizing: border-box;
overflow: hidden;
- padding: 20px;
+
.homeCard{
width: 100%;
padding: 20px;
+ box-sizing: border-box;
background: #fff;
border-radius: 4px;
+
+ .main-card{
+ width: 100%;
+ height: 100%;
+ .cardTop{
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ margin-bottom: 20px;
+ .mainCardBtn{
+ margin: 0;
+ }
+ }
+ .pageBtn{
+ height: 60px;
+ display: flex;
+ align-items: center;
+ justify-content: right;
+
+ .demo-pagination-block + .demo-pagination-block {
+ margin-top: 10px;
+ }
+ .demo-pagination-block .demonstration {
+ margin-bottom: 16px;
+ }
+ }
+ }
+
+ &:last-of-type{
+ height: 100%;
+ }
+
}
.el-row{
display: flex;
@@ -276,37 +329,6 @@
white-space: nowrap;
margin-right: 20px;
}
- }
- }
- .mainPages{
- height: 100%;
- display: flex;
- flex-direction: column;
- justify-content: space-between;
- }
- .main-card{
- width: 100%;
- .cardTop{
- display: flex;
- align-items: center;
- justify-content: space-between;
- margin-bottom: 20px;
- .mainCardBtn{
- margin: 0;
- }
- }
- }
- .pageBtn{
- display: flex;
- align-items: center;
- justify-content: right;
- margin-top: 20px;
-
- .demo-pagination-block + .demo-pagination-block {
- margin-top: 10px;
- }
- .demo-pagination-block .demonstration {
- margin-bottom: 16px;
}
}
}
diff --git a/src/views/specialWorkSystem/afterWorkManagement/workTicketCheck/index.vue b/src/views/specialWorkSystem/afterWorkManagement/workTicketCheck/index.vue
index 35df32c..59447c5 100644
--- a/src/views/specialWorkSystem/afterWorkManagement/workTicketCheck/index.vue
+++ b/src/views/specialWorkSystem/afterWorkManagement/workTicketCheck/index.vue
@@ -1,6 +1,6 @@
<template>
<div class="home-container">
- <el-scrollbar height="100%">
+ <div style="height: 100%">
<el-row class="homeCard">
<el-col :span="8">
<div class="grid-content topInfo">
@@ -25,6 +25,7 @@
ref="multipleTableRef"
:data="tableData"
style="width: 100%"
+ height="calc(100% - 100px)"
:header-cell-style="{background: '#fafafa'}"
@selection-change="handleSelectionChange"
>
@@ -43,22 +44,22 @@
</template>
</el-table-column>
</el-table>
- </div>
- <div class="pageBtn">
- <el-pagination
- v-model:currentPage="currentPage"
- v-model:page-size="pageSize"
- :page-sizes="[10, 15]"
- small=false
- background
- layout="total, sizes, prev, pager, next, jumper"
- :total="100"
- @size-change="handleSizeChange"
- @current-change="handleCurrentChange"
- />
+ <div class="pageBtn">
+ <el-pagination
+ v-model:currentPage="currentPage"
+ v-model:page-size="pageSize"
+ :page-sizes="[10, 15]"
+ small=false
+ background
+ layout="total, sizes, prev, pager, next, jumper"
+ :total="100"
+ @size-change="handleSizeChange"
+ @current-change="handleCurrentChange"
+ />
+ </div>
</div>
</div>
- </el-scrollbar>
+ </div>
<el-dialog v-model="dialogDetails" title="作业票抽检">
<el-form :model="details" label-width="120px">
<el-form-item label="作业证编号">
@@ -293,14 +294,45 @@
<style scoped lang="scss">
$homeNavLengh: 8;
.home-container {
- height: 100%;
+ height: calc(100vh - 114px);
+ box-sizing: border-box;
overflow: hidden;
- padding: 20px;
.homeCard{
width: 100%;
padding: 20px;
+ box-sizing: border-box;
background: #fff;
border-radius: 4px;
+
+ .main-card{
+ width: 100%;
+ height: 100%;
+ .cardTop{
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ margin-bottom: 20px;
+ .mainCardBtn{
+ margin: 0;
+ }
+ }
+ .pageBtn{
+ height: 60px;
+ display: flex;
+ align-items: center;
+ justify-content: right;
+
+ .demo-pagination-block + .demo-pagination-block {
+ margin-top: 10px;
+ }
+ .demo-pagination-block .demonstration {
+ margin-bottom: 16px;
+ }
+ }
+ }
+ &:last-of-type{
+ height: calc(100% - 100px);
+ }
}
.el-row{
display: flex;
@@ -324,37 +356,6 @@
white-space: nowrap;
margin-right: 20px;
}
- }
- }
- .mainPages{
- height: 100%;
- display: flex;
- flex-direction: column;
- justify-content: space-between;
- }
- .main-card{
- width: 100%;
- .cardTop{
- display: flex;
- align-items: center;
- justify-content: space-between;
- margin-bottom: 20px;
- .mainCardBtn{
- margin: 0;
- }
- }
- }
- .pageBtn{
- display: flex;
- align-items: center;
- justify-content: right;
- margin-top: 20px;
-
- .demo-pagination-block + .demo-pagination-block {
- margin-top: 10px;
- }
- .demo-pagination-block .demonstration {
- margin-bottom: 16px;
}
}
}
diff --git a/src/views/specialWorkSystem/afterWorkManagement/workTicketRecord/index.vue b/src/views/specialWorkSystem/afterWorkManagement/workTicketRecord/index.vue
index 13b184e..aa99570 100644
--- a/src/views/specialWorkSystem/afterWorkManagement/workTicketRecord/index.vue
+++ b/src/views/specialWorkSystem/afterWorkManagement/workTicketRecord/index.vue
@@ -1,6 +1,6 @@
<template>
<div class="home-container">
- <el-scrollbar height="100%">
+ <div style="height: 100%">
<el-row class="homeCard">
<el-col :span="12">
<div class="grid-content topInfo">
@@ -28,6 +28,7 @@
ref="multipleTableRef"
:data="tableData"
style="width: 100%"
+ height="calc(100% - 100px)"
:header-cell-style="{background: '#fafafa'}"
@selection-change="handleSelectionChange"
>
@@ -44,22 +45,22 @@
</template>
</el-table-column>
</el-table>
- </div>
- <div class="pageBtn">
- <el-pagination
- v-model:currentPage="currentPage"
- v-model:page-size="pageSize"
- :page-sizes="[10, 15]"
- small=false
- background
- layout="total, sizes, prev, pager, next, jumper"
- :total="100"
- @size-change="handleSizeChange"
- @current-change="handleCurrentChange"
- />
+ <div class="pageBtn">
+ <el-pagination
+ v-model:currentPage="currentPage"
+ v-model:page-size="pageSize"
+ :page-sizes="[10, 15]"
+ small=false
+ background
+ layout="total, sizes, prev, pager, next, jumper"
+ :total="100"
+ @size-change="handleSizeChange"
+ @current-change="handleCurrentChange"
+ />
+ </div>
</div>
</div>
- </el-scrollbar>
+ </div>
<el-dialog v-model="dialogDetails" title="作业票查看">
<el-form :model="details" label-width="120px">
<el-form-item label="作业证编号">
@@ -241,14 +242,45 @@
<style scoped lang="scss">
$homeNavLengh: 8;
.home-container {
- height: 100%;
+ height: calc(100vh - 114px);
+ box-sizing: border-box;
overflow: hidden;
- padding: 20px;
.homeCard{
width: 100%;
padding: 20px;
+ box-sizing: border-box;
background: #fff;
border-radius: 4px;
+
+ .main-card{
+ width: 100%;
+ height: 100%;
+ .cardTop{
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ margin-bottom: 20px;
+ .mainCardBtn{
+ margin: 0;
+ }
+ }
+ .pageBtn{
+ height: 60px;
+ display: flex;
+ align-items: center;
+ justify-content: right;
+
+ .demo-pagination-block + .demo-pagination-block {
+ margin-top: 10px;
+ }
+ .demo-pagination-block .demonstration {
+ margin-bottom: 16px;
+ }
+ }
+ }
+ &:last-of-type{
+ height: calc(100% - 100px);
+ }
}
.el-row{
display: flex;
@@ -272,37 +304,6 @@
white-space: nowrap;
margin-right: 20px;
}
- }
- }
- .mainPages{
- height: 100%;
- display: flex;
- flex-direction: column;
- justify-content: space-between;
- }
- .main-card{
- width: 100%;
- .cardTop{
- display: flex;
- align-items: center;
- justify-content: space-between;
- margin-bottom: 20px;
- .mainCardBtn{
- margin: 0;
- }
- }
- }
- .pageBtn{
- display: flex;
- align-items: center;
- justify-content: right;
- margin-top: 20px;
-
- .demo-pagination-block + .demo-pagination-block {
- margin-top: 10px;
- }
- .demo-pagination-block .demonstration {
- margin-bottom: 16px;
}
}
}
diff --git a/src/views/specialWorkSystem/approveProcessManagement/approveLinkSettings/approveLinkSetting/index.vue b/src/views/specialWorkSystem/approveProcessManagement/approveLinkSettings/approveLinkSetting/index.vue
index 5eb9a0b..242b17e 100644
--- a/src/views/specialWorkSystem/approveProcessManagement/approveLinkSettings/approveLinkSetting/index.vue
+++ b/src/views/specialWorkSystem/approveProcessManagement/approveLinkSettings/approveLinkSetting/index.vue
@@ -1,6 +1,6 @@
<template>
<div class="home-container">
- <el-scrollbar height="100%">
+ <div style="height: 100%">
<div class="homeCard">
<div class="main-card">
<el-row class="cardTop">
@@ -14,6 +14,7 @@
ref="multipleTableRef"
:data="tableData"
style="width: 100%"
+ height="calc(100% - 100px)"
:header-cell-style="{background: '#fafafa'}"
@selection-change="handleSelectionChange"
>
@@ -33,22 +34,22 @@
</template>
</el-table-column>
</el-table>
- </div>
- <div class="pageBtn">
- <el-pagination
- v-model:currentPage="currentPage"
- v-model:page-size="pageSize"
- :page-sizes="[10, 15]"
- small=false
- background
- layout="total, sizes, prev, pager, next, jumper"
- :total="100"
- @size-change="handleSizeChange"
- @current-change="handleCurrentChange"
- />
+ <div class="pageBtn">
+ <el-pagination
+ v-model:currentPage="currentPage"
+ v-model:page-size="pageSize"
+ :page-sizes="[10, 15]"
+ small=false
+ background
+ layout="total, sizes, prev, pager, next, jumper"
+ :total="100"
+ @size-change="handleSizeChange"
+ @current-change="handleCurrentChange"
+ />
+ </div>
</div>
</div>
- </el-scrollbar>
+ </div>
<el-dialog v-model="dialogDetails" title="审批环节">
<el-form :model="details" label-width="120px">
<el-form-item label="环节名称">
@@ -264,14 +265,48 @@
<style scoped lang="scss">
$homeNavLengh: 8;
.home-container {
- height: 100%;
+ height: calc(100vh - 114px);
+ box-sizing: border-box;
overflow: hidden;
- padding: 20px;
+
.homeCard{
width: 100%;
padding: 20px;
+ box-sizing: border-box;
background: #fff;
border-radius: 4px;
+
+ .main-card{
+ width: 100%;
+ height: 100%;
+ .cardTop{
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ margin-bottom: 20px;
+ .mainCardBtn{
+ margin: 0;
+ }
+ }
+ .pageBtn{
+ height: 60px;
+ display: flex;
+ align-items: center;
+ justify-content: right;
+
+ .demo-pagination-block + .demo-pagination-block {
+ margin-top: 10px;
+ }
+ .demo-pagination-block .demonstration {
+ margin-bottom: 16px;
+ }
+ }
+ }
+
+ &:last-of-type{
+ height: 100%;
+ }
+
}
.el-row{
display: flex;
@@ -297,40 +332,6 @@
}
}
}
- .mainPages{
- height: 100%;
- display: flex;
- flex-direction: column;
- justify-content: space-between;
- }
- .main-card{
- width: 100%;
- .cardTop{
- display: flex;
- align-items: center;
- justify-content: space-between;
- margin-bottom: 20px;
- .mainCardBtn{
- margin: 0;
- }
- }
- }
- .pageBtn{
- display: flex;
- align-items: center;
- justify-content: right;
- margin-top: 20px;
-
- .demo-pagination-block + .demo-pagination-block {
- margin-top: 10px;
- }
- .demo-pagination-block .demonstration {
- margin-bottom: 16px;
- }
- }
- }
- .el-input{
- width: 100% !important;
}
.el-date-editor::v-deep{
width: 100%;
diff --git a/src/views/specialWorkSystem/approveProcessManagement/approveLinkSettings/approveTypeSetting/index.vue b/src/views/specialWorkSystem/approveProcessManagement/approveLinkSettings/approveTypeSetting/index.vue
index 3e6b942..2a146f7 100644
--- a/src/views/specialWorkSystem/approveProcessManagement/approveLinkSettings/approveTypeSetting/index.vue
+++ b/src/views/specialWorkSystem/approveProcessManagement/approveLinkSettings/approveTypeSetting/index.vue
@@ -1,6 +1,6 @@
<template>
<div class="home-container">
- <el-scrollbar height="100%">
+ <div style="height: 100%">
<el-row class="homeCard">
<el-col :span="8">
<div class="grid-content topInfo">
@@ -24,6 +24,7 @@
ref="multipleTableRef"
:data="tableData"
style="width: 100%"
+ height="calc(100% - 100px)"
:header-cell-style="{background: '#fafafa'}"
@selection-change="handleSelectionChange"
>
@@ -42,22 +43,22 @@
</template>
</el-table-column>
</el-table>
- </div>
- <div class="pageBtn">
- <el-pagination
- v-model:currentPage="currentPage"
- v-model:page-size="pageSize"
- :page-sizes="[10, 15]"
- small=false
- background
- layout="total, sizes, prev, pager, next, jumper"
- :total="100"
- @size-change="handleSizeChange"
- @current-change="handleCurrentChange"
- />
+ <div class="pageBtn">
+ <el-pagination
+ v-model:currentPage="currentPage"
+ v-model:page-size="pageSize"
+ :page-sizes="[10, 15]"
+ small=false
+ background
+ layout="total, sizes, prev, pager, next, jumper"
+ :total="100"
+ @size-change="handleSizeChange"
+ @current-change="handleCurrentChange"
+ />
+ </div>
</div>
</div>
- </el-scrollbar>
+ </div>
<el-dialog v-model="dialogDetails" title="审批类型">
<el-form :model="details" label-width="120px">
<el-form-item label="审批类型名称">
@@ -258,14 +259,45 @@
<style scoped lang="scss">
$homeNavLengh: 8;
.home-container {
- height: 100%;
+ height: calc(100vh - 114px);
+ box-sizing: border-box;
overflow: hidden;
- padding: 20px;
.homeCard{
width: 100%;
padding: 20px;
+ box-sizing: border-box;
background: #fff;
border-radius: 4px;
+
+ .main-card{
+ width: 100%;
+ height: 100%;
+ .cardTop{
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ margin-bottom: 20px;
+ .mainCardBtn{
+ margin: 0;
+ }
+ }
+ .pageBtn{
+ height: 60px;
+ display: flex;
+ align-items: center;
+ justify-content: right;
+
+ .demo-pagination-block + .demo-pagination-block {
+ margin-top: 10px;
+ }
+ .demo-pagination-block .demonstration {
+ margin-bottom: 16px;
+ }
+ }
+ }
+ &:last-of-type{
+ height: calc(100% - 100px);
+ }
}
.el-row{
display: flex;
@@ -289,37 +321,6 @@
white-space: nowrap;
margin-right: 20px;
}
- }
- }
- .mainPages{
- height: 100%;
- display: flex;
- flex-direction: column;
- justify-content: space-between;
- }
- .main-card{
- width: 100%;
- .cardTop{
- display: flex;
- align-items: center;
- justify-content: space-between;
- margin-bottom: 20px;
- .mainCardBtn{
- margin: 0;
- }
- }
- }
- .pageBtn{
- display: flex;
- align-items: center;
- justify-content: right;
- margin-top: 20px;
-
- .demo-pagination-block + .demo-pagination-block {
- margin-top: 10px;
- }
- .demo-pagination-block .demonstration {
- margin-bottom: 16px;
}
}
}
diff --git a/src/views/specialWorkSystem/approveProcessManagement/approveLinkSettings/reportTypeSetting/index.vue b/src/views/specialWorkSystem/approveProcessManagement/approveLinkSettings/reportTypeSetting/index.vue
index 440ed57..6eb9979 100644
--- a/src/views/specialWorkSystem/approveProcessManagement/approveLinkSettings/reportTypeSetting/index.vue
+++ b/src/views/specialWorkSystem/approveProcessManagement/approveLinkSettings/reportTypeSetting/index.vue
@@ -1,26 +1,47 @@
<template>
<div class="home-container">
- <el-scrollbar height="100%">
+ <div style="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 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="editeTime" label="最新编辑时间" />
- <el-table-column fixed="right" label="操作" align="center" width="180">
- <template #default="scope">
- <el-button link type="primary" size="small" :icon="Edit" @click="editeRow(scope.$index,scope.row)">编辑</el-button>
- <el-button link type="danger" size="small" :icon="Delete" @click="deleteRow(scope.$index)">删除</el-button>
- </template>
- </el-table-column>
- </el-table>
- </el-row>
+ <div class="main-card">
+ <el-row class="cardTop">
+ <el-col :span="12" class="mainCardBtn">
+ <el-button type="primary" size="default" @click="addReport">新建上报类型</el-button>
+ </el-col>
+ </el-row>
+ <el-table ref="multipleTableRef"
+ :data="tableData"
+ style="width: 100%"
+ height="calc(100% - 100px)"
+ :header-cell-style="{background: '#fafafa'}"
+ @selection-change="handleSelectionChange">
+ <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="editeTime" label="最新编辑时间" />
+ <el-table-column fixed="right" label="操作" align="center" width="180">
+ <template #default="scope">
+ <el-button link type="primary" size="small" :icon="Edit" @click="editeRow(scope.$index,scope.row)">编辑</el-button>
+ <el-button link type="danger" size="small" :icon="Delete" @click="deleteRow(scope.$index)">删除</el-button>
+ </template>
+ </el-table-column>
+ </el-table>
+ <div class="pageBtn">
+ <el-pagination
+ v-model:currentPage="currentPage"
+ v-model:page-size="pageSize"
+ :page-sizes="[10, 15]"
+ small=false
+ background
+ layout="total, sizes, prev, pager, next, jumper"
+ :total="100"
+ @size-change="handleSizeChange"
+ @current-change="handleCurrentChange"
+ />
+ </div>
+ </div>
+ </div>
</div>
<el-dialog v-model="dialogAddForm" title="新建上报类型" @close="dialogColse">
<el-form :model="reportForm" label-width="120px" ref="ruleFormRef" :rules="addRules">
@@ -46,7 +67,6 @@
</el-form-item>
</el-form>
</el-dialog>
- </el-scrollbar>
</div>
</template>
@@ -212,20 +232,72 @@
<style scoped lang="scss">
$homeNavLengh: 8;
.home-container {
- height: 100%;
+ height: calc(100vh - 114px);
+ box-sizing: border-box;
overflow: hidden;
- padding: 20px;
+
.homeCard{
width: 100%;
padding: 20px;
+ box-sizing: border-box;
background: #fff;
border-radius: 4px;
+
+ .main-card{
+ width: 100%;
+ height: 100%;
+ .cardTop{
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ margin-bottom: 20px;
+ .mainCardBtn{
+ margin: 0;
+ }
+ }
+ .pageBtn{
+ height: 60px;
+ display: flex;
+ align-items: center;
+ justify-content: right;
+
+ .demo-pagination-block + .demo-pagination-block {
+ margin-top: 10px;
+ }
+ .demo-pagination-block .demonstration {
+ margin-bottom: 16px;
+ }
+ }
+ }
+
+ &:last-of-type{
+ height: 100%;
+ }
+
}
.el-row{
+ display: flex;
+ align-items: center;
margin-bottom: 20px;
- }
- .el-row:last-child {
- margin-bottom: 0;
+ &:last-child {
+ margin-bottom: 0;
+ }
+ .grid-content{
+ align-items: center;
+ min-height: 36px;
+ }
+
+ .topInfo {
+ display: flex;
+ align-items: center;
+ font-size: 16px;
+ font-weight: bold;
+
+ &>div{
+ white-space: nowrap;
+ margin-right: 20px;
+ }
+ }
}
}
</style>
diff --git a/src/views/specialWorkSystem/approveProcessManagement/approveProcessList/index.vue b/src/views/specialWorkSystem/approveProcessManagement/approveProcessList/index.vue
index 6b0615c..ecc00ac 100644
--- a/src/views/specialWorkSystem/approveProcessManagement/approveProcessList/index.vue
+++ b/src/views/specialWorkSystem/approveProcessManagement/approveProcessList/index.vue
@@ -1,6 +1,6 @@
<template>
<div class="home-container">
- <el-scrollbar height="100%">
+ <div style="height: 100%">
<el-row class="homeCard">
<el-col :span="8">
<div class="grid-content topInfo">
@@ -16,7 +16,7 @@
<el-col :span="12" class="mainCardBtn">
<el-button type="primary" :icon="Plus" size="default" @click="dialogAddRecord=true" v-throttle>新建</el-button>
<el-button type="danger" :icon="Delete" size="default" plain>删除</el-button>
- <el-button type="success" size="default">设置分类</el-button>
+ <el-button type="success" size="default" plain>设置分类</el-button>
</el-col>
<el-button type="primary" :icon="Refresh" size="default"/>
</el-row>
@@ -24,6 +24,7 @@
ref="multipleTableRef"
:data="tableData"
style="width: 100%"
+ height="calc(100% - 100px)"
:header-cell-style="{background: '#fafafa'}"
@selection-change="handleSelectionChange"
>
@@ -50,22 +51,22 @@
</template>
</el-table-column>
</el-table>
- </div>
- <div class="pageBtn">
- <el-pagination
- v-model:currentPage="currentPage"
- v-model:page-size="pageSize"
- :page-sizes="[10, 15]"
- small=false
- background
- layout="total, sizes, prev, pager, next, jumper"
- :total="100"
- @size-change="handleSizeChange"
- @current-change="handleCurrentChange"
- />
+ <div class="pageBtn">
+ <el-pagination
+ v-model:currentPage="currentPage"
+ v-model:page-size="pageSize"
+ :page-sizes="[10, 15]"
+ small=false
+ background
+ layout="total, sizes, prev, pager, next, jumper"
+ :total="100"
+ @size-change="handleSizeChange"
+ @current-change="handleCurrentChange"
+ />
+ </div>
</div>
</div>
- </el-scrollbar>
+ </div>
<el-dialog v-model="dialogAddRecord" title="审批流程编辑" @close="closeAdd">
<el-form :model="addRecord" label-width="120px" ref="addRef" :rules="addRules">
<el-form-item label="流程名称" prop="name">
@@ -331,14 +332,45 @@
<style scoped lang="scss">
$homeNavLengh: 8;
.home-container {
- height: 100%;
+ height: calc(100vh - 114px);
+ box-sizing: border-box;
overflow: hidden;
- padding: 20px;
.homeCard{
width: 100%;
padding: 20px;
+ box-sizing: border-box;
background: #fff;
border-radius: 4px;
+
+ .main-card{
+ width: 100%;
+ height: 100%;
+ .cardTop{
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ margin-bottom: 20px;
+ .mainCardBtn{
+ margin: 0;
+ }
+ }
+ .pageBtn{
+ height: 60px;
+ display: flex;
+ align-items: center;
+ justify-content: right;
+
+ .demo-pagination-block + .demo-pagination-block {
+ margin-top: 10px;
+ }
+ .demo-pagination-block .demonstration {
+ margin-bottom: 16px;
+ }
+ }
+ }
+ &:last-of-type{
+ height: calc(100% - 100px);
+ }
}
.el-row{
display: flex;
@@ -362,37 +394,6 @@
white-space: nowrap;
margin-right: 20px;
}
- }
- }
- .mainPages{
- height: 100%;
- display: flex;
- flex-direction: column;
- justify-content: space-between;
- }
- .main-card{
- width: 100%;
- .cardTop{
- display: flex;
- align-items: center;
- justify-content: space-between;
- margin-bottom: 20px;
- .mainCardBtn{
- margin: 0;
- }
- }
- }
- .pageBtn{
- display: flex;
- align-items: center;
- justify-content: right;
- margin-top: 20px;
-
- .demo-pagination-block + .demo-pagination-block {
- margin-top: 10px;
- }
- .demo-pagination-block .demonstration {
- margin-bottom: 16px;
}
}
}
diff --git a/src/views/specialWorkSystem/workApplyManagement/myApply/index.vue b/src/views/specialWorkSystem/workApplyManagement/myApply/index.vue
index 6e0a5b8..44f571a 100644
--- a/src/views/specialWorkSystem/workApplyManagement/myApply/index.vue
+++ b/src/views/specialWorkSystem/workApplyManagement/myApply/index.vue
@@ -2,7 +2,7 @@
<div class="home-container">
<el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick">
<el-tab-pane label="申请中" name="Applying">
- <el-scrollbar height="100%">
+ <div style="height: 100%">
<el-row class="homeCard">
<el-col :span="8">
<div class="grid-content topInfo">
@@ -26,11 +26,12 @@
ref="multipleTableRef"
:data="applyData"
style="width: 100%"
+ height="calc(100% - 100px)"
:header-cell-style="{background: '#fafafa'}"
@selection-change="handleSelectionChange"
>
<el-table-column type="selection" width="55" />
- <el-table-column property="num" label="作业证编号" width="200"/>
+ <el-table-column type="index" label="作业证编号" width="200"/>
<el-table-column property="level" label="作业证等级" width="180" sortable />
<el-table-column property="applyDate" label="申请日期" sortable />
<el-table-column property="name" label="申请人" width="180"/>
@@ -47,107 +48,100 @@
</template>
</el-table-column>
</el-table>
- </div>
- <div class="pageBtn">
- <el-pagination
- v-model:currentPage="currentPage"
- v-model:page-size="pageSize"
- :page-sizes="[10, 15]"
- small=false
- background
- layout="total, sizes, prev, pager, next, jumper"
- :total="100"
- @size-change="handleSizeChange"
- @current-change="handleCurrentChange"
- />
+ <div class="pageBtn">
+ <el-pagination
+ v-model:currentPage="currentPage"
+ v-model:page-size="pageSize"
+ :page-sizes="[10, 15]"
+ small=false
+ background
+ layout="total, sizes, prev, pager, next, jumper"
+ :total="100"
+ @size-change="handleSizeChange"
+ @current-change="handleCurrentChange"
+ />
+ </div>
</div>
</div>
- <el-dialog v-model="dialogDetails" title="作业票查看">
- <el-form :model="details" label-width="120px">
- <el-form-item label="作业证编号">
- <el-input
- v-model="details.num"
- readonly
- />
- </el-form-item>
- <el-form-item label="作业证等级">
- <el-input
- v-model="details.level"
- readonly
- />
- </el-form-item>
- <el-form-item label="申请日期">
- <el-input
- v-model="details.applyDate"
- readonly
- />
- </el-form-item>
- <el-form-item label="申请人">
- <el-input
- v-model="details.name"
- readonly
- />
- </el-form-item>
- <el-form-item label="申请部门">
- <el-input
- v-model="details.department"
- readonly
- />
- </el-form-item>
- <el-form-item label="状态">
- <el-input
- v-model="details.status"
- readonly
- />
- </el-form-item>
- <el-form-item>
- <el-button type="primary" @click="dialogDetails = false" size="default">确认</el-button>
- </el-form-item>
- </el-form>
- </el-dialog>
- <el-dialog v-model="deleteDialog" title="提示" width="30%" center @close="indexClear">
- <span>您确定要删除该条记录吗?</span>
- <template #footer>
- <span class="dialog-footer">
- <el-button @click="deleteDialog = false" size="default">取消</el-button>
- <el-button type="primary" @click="conFirmDelete" size="default" v-throttle>确认</el-button>
- </span>
- </template>
- </el-dialog>
- </el-scrollbar>
+ </div>
+ <el-dialog v-model="dialogDetails" title="作业票查看">
+ <el-form :model="details" label-width="120px">
+ <el-form-item label="作业证等级">
+ <el-input
+ v-model="details.level"
+ readonly
+ />
+ </el-form-item>
+ <el-form-item label="申请日期">
+ <el-input
+ v-model="details.applyDate"
+ readonly
+ />
+ </el-form-item>
+ <el-form-item label="申请人">
+ <el-input
+ v-model="details.name"
+ readonly
+ />
+ </el-form-item>
+ <el-form-item label="申请部门">
+ <el-input
+ v-model="details.department"
+ readonly
+ />
+ </el-form-item>
+ <el-form-item label="状态">
+ <el-input
+ v-model="details.status"
+ readonly
+ />
+ </el-form-item>
+ <el-form-item>
+ <el-button type="primary" @click="dialogDetails = false" size="default">确认</el-button>
+ </el-form-item>
+ </el-form>
+ </el-dialog>
+ <el-dialog v-model="deleteDialog" title="提示" width="30%" center @close="indexClear">
+ <span>您确定要删除该条记录吗?</span>
+ <template #footer>
+ <span class="dialog-footer">
+ <el-button @click="deleteDialog = false" size="default">取消</el-button>
+ <el-button type="primary" @click="conFirmDelete" size="default" v-throttle>确认</el-button>
+ </span>
+ </template>
+ </el-dialog>
</el-tab-pane>
<el-tab-pane label="已通过" name="passed">
- <el-scrollbar height="100%">
- <el-row>
- <div class="homeCard">
- <el-col :span="8">
- <div class="grid-content topInfo">
- <el-input v-model="searchWord" placeholder="作业证名称"></el-input>
- <el-button type="primary">查询</el-button>
- <el-button plain>重置</el-button>
- </div>
- </el-col>
- </div>
+ <div style="height: 100%">
+ <el-row class="homeCard">
+ <el-col :span="8">
+ <div class="grid-content topInfo">
+ <el-input v-model="searchWord" placeholder="作业证名称"></el-input>
+ <el-button type="primary">查询</el-button>
+ <el-button plain>重置</el-button>
+ </div>
+ </el-col>
</el-row>
<div class="homeCard">
<div class="main-card">
<!-- <el-row class="cardTop">-->
<!-- <el-col :span="12" class="mainCardBtn">-->
<!-- <el-button type="primary" :icon="Plus" size="default">申请</el-button>-->
- <!--<el-button type="danger" :icon="Delete" size="default">删除</el-button>-->
- <!--<el-button type="success" size="default">设置分类</el-button>-->
+<!-- <el-button type="danger" :icon="Delete" size="default">删除</el-button>-->
+<!-- <el-button type="success" size="default">设置分类</el-button>-->
<!-- </el-col>-->
-<!-- <el-button type="primary" :icon="Refresh" />-->
+<!-- <el-button type="primary" size="default" :icon="Refresh" />-->
<!-- </el-row>-->
<el-table
ref="multipleTableRef"
:data="passedData"
style="width: 100%"
+ height="calc(100% - 48px)"
:header-cell-style="{background: '#fafafa'}"
@selection-change="handleSelectionChange"
>
<el-table-column type="selection" width="55" />
- <el-table-column property="num" label="作业证编号" width="200"/>
+ <el-table-column type="index" label="编号" width="200"/>
<el-table-column property="level" label="作业证等级" width="180" sortable />
<el-table-column property="applyDate" label="申请日期" sortable />
<el-table-column property="name" label="申请人" width="180"/>
@@ -158,28 +152,28 @@
</template>
</el-table-column>
</el-table>
- </div>
- <div class="pageBtn">
- <el-pagination
- v-model:currentPage="currentPage"
- v-model:page-size="pageSize"
- :page-sizes="[10, 15]"
- small=false
- background
- layout="total, sizes, prev, pager, next, jumper"
- :total="100"
- @size-change="handleSizeChange"
- @current-change="handleCurrentChange"
- />
+ <div class="pageBtn">
+ <el-pagination
+ v-model:currentPage="currentPage"
+ v-model:page-size="pageSize"
+ :page-sizes="[10, 15]"
+ small=false
+ background
+ layout="total, sizes, prev, pager, next, jumper"
+ :total="100"
+ @size-change="handleSizeChange"
+ @current-change="handleCurrentChange"
+ />
+ </div>
</div>
</div>
- </el-scrollbar>
+ </div>
</el-tab-pane>
</el-tabs>
</div>
</template>
-<script lang="ts">
+<script lang="ts" setup>
import { toRefs, reactive, defineComponent, ref } from 'vue';
import { storeToRefs } from 'pinia';
import { initBackEndControlRoutes } from '/@/router/backEnd';
@@ -209,99 +203,136 @@
department: string
status: string
}
- export default defineComponent({
- name: 'myApply',
- setup() {
- const userInfo = useUserInfo()
- const { userInfos } = storeToRefs(userInfo);
- const state = reactive<stateType>({});
- const activeName = ref('Applying')
- const handleClick = (tab: TabsPaneContext, event: Event) => {
- console.log(tab, event)
- }
- const multipleTableRef = ref<InstanceType<typeof ElTable>>()
- const multipleSelection = ref<User[]>([])
- const handleSelectionChange = (val: User[]) => {
- multipleSelection.value = val
- }
- const currentPage = ref(1)
- const pageSize = ref(10)
- const handleSizeChange = (val: number) => {
- console.log(`${val} items per page`)
- }
- const handleCurrentChange = (val: number) => {
- console.log(`current page: ${val}`)
- }
- const applyData = reactive([
+ const userInfo = useUserInfo()
+ const { userInfos } = storeToRefs(userInfo);
+ const activeName = ref('Applying')
+ const handleClick = (tab: TabsPaneContext, event: Event) => {
+ console.log(tab, event)
+ }
+ const multipleTableRef = ref<InstanceType<typeof ElTable>>()
+ const multipleSelection = ref<User[]>([])
+ const handleSelectionChange = (val: User[]) => {
+ multipleSelection.value = val
+ }
+ const currentPage = ref(1)
+ const pageSize = ref(10)
+ const handleSizeChange = (val: number) => {
+ console.log(`${val} items per page`)
+ }
+ const handleCurrentChange = (val: number) => {
+ console.log(`current page: ${val}`)
+ }
+ const applyData = reactive([
+ {
+ level: '等级一',
+ applyDate: '2022-07-27 14:19:33',
+ name: '张三',
+ department: '部门一',
+ status: '审核中'
- ])
- const chosenIndex = ref(-1)
- const passedData: User[] = []
- const dialogDetails = ref(false)
- const details = ref({})
- const deleteDialog = ref(false)
-
- // 查看记录
- const viewRecord = (row) =>{
- details.value = JSON.parse(JSON.stringify(row))
- dialogDetails.value = true
- }
-
- // 删除记录
- const applyRecord = (index) =>{
- chosenIndex.value = index
- deleteDialog.value = true
- }
-
- // 弹窗确认删除记录
- const conFirmDelete = ()=> {
- applyData.splice(chosenIndex.value,1)
- deleteDialog.value = false
- }
- // 折线图
- const renderMenu = async (value: string) => {
- Session.set('projectId',value)
- userInfos.value.projectId = value
- await initBackEndControlRoutes();
- };
- return {
- renderMenu,
- multipleTableRef,
- applyData,
- passedData,
- currentPage,
- pageSize,
- activeName,
- handleClick,
- handleSizeChange,
- handleCurrentChange,
- Plus,
- Delete,
- handleSelectionChange,
- Refresh,
- ...toRefs(state),
- };
},
- });
+ {
+ level: '等级一',
+ applyDate: '2022-07-27 14:19:33',
+ name: '张三',
+ department: '部门一',
+ status: '审核中'
+
+ },
+ {
+ level: '等级一',
+ applyDate: '2022-07-27 14:19:33',
+ name: '张三',
+ department: '部门一',
+ status: '审核中'
+
+ }
+ ])
+ const chosenIndex = ref(-1)
+ const passedData: User[] = []
+ const dialogDetails = ref(false)
+ const details = ref({})
+ const deleteDialog = ref(false)
+
+ // 查看记录
+ const viewRecord = (row) =>{
+ details.value = JSON.parse(JSON.stringify(row))
+ dialogDetails.value = true
+ }
+
+ // 删除记录
+ const deleteRecord = (index) =>{
+ chosenIndex.value = index
+ deleteDialog.value = true
+ }
+
+ // 弹窗确认删除记录
+ const conFirmDelete = ()=> {
+ applyData.splice(chosenIndex.value,1)
+ deleteDialog.value = false
+ }
+ // 折线图
+ const renderMenu = async (value: string) => {
+ Session.set('projectId',value)
+ userInfos.value.projectId = value
+ await initBackEndControlRoutes();
+ };
</script>
<style scoped lang="scss">
$homeNavLengh: 8;
.home-container {
- height: 100%;
+ height: calc(100vh - 114px);
+ box-sizing: border-box;
overflow: hidden;
- padding: 20px;
- .demo-tabs > .el-tabs__content {
- padding: 32px;
- color: #6b778c;
- font-size: 32px;
- font-weight: 600;
+ .demo-tabs{
+ width: 100%;
+ height: 100%;
+
+ &::v-deep(.el-tabs__content){
+ height: calc(100% - 60px);
+ }
+
+ .el-tab-pane{
+ height: 100%;
+ }
}
.homeCard{
width: 100%;
padding: 20px;
+ box-sizing: border-box;
background: #fff;
border-radius: 4px;
+
+ .main-card{
+ width: 100%;
+ height: 100%;
+ .cardTop{
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ margin-bottom: 20px;
+ .mainCardBtn{
+ margin: 0;
+ }
+ }
+ .pageBtn{
+ height: 60px;
+ display: flex;
+ align-items: center;
+ justify-content: right;
+
+ .demo-pagination-block + .demo-pagination-block {
+ margin-top: 10px;
+ }
+ .demo-pagination-block .demonstration {
+ margin-bottom: 16px;
+ }
+ }
+ }
+ &:last-of-type{
+ height: calc(100% - 100px);
+ }
}
.el-row{
display: flex;
@@ -325,37 +356,6 @@
white-space: nowrap;
margin-right: 20px;
}
- }
- }
- .mainPages{
- height: 100%;
- display: flex;
- flex-direction: column;
- justify-content: space-between;
- }
- .main-card{
- width: 100%;
- .cardTop{
- display: flex;
- align-items: center;
- justify-content: space-between;
- margin-bottom: 20px;
- .mainCardBtn{
- margin: 0;
- }
- }
- }
- .pageBtn{
- display: flex;
- align-items: center;
- justify-content: right;
- margin-top: 20px;
-
- .demo-pagination-block + .demo-pagination-block {
- margin-top: 10px;
- }
- .demo-pagination-block .demonstration {
- margin-bottom: 16px;
}
}
}
diff --git a/src/views/specialWorkSystem/workBasicManagementSetting/certificateFilterSetting/index.vue b/src/views/specialWorkSystem/workBasicManagementSetting/certificateFilterSetting/index.vue
index 4d8d77a..91a85f7 100644
--- a/src/views/specialWorkSystem/workBasicManagementSetting/certificateFilterSetting/index.vue
+++ b/src/views/specialWorkSystem/workBasicManagementSetting/certificateFilterSetting/index.vue
@@ -1,6 +1,6 @@
<template>
<div class="home-container">
- <el-scrollbar height="100%">
+ <div style="height: 100%">
<el-row class="homeCard">
<el-col :span="8">
<div class="grid-content topInfo">
@@ -27,6 +27,7 @@
ref="multipleTableRef"
:data="tableData"
style="width: 100%"
+ height="calc(100% - 100px)"
:header-cell-style="{background: '#fafafa'}"
@selection-change="handleSelectionChange"
>
@@ -41,22 +42,22 @@
</template>
</el-table-column>
</el-table>
- </div>
- <div class="pageBtn">
- <el-pagination
- v-model:currentPage="currentPage"
- v-model:page-size="pageSize"
- :page-sizes="[10, 15]"
- small=false
- background
- layout="total, sizes, prev, pager, next, jumper"
- :total="100"
- @size-change="handleSizeChange"
- @current-change="handleCurrentChange"
- />
+ <div class="pageBtn">
+ <el-pagination
+ v-model:currentPage="currentPage"
+ v-model:page-size="pageSize"
+ :page-sizes="[10, 15]"
+ small=false
+ background
+ layout="total, sizes, prev, pager, next, jumper"
+ :total="100"
+ @size-change="handleSizeChange"
+ @current-change="handleCurrentChange"
+ />
+ </div>
</div>
</div>
- </el-scrollbar>
+ </div>
<el-dialog v-model="dialogDetails" title="证书过滤">
<el-form :model="details" label-width="120px">
<el-form-item label="证书名称">
@@ -134,136 +135,139 @@
interface type {
}
- // export default defineComponent({
- // name: 'workCheckinRecord',
- // setup() {
- const userInfo = useUserInfo()
- const { userInfos } = storeToRefs(userInfo);
- const state = reactive<stateType>({});
- const currentPage = ref(1)
- const pageSize = ref(10)
- const searchType=ref('')
- const chosenIndex = ref(-1)
- const handleSizeChange = (val: number) => {
- console.log(`${val} items per page`)
+ const userInfo = useUserInfo()
+ const { userInfos } = storeToRefs(userInfo);
+ const state = reactive<stateType>({});
+ const currentPage = ref(1)
+ const pageSize = ref(10)
+ const searchType=ref('')
+ const chosenIndex = ref(-1)
+ const handleSizeChange = (val: number) => {
+ console.log(`${val} items per page`)
+ }
+ const handleCurrentChange = (val: number) => {
+ console.log(`current page: ${val}`)
+ }
+ const tableData = reactive(
+ [
+ {
+ certificate: '登高作业证',
+ jobType: '高处作业'
+ },
+ {
+ certificate: '焊接与热切割作业',
+ jobType: '动火作业'
+ },
+ {
+ certificate: '低压电工证',
+ jobType: '临时用电'
+ },
+ {
+ certificate: '化工自动化控制仪表作业',
+ jobType: '设备检修'
}
- const handleCurrentChange = (val: number) => {
- console.log(`current page: ${val}`)
+ ]
+ )
+ const addRef = ref<FormInstance>()
+ const addRules = reactive<FormRules>({
+ certificate:[{required: true, message: '该内容不能为空',trigger:'blur'}],
+ jobType:[{required: true, message: '该内容不能为空',trigger:'blur'}]
+ })
+ const dialogDetails = ref(false)
+ const dialogAddRecord = ref(false)
+ const deleteDialog = ref(false)
+ const addRecord = ref({})
+ const details = ref({})
+ const viewRecord = (row) =>{
+ details.value = JSON.parse(JSON.stringify(row))
+ dialogDetails.value = true
+ }
+ const deleteRecord = (index) =>{
+ chosenIndex.value = index
+ deleteDialog.value = true
+ }
+ const conFirmDelete = ()=> {
+ tableData.splice(chosenIndex.value,1)
+ deleteDialog.value = false
+ }
+ const confirmAddRecord = async (formEl: FormInstance | undefined) =>{
+ if (!formEl) return
+ await formEl.validate((valid, fields) => {
+ if (valid) {
+ if(chosenIndex.value == -1){
+ tableData.unshift(addRecord.value)
+ }else{
+ tableData[chosenIndex.value] = addRecord.value
+ }
+ dialogAddRecord.value =false
+ } else {
+ console.log('error submit!', fields)
}
- const tableData = reactive(
- [
- {
- certificate: '登高作业证',
- jobType: '高处作业'
- },
- {
- certificate: '焊接与热切割作业',
- jobType: '动火作业'
- },
- {
- certificate: '低压电工证',
- jobType: '临时用电'
- },
- {
- certificate: '化工自动化控制仪表作业',
- jobType: '设备检修'
- }
- ]
- )
- const addRef = ref<FormInstance>()
- const addRules = reactive<FormRules>({
- certificate:[{required: true, message: '该内容不能为空',trigger:'blur'}],
- jobType:[{required: true, message: '该内容不能为空',trigger:'blur'}]
- })
- const dialogDetails = ref(false)
- const dialogAddRecord = ref(false)
- const deleteDialog = ref(false)
- const addRecord = ref({})
- const details = ref({})
- const viewRecord = (row) =>{
- details.value = JSON.parse(JSON.stringify(row))
- dialogDetails.value = true
- }
- const deleteRecord = (index) =>{
- chosenIndex.value = index
- deleteDialog.value = true
- }
- const conFirmDelete = ()=> {
- tableData.splice(chosenIndex.value,1)
- deleteDialog.value = false
- }
- const confirmAddRecord = async (formEl: FormInstance | undefined) =>{
- if (!formEl) return
- await formEl.validate((valid, fields) => {
- if (valid) {
- if(chosenIndex.value == -1){
- tableData.unshift(addRecord.value)
- }else{
- tableData[chosenIndex.value] = addRecord.value
- }
- dialogAddRecord.value =false
- } else {
- console.log('error submit!', fields)
- }
- })
+ })
- }
- const closeAdd =()=>{
- addRecord.value={}
- chosenIndex.value = -1
- }
- const indexClear = ()=>{
- chosenIndex.value = -1
- }
- const editRecord =(index, row)=>{
- dialogAddRecord.value = true
- chosenIndex.value = index
- addRecord.value = JSON.parse(JSON.stringify(row))
- }
- // 折线图
- const renderMenu = async (value: string) => {
- Session.set('projectId',value)
- userInfos.value.projectId = value
- await initBackEndControlRoutes();
- };
- // return {
- // renderMenu,
- // multipleTableRef,
- // tableData,
- // currentPage,
- // pageSize,
- // dialogDetails,
- // details,
- // deleteDialog,
- // dialogAddRecord,
- // viewRecord,
- // deleteRecord,
- // handleSizeChange,
- // handleCurrentChange,
- // Plus,
- // Edit,
- // Delete,
- // Search,
- // Download,
- // handleSelectionChange,
- // Refresh,
- // ...toRefs(state),
- // };
- // },
- // });
+ }
+ const closeAdd =()=>{
+ addRecord.value={}
+ chosenIndex.value = -1
+ }
+ const indexClear = ()=>{
+ chosenIndex.value = -1
+ }
+ const editRecord =(index, row)=>{
+ dialogAddRecord.value = true
+ chosenIndex.value = index
+ addRecord.value = JSON.parse(JSON.stringify(row))
+ }
+ // 折线图
+ const renderMenu = async (value: string) => {
+ Session.set('projectId',value)
+ userInfos.value.projectId = value
+ await initBackEndControlRoutes();
+ };
</script>
<style scoped lang="scss">
$homeNavLengh: 8;
.home-container {
- height: 100%;
+ height: calc(100vh - 114px);
+ box-sizing: border-box;
overflow: hidden;
- padding: 20px;
.homeCard{
width: 100%;
padding: 20px;
+ box-sizing: border-box;
background: #fff;
border-radius: 4px;
+
+ .main-card{
+ width: 100%;
+ height: 100%;
+ .cardTop{
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ margin-bottom: 20px;
+ .mainCardBtn{
+ margin: 0;
+ }
+ }
+ .pageBtn{
+ height: 60px;
+ display: flex;
+ align-items: center;
+ justify-content: right;
+
+ .demo-pagination-block + .demo-pagination-block {
+ margin-top: 10px;
+ }
+ .demo-pagination-block .demonstration {
+ margin-bottom: 16px;
+ }
+ }
+ }
+ &:last-of-type{
+ height: calc(100% - 100px);
+ }
}
.el-row{
display: flex;
@@ -287,37 +291,6 @@
white-space: nowrap;
margin-right: 20px;
}
- }
- }
- .mainPages{
- height: 100%;
- display: flex;
- flex-direction: column;
- justify-content: space-between;
- }
- .main-card{
- width: 100%;
- .cardTop{
- display: flex;
- align-items: center;
- justify-content: space-between;
- margin-bottom: 20px;
- .mainCardBtn{
- margin: 0;
- }
- }
- }
- .pageBtn{
- display: flex;
- align-items: center;
- justify-content: right;
- margin-top: 20px;
-
- .demo-pagination-block + .demo-pagination-block {
- margin-top: 10px;
- }
- .demo-pagination-block .demonstration {
- margin-bottom: 16px;
}
}
}
diff --git a/src/views/specialWorkSystem/workBasicManagementSetting/personalProtectDevices/index.vue b/src/views/specialWorkSystem/workBasicManagementSetting/personalProtectDevices/index.vue
index 8a5eb25..f5eba70 100644
--- a/src/views/specialWorkSystem/workBasicManagementSetting/personalProtectDevices/index.vue
+++ b/src/views/specialWorkSystem/workBasicManagementSetting/personalProtectDevices/index.vue
@@ -1,6 +1,6 @@
<template>
<div class="home-container">
- <el-scrollbar height="100%">
+ <div style="height: 100%">
<el-row class="homeCard">
<el-col :span="8">
<div class="grid-content topInfo">
@@ -24,6 +24,7 @@
ref="multipleTableRef"
:data="tableData"
style="width: 100%"
+ height="calc(100% - 100px)"
:header-cell-style="{background: '#fafafa'}"
@selection-change="handleSelectionChange"
>
@@ -37,22 +38,22 @@
</template>
</el-table-column>
</el-table>
- </div>
- <div class="pageBtn">
- <el-pagination
- v-model:currentPage="currentPage"
- v-model:page-size="pageSize"
- :page-sizes="[10, 15]"
- small=false
- background
- layout="total, sizes, prev, pager, next, jumper"
- :total="100"
- @size-change="handleSizeChange"
- @current-change="handleCurrentChange"
- />
+ <div class="pageBtn">
+ <el-pagination
+ v-model:currentPage="currentPage"
+ v-model:page-size="pageSize"
+ :page-sizes="[10, 15]"
+ small=false
+ background
+ layout="total, sizes, prev, pager, next, jumper"
+ :total="100"
+ @size-change="handleSizeChange"
+ @current-change="handleCurrentChange"
+ />
+ </div>
</div>
</div>
- </el-scrollbar>
+ </div>
<el-dialog v-model="dialogDetails" title="防护用品">
<el-form :model="details" label-width="120px">
<el-form-item label="防护用品名称">
@@ -208,14 +209,45 @@
<style scoped lang="scss">
$homeNavLengh: 8;
.home-container {
- height: 100%;
+ height: calc(100vh - 114px);
+ box-sizing: border-box;
overflow: hidden;
- padding: 20px;
.homeCard{
width: 100%;
padding: 20px;
+ box-sizing: border-box;
background: #fff;
border-radius: 4px;
+
+ .main-card{
+ width: 100%;
+ height: 100%;
+ .cardTop{
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ margin-bottom: 20px;
+ .mainCardBtn{
+ margin: 0;
+ }
+ }
+ .pageBtn{
+ height: 60px;
+ display: flex;
+ align-items: center;
+ justify-content: right;
+
+ .demo-pagination-block + .demo-pagination-block {
+ margin-top: 10px;
+ }
+ .demo-pagination-block .demonstration {
+ margin-bottom: 16px;
+ }
+ }
+ }
+ &:last-of-type{
+ height: calc(100% - 100px);
+ }
}
.el-row{
display: flex;
@@ -239,37 +271,6 @@
white-space: nowrap;
margin-right: 20px;
}
- }
- }
- .mainPages{
- height: 100%;
- display: flex;
- flex-direction: column;
- justify-content: space-between;
- }
- .main-card{
- width: 100%;
- .cardTop{
- display: flex;
- align-items: center;
- justify-content: space-between;
- margin-bottom: 20px;
- .mainCardBtn{
- margin: 0;
- }
- }
- }
- .pageBtn{
- display: flex;
- align-items: center;
- justify-content: right;
- margin-top: 20px;
-
- .demo-pagination-block + .demo-pagination-block {
- margin-top: 10px;
- }
- .demo-pagination-block .demonstration {
- margin-bottom: 16px;
}
}
}
--
Gitblit v1.9.2