| 
					
				 | 
			
			
				@@ -0,0 +1,289 @@ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+<!-- eslint-disable vue/multi-word-component-names --> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+<template> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  <div class="gasReport"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    <customHeader>瓦斯巡检任务管理</customHeader> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    <div class="report-container"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      <a-space class="search-area"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        <a-button type="primary" preIcon="ant-design:plus-outlined" @click="handleEdit">新增任务</a-button> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      </a-space> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      <BasicTable @register="registerTable1"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        <template #action="{ record }"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          <a class="table-action-link" @click="handleManage(record)">管理</a> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          <a class="table-action-link" @click="handleDetail(record)">详情</a> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          <a class="table-action-link" @click="handleEdit(record)">编辑</a> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          <a-popconfirm title="删除内容无法恢复,是否删除" ok-text="确定" cancel-text="取消" @confirm="handleDelete(record)"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            <a class="table-action-link">删除</a> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          </a-popconfirm> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        </template> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      </BasicTable> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      <BasicModal title="任务表单" @register="registerModal1" @ok="handleSubmit"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        <BasicForm @register="registerForm" /> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      </BasicModal> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      <BasicModal title="任务详情列表" :width="1200" @register="registerModal2"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        <BasicTable @register="registerTable2"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          <!-- <template #action="{ record }"> </template> --> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          <template #bodyCell="{ column, text }"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            <template v-if="column.dataIndex == 'isSensor'"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              <div v-if="text == '1'"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                <div class="table-text text-y">是</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              <div v-else> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                <div class="table-text text-n">否</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            </template> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            <template v-if="column.dataIndex == 'checkState'"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              <div v-if="text == '1'"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                <div class="table-text text-y">已检</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              <div v-else> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                <div class="table-text text-n">未检</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            </template> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          </template> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        </BasicTable> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      </BasicModal> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      <BasicModal :width="1200" @register="registerModal3"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        <a-space class="search-area mb-10px"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          <a-popconfirm title="确认操作" ok-text="确定" cancel-text="取消" @confirm="handlePatch('add')"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            <a-button type="primary" preIcon="ant-design:plus-outlined">新增</a-button> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          </a-popconfirm> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          <a-popconfirm title="删除内容无法取消,是否删除" ok-text="确定" cancel-text="取消" @confirm="handlePatch('del')"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            <a-button type="primary" preIcon="ant-design:close-outlined">删除</a-button> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          </a-popconfirm> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        </a-space> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        <BasicTable :rowSelection="rowSelection" @register="registerTable3"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          <!-- <template #action="{ record }"> </template> --> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          <template #bodyCell="{ column, text }"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            <template v-if="column.dataIndex == 'isSensor'"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              <div v-if="text == '1'"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                <div class="table-text text-y">是</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              <div v-else> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                <div class="table-text text-n">否</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            </template> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            <template v-if="column.dataIndex == 'checkState'"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              <div v-if="text == '1'"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                <div class="table-text text-y">已检</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              <div v-else> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                <div class="table-text text-n">未检</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            </template> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          </template> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        </BasicTable> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      </BasicModal> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+</template> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+<script setup lang="ts"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  import { ref, onMounted, nextTick } from 'vue'; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  import customHeader from '/@/components/vent/customHeader.vue'; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  import { taskColumns, pagination, taskschemas, taskDetailsColumns } from './gasInspect.data'; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  import { deleteTeam, operateGasCheckTaskDetail, taskDetailsList, teamAdd, teamEdit, teamList } from './gasInspect.api'; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  import { BasicTable } from '/@/components/Table'; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  import { useListPage } from '/@/hooks/system/useListPage'; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  import { message } from 'ant-design-vue'; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  import { BasicModal, useModal } from '/@/components/Modal'; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  import { BasicForm, useForm } from '/@/components/Form'; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  // 任务列表 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  const { tableContext: tx1 } = useListPage({ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    tableProps: { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      api: teamList, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      columns: taskColumns, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      pagination, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      actionColumn: { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        title: '操作', 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        dataIndex: 'action', 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        width: 250, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        align: 'center', 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        slots: { customRender: 'action' }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      showTableSetting: false, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      useSearchForm: false, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    pagination: true, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  }); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  // 任务详情列表 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  const { tableContext: tx2 } = useListPage({ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    tableProps: { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      api: taskDetailsList, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      beforeFetch: (data) => { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        return { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          ...data, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          taskId: selectedRow.value.id, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        }; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      columns: taskDetailsColumns, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      pagination, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      showActionColumn: false, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      showTableSetting: false, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      useSearchForm: false, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    pagination: true, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  }); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  // 任务管理列表 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  const { tableContext: tx3 } = useListPage({ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    tableProps: { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      api: taskDetailsList, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      beforeFetch: (data) => { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        return { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          ...data, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          taskId: selectedRow.value.id, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        }; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      rowSelection: { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        type: 'checkbox', 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        getCheckboxProps: (record) => { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          return { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            disabled: record.isOtherSelect, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            name: record.id, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          }; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      columns: taskDetailsColumns, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      pagination, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      showActionColumn: false, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      showTableSetting: false, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      useSearchForm: false, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    pagination: true, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  }); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  const [registerTable1, tableContext1] = tx1; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  const [registerTable2] = tx2; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  const [registerTable3, { getSelectRows, reload }, { rowSelection }] = tx3; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  const [registerModal1, modalContext1] = useModal(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  const [registerModal2, modalContext2] = useModal(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  const [registerModal3, modalContext3] = useModal(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  const [registerForm, formContext1] = useForm({ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    showActionButtonGroup: false, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    schemas: taskschemas, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    labelWidth: 170, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  }); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  const selectedRow = ref<any>({}); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  // 任务编辑/新增 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  function handleEdit(record) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    modalContext1.openModal(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    nextTick(async () => { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      await formContext1.resetFields(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      await formContext1.setFieldsValue(record); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    }); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  // 任务删除 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  function handleDelete({ id }) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    deleteTeam({ id }).then(() => { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      message.success('删除成功'); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    }); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  // 任务管理 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  function handleManage(record) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    selectedRow.value = record; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    modalContext3.openModal(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  // 详情管理 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  function handleDetail(record) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    selectedRow.value = record; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    modalContext2.openModal(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  // 关联明细 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  function handlePatch(mode) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    operateGasCheckTaskDetail({ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      taskId: selectedRow.value.id, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      operateList: getSelectRows().map((e) => { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        return { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          deviceId: e.deviceId, //设备id(巡检地址id) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          checkNum: e.checkNum, //巡检次数 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          operateType: mode, //操作类型,新增:add,删除:del 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        }; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      }), 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    }).then(() => { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      message.success('操作成功'); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      reload(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    }); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  function handleSubmit() { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    formContext1.validate().then((formData) => { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      if (formData.id) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        teamEdit(formData).then(() => { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          modalContext1.closeModal(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          tableContext1.reload(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        }); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      } else { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        teamAdd(formData).then(() => { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          modalContext1.closeModal(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          tableContext1.reload(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        }); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    }); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  onMounted(() => {}); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+</script> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+<style lang="less" scoped> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  .gasReport { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    width: 100%; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    height: 100%; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    padding: 80px 10px 15px 10px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    box-sizing: border-box; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    position: relative; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    .search-area { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      margin: 20px 0px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      .area-item { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        display: flex; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        align-items: center; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        .item-text { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          color: #fff; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    .table-text { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      margin-bottom: 5px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    .text-y { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      color: #0be716; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    .text-n { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      color: #ff0000; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    .zxm-picker, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    .zxm-input { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      border: 1px solid #3ad8ff77 !important; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      background-color: #ffffff00 !important; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      color: #fff !important; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  :deep(.zxm-table-thead > tr > th:last-child) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    border-right: 1px solid #91e9fe !important; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  :deep(.zxm-picker-input > input) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    color: #fff; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  :deep(.zxm-select:not(.zxm-select-customize-input) .zxm-select-selector) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    border: 1px solid #3ad8ff77 !important; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    background-color: #ffffff00 !important; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  :deep(.zxm-select-selection-item) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    color: #fff !important; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+</style> 
			 |