From 1c3fd3dd743262b0f62e7f16999de2b9267845b0 Mon Sep 17 00:00:00 2001
From: Admin <978517621@qq.com>
Date: 星期五, 09 九月 2022 17:47:38 +0800
Subject: [PATCH] Default Changelist

---
 src/views/specialWorkSystem/workPlan/workAppoint/index.vue |  953 +++++++++++++++++++++++++++--------------------------------
 1 files changed, 440 insertions(+), 513 deletions(-)

diff --git a/src/views/specialWorkSystem/workPlan/workAppoint/index.vue b/src/views/specialWorkSystem/workPlan/workAppoint/index.vue
index b9f54fa..a627b01 100644
--- a/src/views/specialWorkSystem/workPlan/workAppoint/index.vue
+++ b/src/views/specialWorkSystem/workPlan/workAppoint/index.vue
@@ -1,130 +1,90 @@
 <template>
 	<div class="home-container">
-		<el-scrollbar height="100%">
-		<el-row class="homeCard">
-			<el-col :span="12">
-				<div class="grid-content topInfo">
-					<el-date-picker
-							v-model="searchTime"
-							type="datetime"
-							placeholder="预约时间"
-							size="large"
-							style="width: 100%;white-space: nowrap;margin-right: 20px"
-					/>
-					<el-select v-model="typeValue" placeholder="请选择预约类型" style="width: 100%">
-						<el-option label="类型1" value="类型1"/>
-						<el-option label="类型2" value="类型2"/>
-						<el-option label="类型3" value="类型3"/>
-					</el-select>
-					<el-button type="primary">查询历史</el-button>
-					<el-button plain>重置</el-button>
-					<el-button type="primary" @click="dialogChartsVisible = true">查看统计图表</el-button>
+		<div style="height: 100%">
+			<el-row class="homeCard">
+				<el-col :span="6" style="display:flex;align-items: center">
+					<span style="white-space: nowrap">申请部门:</span>
+					<div class="grid-content topInfo">
+						<el-input v-model="workPermitNo" placeholder="请输入部门名称"></el-input>
+					</div>
+				</el-col>
+				<el-col :span="6" style="display:flex;align-items: center">
+					<span style="white-space: nowrap">预约日期:</span>
+					<div class="grid-content topInfo">
+						<el-select v-model="workType" placeholder="请选择作业类型">
+							<el-option
+									v-for="item in workTypeList"
+									:key="item.id"
+									:label="item.name"
+									:value="item.id"
+							/>
+						</el-select>
+					</div>
+				</el-col>
+				<el-button type="primary" @click="searchRecord">查询</el-button>
+				<el-button plain @click="clearSearch">重置</el-button>
+			</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-col>-->
+<!--						<el-button type="primary" :icon="Refresh" size="default" @click="reLoadData"/>-->
+<!--					</el-row>-->
+					<el-table
+							:data="tableData"
+							style="width: 100%"
+							height="calc(100% - 100px)"
+							:header-cell-style="{background: '#fafafa'}"
+					>
+<!--						<el-table-column type="selection" width="55" />-->
+						<el-table-column type="index" label="序号" width="80" />
+						<el-table-column prop="department" label="申请部门"/>
+						<el-table-column prop="time" label="预约时间"/>
+						<el-table-column prop="fireWork" label="动火作业"/>
+						<el-table-column prop="spaceWork" label="受限空间作业"/>
+						<el-table-column prop="hangWork" label="吊装作业"/>
+						<el-table-column prop="dirtyWork" label="动土作业"/>
+						<el-table-column prop="cut" label="断路作业"/>
+						<el-table-column prop="high" label="高处作业" />
+						<el-table-column prop="tempUse" label="临时用电作业"/>
+						<el-table-column prop="block" 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="editRecordBtn(scope.$index, scope.row)">修改</el-button>
+								<el-button link type="danger" size="small" :icon="Delete" @click="deleteRecordBtn(scope.row)">删除</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="totalSize"
+								@size-change="handleSizeChange"
+								@current-change="handleCurrentChange"
+						/>
+					</div>
 				</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>删除</el-button>
-					</el-col>
-					<el-button type="primary" :icon="Refresh" size="default"/>
-				</el-row>
-				<el-table
-						ref="multipleTableRef"
-						:data="tableData"
-						style="width: 100%"
-						:header-cell-style="{background: '#fafafa'}"
-						@selection-change="handleSelectionChange"
-				>
-					<el-table-column type="selection" width="55" />
-					<el-table-column type="index" label="序号" width="120" />
-					<el-table-column prop="time" label="预约时间" width="150" />
-					<el-table-column prop="department" label="预约部门" width="180" />
-					<el-table-column prop="dirtyWork" label="动土作业" width="100" />
-					<el-table-column prop="fireWork" label="动火作业" width="100" />
-					<el-table-column prop="hangWork" label="吊装作业" width="100" />
-					<el-table-column prop="spaceWork" label="受限空间作业"/>
-					<el-table-column prop="cut" label="断路作业"/>
-					<el-table-column prop="high" label="高处作业" />
-					<el-table-column prop="block" label="盲板抽堵作业"/>
-					<el-table-column prop="tempUse" 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>
-						</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>
 		</div>
-		</el-scrollbar>
-		<el-dialog v-model="dialogChartsVisible" title="统计图表" @opened="openChart">
-			<el-row>
-				<div class="grid-content">
-					<div style="margin-bottom: 10px">日期查询:</div>
-					<div class="block">
-						<el-date-picker
-								v-model="dateRange"
-								type="daterange"
-								unlink-panels
-								range-separator="至"
-								start-placeholder="开始日期"
-								end-placeholder="截止日期"
-								:shortcuts="shortcuts"
-								size="large"
-						/>
-					</div>
-				</div>
-			</el-row>
-			<el-row>
-				<div class="grid-content">
-					<div style="margin-bottom: 10px">部门查询:</div>
-					<div>
-						<el-cascader
-								v-model="departmentName"
-								:options="departmentOptions"
-								:props="{expandTrigger: 'hover'}"
-								@change="handleChange"
-						/>
-					</div>
-				</div>
-			</el-row>
-			<div ref="myChart" style="width: 100%;height:400px;"></div>
-		</el-dialog>
 		<el-dialog v-model="dialogDetails" title="作业预约">
 			<el-form :model="details" label-width="120px">
-				<el-form-item label="预约时间">
-					<el-input
-							v-model="details.time"
-							readonly
-					/>
-				</el-form-item>
-				<el-form-item label="预约部门">
+				<el-form-item label="申请部门">
 					<el-input
 							v-model="details.department"
 							readonly
 					/>
 				</el-form-item>
-				<el-form-item label="动土作业">
+				<el-form-item label="预约时间">
 					<el-input
-							v-model="details.dirtyWork"
+							v-model="details.time"
 							readonly
 					/>
 				</el-form-item>
@@ -134,15 +94,21 @@
 							readonly
 					/>
 				</el-form-item>
+				<el-form-item label="受限空间作业">
+					<el-input
+							v-model="details.spaceWork"
+							readonly
+					/>
+				</el-form-item>
 				<el-form-item label="吊装作业">
 					<el-input
 							v-model="details.hangWork"
 							readonly
 					/>
 				</el-form-item>
-				<el-form-item label="受限空间作业">
+				<el-form-item label="动土作业">
 					<el-input
-							v-model="details.spaceWork"
+							v-model="details.dirtyWork"
 							readonly
 					/>
 				</el-form-item>
@@ -158,25 +124,30 @@
 							readonly
 					/>
 				</el-form-item>
-				<el-form-item label="盲板抽堵作业">
-					<el-input
-							v-model="details.block"
-							readonly
-					/>
-				</el-form-item>
 				<el-form-item label="临时用电作业">
 					<el-input
 							v-model="details.tempUse"
 							readonly
 					/>
 				</el-form-item>
-				<el-form-item>
-					<el-button type="primary" @click="dialogDetails = false" size="default">确认</el-button>
+				<el-form-item label="盲板抽堵作业">
+					<el-input
+							v-model="details.block"
+							readonly
+					/>
 				</el-form-item>
 			</el-form>
+			<template #footer>
+			  <span class="dialog-footer">
+				<el-button type="primary" @click="dialogDetails = false">确认</el-button>
+			  </span>
+			</template>
 		</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="department">
+					<el-cascader v-model="addRecord.department" :options="departmentList" :props="casProps" :show-all-levels="false" @change="handleChange" />
+				</el-form-item>
 				<el-form-item label="预约时间" prop="time">
 					<el-date-picker
 							v-model="addRecord.time"
@@ -184,20 +155,14 @@
 							format="YYYY/MM/DD HH:mm:ss" value-format="YYYY-MM-DD HH:mm:ss"
 					/>
 				</el-form-item>
-				<el-form-item label="预约部门" prop="department">
-					<el-select v-model="addRecord.department" placeholder="请选择">
-						<el-option label="部门一" value="部门一" />
-						<el-option label="部门二" value="部门二" />
-					</el-select>
-				</el-form-item>
-				<el-form-item label="动土作业">
-					<el-input
-							v-model="addRecord.dirtyWork"
-					/>
-				</el-form-item>
 				<el-form-item label="动火作业">
 					<el-input
 							v-model="addRecord.fireWork"
+					/>
+				</el-form-item>
+				<el-form-item label="受限空间作业">
+					<el-input
+							v-model="addRecord.spaceWork"
 					/>
 				</el-form-item>
 				<el-form-item label="吊装作业">
@@ -205,9 +170,9 @@
 							v-model="addRecord.hangWork"
 					/>
 				</el-form-item>
-				<el-form-item label="受限空间作业">
+				<el-form-item label="动土作业">
 					<el-input
-							v-model="addRecord.spaceWork"
+							v-model="addRecord.dirtyWork"
 					/>
 				</el-form-item>
 				<el-form-item label="断路作业">
@@ -220,453 +185,415 @@
 							v-model="addRecord.high"
 					/>
 				</el-form-item>
-				<el-form-item label="盲板抽堵作业">
-					<el-input
-							v-model="addRecord.block"
-					/>
-				</el-form-item>
 				<el-form-item label="临时用电作业">
 					<el-input
 							v-model="addRecord.tempUse"
 					/>
 				</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 label="盲板抽堵作业">
+					<el-input
+							v-model="addRecord.block"
+					/>
 				</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>
+			  <span class="dialog-footer">
+				<el-button type="warning" @click="dialogAddRecord = false" size="default" plain>取消</el-button>
+				<el-button type="primary" @click="confirmAddRecord(addRef)" size="default">确认</el-button>
+			  </span>
 			</template>
 		</el-dialog>
 	</div>
 </template>
 
-<script lang="ts" setup>
-	import { toRefs, reactive, ref } from 'vue';
+<script lang="ts">
+	import {toRefs, reactive, ref, onMounted, defineAsyncComponent} from 'vue';
 	import { storeToRefs } from 'pinia';
 	import { initBackEndControlRoutes } from '/@/router/backEnd';
-	import {useUserInfo} from "/@/stores/userInfo";
+	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'
-	import * as echarts from 'echarts/core';
-	import { TooltipComponent, TooltipComponentOption, GridComponent, GridComponentOption, LegendComponent, LegendComponentOption } from 'echarts/components';
-	import { BarChart, BarSeriesOption } from 'echarts/charts';
-	import { CanvasRenderer } from 'echarts/renderers';
-	echarts.use([
-		TooltipComponent,
-		GridComponent,
-		LegendComponent,
-		BarChart,
-		CanvasRenderer
-	]);
-	let global: any = {
-		homeChartOne: null,
-		homeChartTwo: null,
-		homeCharThree: null,
-		dispose: [null, '', undefined],
-	};
+	import { Edit, View, Plus, Delete, Refresh, Search, Download } from '@element-plus/icons-vue';
+	import { ElTable, ElMessage, ElMessageBox } from 'element-plus'
+	import type { FormInstance, FormRules, UploadProps, UploadUserFile } from 'element-plus'
+	import { teamManageApi } from '/@/api/systemManage/basicDateManage/personShiftManage/teamManage';
 
+	// 定义接口来定义对象的类型
 	interface stateType {
-		homeOne: Array <type>
-	}
-	interface type {
+		tableData: Array<any>;
+		departmentList: Array<any>;
+		department:string;
+		casProps: {};
+		multipleSelection: Array<any>;
+		deleteArr: Array<any>;
+		dialogDetails: boolean;
+		dialogAddRecord: boolean;
+		deleteDialog: boolean;
+		deleteSetDialog: boolean;
+		pageIndex: number;
+		pageSize: number;
+		chosenIndex: null | number;
+		deleteId: null | number;
+		workPermitNo: string;
+		workType: number | null;
+		totalSize: number;
+		addRecord: {
 
+		};
+		details: {
+
+		};
+		workTypeList: Array<any>
 	}
-	// export default defineComponent({
-	// 	name: 'workCheckinRecord',
-	// 	setup() {
-			const userInfo = useUserInfo()
+
+	export default {
+		name: 'workReservation',
+		components: {},
+		setup() {
+			const userInfo = useUserInfo();
 			const { userInfos } = storeToRefs(userInfo);
-			const typeValue = ref('')
-			const dialogChartsVisible = ref(false);
-			const dateRange = ref('')
-			const departmentName = ref('')
-			const departmentOptions = [
-				{
-					value: 'guide',
-					label: 'Guide',
-					children: [
-						{
-							value: 'disciplines',
-							label: 'Disciplines',
-							children: [
-								{
-									value: 'consistency',
-									label: 'Consistency',
-								},
-								{
-									value: 'feedback',
-									label: 'Feedback',
-								}
-							],
-						},
-						{
-							value: 'navigation',
-							label: 'Navigation',
-							children: [
-								{
-									value: 'side nav',
-									label: 'Side Navigation',
-								},
-								{
-									value: 'top nav',
-									label: 'Top Navigation',
-								},
-							],
-						},
-					],
+			const state = reactive<stateType>({
+				pageIndex: 1,
+				pageSize: 10,
+				totalSize: 0,
+				chosenIndex: null,
+				workPermitNo: '',
+				workType: null,
+				tableData: [],
+				departmentList: [],
+				department: '',
+				casProps: {
+					expandTrigger: 'hover',
+					emitPath: false,
+					value: 'depId',
+					label: 'depName',
+					checkStrictly: true
 				},
-				{
-					value: 'component',
-					label: 'Component',
-				},
-				{
-					value: 'resource',
-					label: 'Resource',
-					children: [
-						{
-							value: 'axure',
-							label: 'Axure Components',
-						},
-						{
-							value: 'sketch',
-							label: 'Sketch Templates',
-						},
-						{
-							value: 'docs',
-							label: 'Design Documentation',
-						},
-					],
-				},
-			]
-			const handleChange = (value) => {
-				console.log(value)
-			}
-			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(
-					[
-						{
-							time: '2022-06-29 12:32:52',
-							department: '电工部',
-							dirtyWork: '',
-							fireWork: '',
-							hangWork: '',
-							spaceWork: '',
-							cut: '',
-							high: '',
-							block: '',
-							tempUse: ''
-						},
-						{
-							time: '2022-06-29 12:32:52',
-							department: '电工部',
-							dirtyWork: '',
-							fireWork: '',
-							hangWork: '',
-							spaceWork: '',
-							cut: '',
-							high: '',
-							block: '',
-							tempUse: ''
-						},
-						{
-							time: '2022-06-29 12:32:52',
-							department: '土木',
-							dirtyWork: '',
-							fireWork: '',
-							hangWork: '',
-							spaceWork: '',
-							cut: '',
-							high: '',
-							block: '',
-							tempUse: ''
-						}
+				multipleSelection: [],
+				dialogDetails: false,
+				dialogAddRecord: false,
+				deleteDialog: false,
+				deleteSetDialog: false,
+				addRecord: {},
+				details: {},
+				deleteId: null,
+				deleteArr: [],
+				workTypeList: [
+					{ id: 1, name: '动火作业' },
+					{ id: 2, name: '受限空间作业' },
+					{ id: 3, name: '吊装作业' },
+					{ id: 4, name: '动土作业' },
+					{ id: 5, name: '断路作业' },
+					{ id: 6, name: '高处作业' },
+					{ id: 7, name: '临时用电作业' },
+					{ id: 8, name: '盲板抽堵作业' }
 				]
-			)
-			const addRef = ref<FormInstance>()
+			});
+
+			const addRef = ref<FormInstance>();
 			const addRules = reactive<FormRules>({
-				time:[{required: true, message: '该内容不能为空',trigger:'blur'}],
-				department:[{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) => {
+				workPermitNo: [{ required: true, message: '该内容不能为空', trigger: 'blur' }],
+				workType: [{ required: true, message: '该内容不能为空', trigger: 'blur' }],
+				combustible: [{ required: true, message: '该内容不能为空', trigger: 'blur' }],
+				oxygen: [{ required: true, message: '该内容不能为空', trigger: 'blur' }],
+				carbonMonoxide: [{ required: true, message: '该内容不能为空', trigger: 'blur' }],
+				hydrogenSulfide: [{ required: true, message: '该内容不能为空', trigger: 'blur' }],
+				info: [{ required: true, message: '该内容不能为空', trigger: 'blur' }]
+			});
+
+			// 页面载入时执行方法
+			onMounted(() => {
+				// getListByPage()
+				getAllDepartment()
+			});
+
+			// 获取部门列表
+			const getAllDepartment = async () => {
+				let res = await teamManageApi().getAllDepartment();
+				if (res.data.code === '200') {
+					state.departmentList = JSON.parse(JSON.stringify(res.data.data))
+				} else {
+					ElMessage({
+						type: 'warning',
+						message: res.data.msg
+					});
+				}
+			};
+
+			// 分页获取气体检测列表
+			const getListByPage = async () => {
+				getAll()
+				const data = { pageSize: state.pageSize, pageIndex: state.pageIndex, searchParams: { workType: state.workType, workPermitNo: state.workPermitNo } };
+				let res = await workProcessApi().getDetectionListPage(data);
+				if (res.data.code === '200') {
+					state.tableData = JSON.parse(JSON.stringify(res.data.data))
+					state.totalSize = res.data.total;
+				} else {
+					ElMessage({
+						type: 'warning',
+						message: res.data.msg
+					});
+				}
+			};
+
+			// 获取用户列表
+			const getAll = async ()=>{
+				const res = await workApplyApi().getAllUsers()
+				if (res.data.code === '200') {
+					state.workerList = JSON.parse(JSON.stringify(res.data.data))
+				} else {
+					ElMessage({
+						type: 'warning',
+						message: res.data.msg
+					});
+				}
+			};
+
+			// 关键词查询记录
+			const searchRecord = async () => {
+				if (state.workPermitNo == ''&& state.workType == null) {
+					ElMessage({
+						type: 'warning',
+						message: '请输入查询关键词'
+					});
+				} else {
+					getListByPage();
+				}
+			};
+
+			const clearSearch = async () => {
+				state.workPermitNo = '';
+				state.workType = null;
+				getListByPage();
+			};
+
+			// 添加气体检测方法
+			const addRecord = async (data: any) => {
+				let res = await workProcessApi().postDetectionReport(data);
+				if (res.data.code === '200') {
+					ElMessage({
+						type: 'success',
+						message: res.data.msg
+					});
+					getListByPage();
+				} else {
+					ElMessage({
+						type: 'warning',
+						message: res.data.msg
+					});
+				}
+			};
+
+			// 点击修改
+			const editRecordBtn = (index, row) => {
+				state.dialogAddRecord = true;
+				state.chosenIndex = index;
+				state.addRecord = JSON.parse(JSON.stringify(row));
+				console.log(state.addRecord, 'state.addRecord');
+			};
+
+			// 新增修改记录
+			const confirmAddRecord = async (formEl: FormInstance | undefined) => {
+				if (!formEl) return;
+				await formEl.validate(async (valid, fields) => {
 					if (valid) {
-						if(chosenIndex.value == -1){
-							tableData.unshift(addRecord.value)
-						}else{
-							tableData[chosenIndex.value] = addRecord.value
-						}
-						dialogAddRecord.value =false
+						const data = {
+							workPermitNo: state.addRecord.workPermitNo,
+							info: state.addRecord.info,
+							combustible: Number(state.addRecord.combustible),
+							oxygen: Number(state.addRecord.oxygen),
+							carbonMonoxide: Number(state.addRecord.carbonMonoxide),
+							hydrogenSulfide: Number(state.addRecord.hydrogenSulfide),
+							source: 2,
+						};
+						await addRecord(data);
+						state.dialogAddRecord = false;
+						getListByPage();
 					} else {
-						console.log('error submit!', fields)
+						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 myChart = ref<HTMLElement>()
-			const myCharts = ref<any>()
-			const openChart =()=>{
-				type EChartsOption = echarts.ComposeOption<
-						| TooltipComponentOption
-						| GridComponentOption
-						| LegendComponentOption
-						| BarSeriesOption
-						>;
-				myCharts.value = echarts.init(myChart.value!);
-				const option: EChartsOption = {
-					tooltip: {
-						trigger: 'axis',
-						axisPointer: {
-							// Use axis to trigger tooltip
-							type: 'shadow' // 'shadow' as default; can also be 'line' or 'shadow'
-						}
-					},
-					legend: {},
-					grid: {
-						left: '3%',
-						right: '3%',
-						bottom: '3%',
-						containLabel: true
-					},
-					xAxis: {
-						type: 'value'
-					},
-					yAxis: {
-						type: 'category',
-						data: ['部门A', '部门B', '部门C', '部门D', '部门E', '部门F', '部门G']
-					},
-					series: [
-						{
-							name: '动火作业',
-							type: 'bar',
-							stack: 'total',
-							label: {
-								show: true
-							},
-							emphasis: {
-								focus: 'series'
-							},
-							data: [320, 302, 301, 334, 390, 330, 320]
-						},
-						{
-							name: '受限空间作业',
-							type: 'bar',
-							stack: 'total',
-							label: {
-								show: true
-							},
-							emphasis: {
-								focus: 'series'
-							},
-							data: [120, 132, 101, 134, 90, 230, 210]
-						},
-						{
-							name: '吊装作业',
-							type: 'bar',
-							stack: 'total',
-							label: {
-								show: true
-							},
-							emphasis: {
-								focus: 'series'
-							},
-							data: [220, 182, 191, 234, 290, 330, 310]
-						},
-						{
-							name: '动土作业',
-							type: 'bar',
-							stack: 'total',
-							label: {
-								show: true
-							},
-							emphasis: {
-								focus: 'series'
-							},
-							data: [150, 212, 201, 154, 190, 330, 410]
-						},
-						{
-							name: '断路作业',
-							type: 'bar',
-							stack: 'total',
-							label: {
-								show: true
-							},
-							emphasis: {
-								focus: 'series'
-							},
-							data: [820, 832, 901, 934, 1290, 1330, 1320]
-						},
-						{
-							name: '高处作业',
-							type: 'bar',
-							stack: 'total',
-							label: {
-								show: true
-							},
-							emphasis: {
-								focus: 'series'
-							},
-							data: [820, 832, 901, 934, 1290, 1330, 1320]
-						},
-						{
-							name: '临时用电作业',
-							type: 'bar',
-							stack: 'total',
-							label: {
-								show: true
-							},
-							emphasis: {
-								focus: 'series'
-							},
-							data: [820, 832, 901, 934, 1290, 1330, 1320]
-						},
-						{
-							name: '盲板抽堵作业',
-							type: 'bar',
-							stack: 'total',
-							label: {
-								show: true
-							},
-							emphasis: {
-								focus: 'series'
-							},
-							data: [820, 832, 901, 934, 1290, 1330, 1320]
-						}
-					]
-				};
+			const handleSizeChange = (val: number) => {
+				state.pageSize = val;
+				getListByPage();
+			};
+			const handleCurrentChange = (val: number) => {
+				state.pageIndex = val;
+				getListByPage();
+			};
 
-				option && myCharts.value.setOption(option);
-			}
+			// 查看记录
+			const viewRecord = (row) => {
+				state.details = JSON.parse(JSON.stringify(row));
+				state.dialogDetails = true;
+			};
+
+			// 刷新
+			const reLoadData = async () => {
+				getListByPage();
+			};
+
+
+			// 删除班组策略方法
+			const deleteRecord = async (data: any) => {
+				let res = await teamStrategyApi().deleteRecord(data);
+				if (res.data.code === '200') {
+					ElMessage({
+						type: 'success',
+						message: res.data.msg
+					});
+					getListByPage();
+				} else {
+					ElMessage({
+						type: 'warning',
+						message: res.data.msg
+					});
+				}
+			};
+
+			const deleteRecordBtn = (row) => {
+				state.deleteId = row.groupStrategyId;
+				state.deleteDialog = true;
+			};
+
+			const conFirmDelete = () => {
+				deleteRecord({ groupStrategyId: state.deleteId });
+				state.deleteDialog = false;
+			};
+
+
+			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
+				Session.set('projectId', value);
+				userInfos.value.projectId = value;
 				await initBackEndControlRoutes();
 			};
+			return {
+				addRef,
+				addRules,
+				View,
+				Edit,
+				Delete,
+				Refresh,
+				Plus,
+				Search,
+				searchRecord,
+				clearSearch,
+				viewRecord,
+				editRecordBtn,
+				deleteRecordBtn,
+				conFirmDelete,
+				getListByPage,
+				reLoadData,
+				handleSizeChange,
+				handleCurrentChange,
+				confirmAddRecord,
+				closeAdd,
+				openAdd,
+				indexClear,
+				...toRefs(state)
+			};
+		}
+	};
 </script>
 
 <style scoped lang="scss">
 	$homeNavLengh: 8;
+	.red{
+		color: red;
+	}
 	.home-container {
-		height: 100%;
+		height: calc(100vh - 144px);
+		box-sizing: border-box;
 		overflow: hidden;
-		padding: 20px;
-		.homeCard{
+		.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{
+		.el-row {
 			display: flex;
 			align-items: center;
 			margin-bottom: 20px;
 			&:last-child {
 				margin-bottom: 0;
 			}
-			.grid-content{
+			.grid-content {
 				align-items: center;
 				min-height: 36px;
 			}
 
 			.topInfo {
+				width: 100%;
 				display: flex;
 				align-items: center;
 				font-size: 16px;
 				font-weight: bold;
 
-				&>div{
+				& > div {
 					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;
 			}
 		}
 	}
 	.el-input{
 		width: 100% !important;
 	}
-	.el-date-editor::v-deep{
+	::v-deep(.el-date-editor){
 		width: 100%;
 	}
 	.el-select{
 		width: 100%;
 	}
+	:deep(.el-cascader){
+		width: 100% !important;
+	}
 </style>

--
Gitblit v1.9.2