From 734bb3e004304c933b0d01ee986d710be2ed5b25 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=88=98=E5=A6=8D?= <1455167345@qq.com>
Date: Thu, 18 Jul 2024 11:36:57 +0800
Subject: [PATCH] =?UTF-8?q?=E5=9B=BE=E6=96=91=E8=B0=83=E6=95=B4=E4=BC=98?=
 =?UTF-8?q?=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../tiankongdi/changearea/MapList/index.vue   | 908 +++++++++---------
 1 file changed, 461 insertions(+), 447 deletions(-)

diff --git a/src/views/demo/tiankongdi/changearea/MapList/index.vue b/src/views/demo/tiankongdi/changearea/MapList/index.vue
index f10404ad..0952f5fb 100644
--- a/src/views/demo/tiankongdi/changearea/MapList/index.vue
+++ b/src/views/demo/tiankongdi/changearea/MapList/index.vue
@@ -147,7 +147,7 @@
       </div>
     </div>
     <div class="data-list-div" style="padding-top: 1px;">
-      <div v-for="(item, index) in infoDataList" :key="index" :class="item.id == selectId ? 'data-list-item checked' : 'data-list-item'">
+      <div v-for="(item, index) in infoDataList" :key="index" :class="classFun(item)">
         <div class="data-list-layout-div">
           <div class="data-list-title-div">
             <img
@@ -156,7 +156,7 @@
               style="cursor: pointer"
               @click="locationFun(item)"
             />
-            <div class="label-div" @click="selectAreaId(item.id)">
+            <div class="label-div" @click="selectAreaId(item)">
               <div class="item-label">{{ item.countyname }}</div>
               <div class="item-sub-label">
                 <span style="margin-right: 12px">{{ item.streetname }}</span>
@@ -170,7 +170,7 @@
           </div>
         </div>
         <div class="data-list-info-div">
-          <div class="info-layout-div" @click="selectAreaId(item.id)">
+          <div class="info-layout-div" @click="selectAreaId(item)">
             <div class="info-item">
               <div class="info-label">总面积</div>
               <div class="info-data">{{ item.area }}亩</div>
@@ -243,485 +243,499 @@
 </template>
 
 <script setup lang="ts">
-  import { ref, onMounted, defineEmits, computed, h } from 'vue';
-  import { SearchOutlined ,DownOutlined,SendOutlined} from '@ant-design/icons-vue';
-  import Icon from '@/components/Icon/Icon.vue';
-  import { getLoadDroneCaseInfoDetail,getCaseInfoById } from '@/api/tiankongdi/index';
-  import {
-    batchOptions,
-    yearOptions,
-    patchSourceOptions,
-  } from '@/views/demo/tiankongdi/curbspotcity/util';
-  import Amend from './amend.vue';
-  import { Empty ,Spin,message} from 'ant-design-vue';
-  import ShowInfoModal from '@/views/demo/tiankongdi/curbspotcity/MapList/ShowInfoModal/index.vue';
+import { ref, onMounted, defineEmits, computed, h } from 'vue';
+import { SearchOutlined, DownOutlined, SendOutlined } from '@ant-design/icons-vue';
+import Icon from '@/components/Icon/Icon.vue';
+import { getLoadDroneCaseInfoDetail, getCaseInfoById } from '@/api/tiankongdi/index';
+import {
+  batchOptions,
+  yearOptions,
+  patchSourceOptions,
+} from '@/views/demo/tiankongdi/curbspotcity/util';
+import Amend from './amend.vue';
+import { Empty, message } from 'ant-design-vue';
+import ShowInfoModal from '@/views/demo/tiankongdi/curbspotcity/MapList/ShowInfoModal/index.vue';
 
-  const modalShow = ref(false);
-  const simpleImage = Empty.PRESENTED_IMAGE_SIMPLE;
-  const pageSize = ref(10);
-  const pageNo = ref(1);
-  const total = ref(0)
-  const mapStatusOptions = ref([
-    {
-      label: '正常',
-      value: '正常',
-    },
-    {
-      label: '分割后关闭',
-      value: '分割后关闭',
-    },
-  ])
-  const modalRecord = ref('');
-  const emits = defineEmits([
-    'changeSpin',
-    'changeTask'
-  ]);
-  const order = ref(0); // 0: 不排序 1: 升序 2: 降序
-  const showSortMark = (key, sort) => {
-  if(infoScreenData.value.sort === key && sort === order.value){
-    return true
-  }
-  return false
-}
-
-  const infoDataList = ref([]);
-  const infoScreenData:any = ref({
-    year: null,
-    picihao: null,
-    batch: null,
-    countyid: null,
-    streetid: null,
-    geomid: null,
-    nowStatus: null,
-    is_illegal: null,
-    weifaleixing: null,
-    measure_name: null,
-    handle_status_id: null,
-    is_build_complete: null,
-    areaid: null,
-    level: null,
-    page: 1,
-    limit: 10,
-    sort: null,
-    order: null,
-    type: null,
-  });
-
-  const mapListScreenChange = (value, type) => {
-    console.log(value,type)
-    switch (type) {
-      case 'year':
-        infoScreenData.value.year = value;
-        break;
-      case 'batch':
-        infoScreenData.value.picihao = value;
-        break;
-      case 'caseNo':
-        infoScreenData.value.caseNo = value;
-        break;
-      case 'countyid':
-        infoScreenData.value.countyid = value;
-        getStreetOrgs(value);
-        break;
-      case 'streetid':
-        infoScreenData.value.streetid = value;
-        break;
-      case 'isIllegal':
-        infoScreenData.value.isIllegal = value;
-        if (value !== 1) {
-          infoScreenData.value.weifaleixing = null;
-          infoScreenData.value.measureName = null;
-        }
-        break;
-      case 'illegalType':
-        infoScreenData.value.weifaleixing = value;
-        if (value !== 0) {
-          infoScreenData.value.measureName = null;
-        }
-        break;
-      case 'measureName':
-        infoScreenData.value.measureName = value;
-        break;
-      case 'isBuildName':
-        infoScreenData.value.isBuildName = value;
-        break;
-      case 'mapStatus':
-        if(value.length > 0){
-          infoScreenData.value.isSplit = value.join(',')
-        }else{
-          delete infoScreenData.value.isSplit
-        }
-        break;
-    }
-  };
-  const getInfoList = () => {
-    emits('changeSpin',true)
-    getLoadDroneCaseInfoDetail(infoScreenData.value).then((res) => {
-      infoDataList.value = res.items;
-      total.value = res.total
-    }).finally(() => {
-      emits('changeSpin',false)
-    })
-  };
-  const showInfoOpen = ref(false);
-  const openCollect = computed(() => {
-    if (!infoScreenData.value.type) return false;
+const modalShow = ref(false);
+const simpleImage = Empty.PRESENTED_IMAGE_SIMPLE;
+const pageSize = ref(10);
+const pageNo = ref(1);
+const total = ref(0);
+const mapStatusOptions = ref([
+  {
+    label: '正常',
+    value: '正常',
+  },
+  {
+    label: '分割后关闭',
+    value: '分割后关闭',
+  },
+]);
+const modalRecord = ref('');
+const emits = defineEmits(['changeSpin', 'changeTask']);
+const order = ref(0); // 0: 不排序 1: 升序 2: 降序
+const showSortMark = (key, sort) => {
+  if (infoScreenData.value.sort === key && sort === order.value) {
     return true;
-  });
-  const showInfoData = ref();
-  onMounted(() => {
-    getInfoList();
+  }
+  return false;
+};
 
-  });
-// 查看位置
-  async function locationFun(record) {
-    console.log(record);
-    emits('changeTask', record.geomid);
+const infoDataList = ref([]);
+const infoScreenData: any = ref({
+  year: null,
+  picihao: null,
+  batch: null,
+  countyid: null,
+  streetid: null,
+  geomid: null,
+  nowStatus: null,
+  is_illegal: null,
+  weifaleixing: null,
+  measure_name: null,
+  handle_status_id: null,
+  is_build_complete: null,
+  areaid: null,
+  level: null,
+  page: 1,
+  limit: 10,
+  sort: null,
+  order: null,
+  type: null,
+});
+const selectItem = ref();
+const classFun = (item) => {
+  let string = 'data-list-item';
+  if (selectItem.value && item.id == selectItem.value.id) {
+    string += ' checked';
   }
-  const changePage = (page, pageSize) => {
-    infoScreenData.value.page = page;
-    infoScreenData.value.limit = pageSize;
-    getInfoList();
-  };
-  // 查看接受处理里收藏的
-  const getCollectList = () => {
-    let collect = infoScreenData.value.type;
-    console.log(collect)
-    if (collect === '' || collect == null) {
-      infoScreenData.value.type = 1;
-    } else if (collect === 1) {
-      delete infoScreenData.value.type
-    }
-    getInfoList()
-  };
-  const dataListSort = (type) => {
-    order.value = (order.value + 1) % 3;
-    switch(order.value){
-      case 0:
-       delete infoScreenData.value.sort 
-       delete infoScreenData.value.order 
-        break
-      case 1:
-        infoScreenData.value.sort = type
-        infoScreenData.value.order = 'asc'
-        break
-      case 2:
-        infoScreenData.value.sort = type
-        infoScreenData.value.order = 'desc'
-        break
-    }
-    getInfoList();
-  };
-  const showInfo = (item) => {
-    getCaseInfoById({ id: item.processid }).then((res) => {
-      showInfoData.value = res;
-      showInfoOpen.value = true;
+  if (item.unitname == '已关闭') {
+    string += ' close-div';
+  }
+  return string;
+};
+const mapListScreenChange = (value, type) => {
+  switch (type) {
+    case 'year':
+      infoScreenData.value.year = value;
+      break;
+    case 'batch':
+      infoScreenData.value.picihao = value;
+      break;
+    case 'caseNo':
+      infoScreenData.value.caseNo = value;
+      break;
+    case 'countyid':
+      infoScreenData.value.countyid = value;
+      break;
+    case 'streetid':
+      infoScreenData.value.streetid = value;
+      break;
+    case 'isIllegal':
+      infoScreenData.value.isIllegal = value;
+      if (value !== 1) {
+        infoScreenData.value.weifaleixing = null;
+        infoScreenData.value.measureName = null;
+      }
+      break;
+    case 'illegalType':
+      infoScreenData.value.weifaleixing = value;
+      if (value !== 0) {
+        infoScreenData.value.measureName = null;
+      }
+      break;
+    case 'measureName':
+      infoScreenData.value.measureName = value;
+      break;
+    case 'isBuildName':
+      infoScreenData.value.isBuildName = value;
+      break;
+    case 'mapStatus':
+      if (value.length > 0) {
+        infoScreenData.value.isSplit = value.join(',');
+      } else {
+        delete infoScreenData.value.isSplit;
+      }
+      break;
+  }
+};
+const getInfoList = () => {
+  emits('changeSpin', true);
+  getLoadDroneCaseInfoDetail(infoScreenData.value)
+    .then((res) => {
+      infoDataList.value = res.items;
+      total.value = res.total;
+    })
+    .finally(() => {
+      emits('changeSpin', false);
     });
+};
+const showInfoOpen = ref(false);
+const openCollect = computed(() => {
+  if (!infoScreenData.value.type) return false;
+  return true;
+});
+const showInfoData = ref();
+onMounted(() => {
+  getInfoList();
+});
+// 查看位置
+async function locationFun(record) {
+  console.log(record);
+  emits('changeTask', record.geomid);
+}
+const changePage = (page, pageSize) => {
+  infoScreenData.value.page = page;
+  infoScreenData.value.limit = pageSize;
+  getInfoList();
+};
+// 查看接受处理里收藏的
+const getCollectList = () => {
+  let collect = infoScreenData.value.type;
+  if (collect === '' || collect == null) {
+    infoScreenData.value.type = 1;
+  } else if (collect === 1) {
+    delete infoScreenData.value.type;
+  }
+  getInfoList();
+};
+const dataListSort = (type) => {
+  order.value = (order.value + 1) % 3;
+  switch (order.value) {
+    case 0:
+      delete infoScreenData.value.sort;
+      delete infoScreenData.value.order;
+      break;
+    case 1:
+      infoScreenData.value.sort = type;
+      infoScreenData.value.order = 'asc';
+      break;
+    case 2:
+      infoScreenData.value.sort = type;
+      infoScreenData.value.order = 'desc';
+      break;
+  }
+  getInfoList();
+};
+const showInfo = (item) => {
+  getCaseInfoById({ id: item.processid }).then((res) => {
+    showInfoData.value = res;
+    showInfoOpen.value = true;
+  });
+};
+function changeArea() {
+  if (!selectItem.value) {
+    message.warning('请选择一条数据进行飞地调整');
+    return;
+  }
+  if (selectItem.value.unitname == '已关闭') {
+    message.warning('已关闭的不能进行飞地调整！');
+    return;
+  }
+  modalShow.value = true;
+  modalRecord.value = selectItem.value.id;
+}
+function selectAreaId(item) {
+  selectItem.value = item;
+}
+const resetScreenData = () => {
+  infoScreenData.value = {
+    limit: pageSize.value,
+    page: pageNo.value,
   };
-  function changeArea() {
-    if(!selectId.value){
-      message.warning('请选择一条数据进行飞地调整')
-      return
-    }
-    modalShow.value = true;
-    modalRecord.value = selectId.value;
-  }
-  const selectId =ref()
-  function selectAreaId(id){
-    selectId.value = id
-  }
-  const resetScreenData = () => {
-    infoScreenData.value = {
-      limit: pageSize.value,
-      page: pageNo.value,
-    }
-    getInfoList();
-  }
-  function closeModal() {
-    modalShow.value = false;
-  }
-  function handleSuccess() {}
-  const handleOperateClick = (e: Event) => {
-    console.log('click', e);
-  };
+  getInfoList();
+};
+function closeModal() {
+  modalShow.value = false;
+}
+function handleSuccess() {}
+const handleOperateClick = (e: Event) => {
+  console.log('click', e);
+};
 </script>
 
 <style lang="less" scoped>
-  .content {
-    height: 100%;
+.content {
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+}
+.screen-div {
+  padding: 10px 12px 20px 13px;
+  display: flex;
+  width: 590px;
+  flex-wrap: wrap;
+  .screen-item {
+    display: flex;
+    height: 39px;
+    .screen-item-label {
+      font-family: Alibaba PuHuiTi;
+      font-weight: 500;
+      font-size: 17px;
+      color: #000000;
+      line-height: 30px;
+      display: flex;
+      align-items: center;
+      margin-right: 9px;
+    }
+    :deep(.ant-select-selector) {
+      display: flex;
+      align-items: center;
+      font-family: HarmonyOS Sans;
+      font-weight: 500;
+      font-size: 19px;
+      color: #000000;
+      line-height: 30px;
+      height: 39px;
+      box-shadow: 2px 3px 3px 1px rgba(13, 13, 13, 0.05);
+    }
+    .item-input {
+      width: 223px;
+      font-family: Alibaba PuHuiTi;
+      font-weight: 500;
+      font-size: 17px;
+      color: #000000;
+      line-height: 30px;
+      box-shadow: 2px 3px 3px 1px rgba(13, 13, 13, 0.05);
+    }
+    .item-time-select {
+      box-shadow: 2px 3px 3px 1px rgba(13, 13, 13, 0.05);
+      :deep(input) {
+        font-family: HarmonyOS Sans;
+        font-weight: 500;
+        font-size: 15px;
+        color: #000000;
+        line-height: 30px;
+      }
+    }
+    .item-button {
+      font-family: Alibaba PuHuiTi;
+      font-weight: 400;
+      color: #ffffff;
+      background: #139af8;
+      margin-left: 4px;
+      height: 39px;
+      font-size: 17px;
+    }
+  }
+  .screen-button-div {
+    display: flex;
+    width: 100%;
+    button {
+      margin-right: 5px;
+    }
+  }
+}
+.pagination-div {
+  background: @component-background;
+  padding: 0 10px 10px;
+}
+.no-data {
+  padding: 20px 0;
+}
+.rollback {
+  background: @component-background;
+  padding: 10px;
+}
+
+::v-deep .ant-modal-content {
+  width: 100vw;
+  height: 100vh;
+  border-radius: 0px;
+}
+
+::v-deep .ant-modal .ant-modal-content {
+  border-radius: 0px !important;
+}
+
+.full-modal {
+  .ant-modal {
+    min-width: 100vw;
+    top: 0px;
+    padding: 0px;
+    margin: 0px;
+  }
+  .ant-modal-content {
     display: flex;
     flex-direction: column;
   }
-  .screen-div {
-    padding: 10px 12px 20px 13px;
+  .ant-modal-body {
+    flex: 1;
+  }
+}
+.modal-content {
+  padding: 15px;
+  width: 100%;
+  height: calc(100vh - 65px);
+  overflow: auto;
+}
+.sift-div {
+  background: #fff;
+  height: 77px;
+  padding: 19px 13px;
+  margin-left: 10px;
+  margin-right: 10px;
+  border-radius: 10px 10px 0px 0px;
+  display: flex;
+  justify-content: space-between;
+  .layout-div {
     display: flex;
-    width: 590px;
-    flex-wrap: wrap;
-    .screen-item {
+    .back-button {
+      font-size: 22px;
+      cursor: pointer;
+    }
+    .interval-div {
+      height: 100%;
+      width: 1px;
+      background: #ededed;
+      margin-left: 10px;
+      margin-right: 10px;
+    }
+    .sift-item {
       display: flex;
-      height: 39px;
-      .screen-item-label {
+      align-items: center;
+      margin-right: 15px;
+      cursor: pointer;
+      user-select: none;
+      .sift-label {
         font-family: Alibaba PuHuiTi;
         font-weight: 500;
-        font-size: 17px;
-        color: #000000;
-        line-height: 30px;
-        display: flex;
-        align-items: center;
-        margin-right: 9px;
-      }
-      :deep(.ant-select-selector) {
-        display: flex;
-        align-items: center;
-        font-family: HarmonyOS Sans;
-        font-weight: 500;
         font-size: 19px;
         color: #000000;
-        line-height: 30px;
-        height: 39px;
-        box-shadow: 2px 3px 3px 1px rgba(13, 13, 13, 0.05);
       }
-      .item-input {
-        width: 223px;
+      .sift-icon {
+        font-size: 9px;
+        margin-left: 5px;
+        opacity: 0.53;
+      }
+    }
+  }
+  .collect-div {
+    display: flex;
+    align-items: center;
+  }
+}
+.data-list-div {
+  flex: 1;
+  overflow: auto;
+  padding: 10px;
+  scrollbar-width: none; /* firefox */
+  -ms-overflow-style: none; /* IE 10+ */
+  .data-list-item {
+    background: #fff;
+    padding: 10px;
+    // border-radius:6px;
+    margin-bottom: 1px;
+
+    .data-list-layout-div {
+      display: flex;
+      justify-content: space-between;
+      padding-bottom: 8px;
+      border-bottom: 1px solid #e5e5e5;
+      height: 45px;
+      .data-list-title-div {
+        display: flex;
+        align-items: center;
+        .map-mark {
+          width: 17px;
+          height: 17px;
+        }
+        .label-div {
+          display: flex;
+          align-items: baseline;
+          margin-right: 12px;
+          cursor: pointer;
+        }
+        .item-label {
+          font-family: Alibaba PuHuiTi;
+          font-weight: 500;
+          font-size: 23px;
+          color: #000000;
+          margin-left: 9px;
+          margin-right: 10px;
+        }
+        .item-sub-label {
+          font-family: Alibaba PuHuiTi;
+          font-weight: 500;
+          font-size: 17px;
+          color: #000000;
+        }
+        .item-mark {
+          font-family: Alibaba PuHuiTi;
+          font-weight: 500;
+          font-size: 13px;
+          margin-left: 17px;
+          color: #696969;
+        }
+      }
+      .data-item-type-div {
         font-family: Alibaba PuHuiTi;
         font-weight: 500;
-        font-size: 17px;
-        color: #000000;
-        line-height: 30px;
-        box-shadow: 2px 3px 3px 1px rgba(13, 13, 13, 0.05);
+        font-size: 15px;
+        color: #696969;
+        display: flex;
+        align-items: center;
+        cursor: pointer;
+        user-select: none;
       }
-      .item-time-select {
-        box-shadow: 2px 3px 3px 1px rgba(13, 13, 13, 0.05);
-        :deep(input) {
+    }
+    .data-list-info-div {
+      display: flex;
+      justify-content: space-between;
+      padding-top: 10px;
+      .info-layout-div {
+        display: flex;
+        align-items: center;
+        cursor: pointer;
+        .info-time {
           font-family: HarmonyOS Sans;
           font-weight: 500;
           font-size: 15px;
           color: #000000;
-          line-height: 30px;
+          margin-right: 5px;
         }
       }
-      .item-button {
-        font-family: Alibaba PuHuiTi;
-        font-weight: 400;
-        color: #ffffff;
-        background: #139AF8;
-        margin-left:4px;
-        height: 39px;
-        font-size: 17px;
-      }
-    }
-    .screen-button-div {
-      display: flex;
-      width: 100%;
-      button {
-        margin-right: 5px;
-      }
-    }
-  }
-  .pagination-div {
-    background: @component-background;
-    padding: 0 10px 10px;
-  }
-  .no-data {
-    padding: 20px 0;
-  }
-  .rollback {
-    background: @component-background;
-    padding: 10px;
-  }
-
-  ::v-deep .ant-modal-content {
-    width: 100vw;
-    height: 100vh;
-    border-radius: 0px;
-  }
-
-  ::v-deep .ant-modal .ant-modal-content {
-    border-radius: 0px !important;
-  }
-
-  .full-modal {
-    .ant-modal {
-      min-width: 100vw;
-      top: 0px;
-      padding: 0px;
-      margin: 0px;
-    }
-    .ant-modal-content {
-      display: flex;
-      flex-direction: column;
-    }
-    .ant-modal-body {
-      flex: 1;
-    }
-  }
-  .modal-content {
-    padding: 15px;
-    width: 100%;
-    height: calc(100vh - 65px);
-    overflow: auto;
-  }
-  .sift-div{
-    background:#fff;
-     height: 77px;
-     padding:19px 13px;
-     margin-left: 10px;
-     margin-right: 10px;
-     border-radius: 10px 10px 0px 0px;
-     display: flex;
-     justify-content: space-between;
-     .layout-div{
-      display:flex;
-      .back-button{
-        font-size:22px;
-        cursor:pointer;
-      }
-      .interval-div{
-        height:100%;
-        width:1px;
-        background:#EDEDED;
-        margin-left: 10px;
-        margin-right: 10px;
-      }
-      .sift-item{
+      .info-item {
         display: flex;
+        background: rgba(237, 237, 237, 0.55);
         align-items: center;
-        margin-right:15px;
-        cursor:pointer;
-        user-select:none;
-        .sift-label{
+        width: 110px;
+        border-radius: 7px;
+        margin-right: 8px;
+        height: 30px;
+        justify-content: center;
+        .info-label {
           font-family: Alibaba PuHuiTi;
+          font-weight: 400;
+          font-size: 16px;
+          color: #959494;
+          // width:45%;
+          display: flex;
+          justify-content: center;
+          padding-right: 5px;
+        }
+        .info-data {
+          font-family: HarmonyOS Sans;
           font-weight: 500;
-          font-size: 19px;
+          font-size: 16px;
           color: #000000;
         }
-        .sift-icon{
-          font-size: 9px;
-          margin-left:5px;
-          opacity: 0.53;
-        }
-      }
-     }
-     .collect-div{
-      display:flex;
-      align-items:center;
-     }
-  }
-  .data-list-div {
-    flex: 1;
-    overflow: auto;
-    padding: 10px;
-    scrollbar-width: none; /* firefox */
-    -ms-overflow-style: none; /* IE 10+ */
-    .data-list-item {
-      background: #fff;
-      padding: 10px;
-      // border-radius:6px;
-      margin-bottom: 1px;
-      
-      .data-list-layout-div {
-        display: flex;
-        justify-content: space-between;
-        padding-bottom: 8px;
-        border-bottom: 1px solid #e5e5e5;
-        height: 45px;
-        .data-list-title-div {
-          display: flex;
-          align-items: center;
-          .map-mark {
-            width: 17px;
-            height: 17px;
-          }
-          .label-div {
-            display: flex;
-            align-items: baseline;
-            margin-right: 12px;
-            cursor: pointer;
-          }
-          .item-label {
-            font-family: Alibaba PuHuiTi;
-            font-weight: 500;
-            font-size: 23px;
-            color: #000000;
-            margin-left: 9px;
-            margin-right: 10px;
-          }
-          .item-sub-label {
-            font-family: Alibaba PuHuiTi;
-            font-weight: 500;
-            font-size: 17px;
-            color: #000000;
-          }
-          .item-mark {
-            font-family: Alibaba PuHuiTi;
-            font-weight: 500;
-            font-size: 13px;
-            margin-left: 17px;
-            color: #696969;
-          }
-        }
-        .data-item-type-div {
-          font-family: Alibaba PuHuiTi;
-          font-weight: 500;
-          font-size: 15px;
-          color: #696969;
-          display: flex;
-          align-items: center;
-          cursor: pointer;
-          user-select: none;
-        }
-      }
-      .data-list-info-div {
-        display: flex;
-        justify-content: space-between;
-        padding-top: 10px;
-        .info-layout-div {
-          display: flex;
-          align-items: center;
-          cursor: pointer;
-          .info-time {
-            font-family: HarmonyOS Sans;
-            font-weight: 500;
-            font-size: 15px;
-            color: #000000;
-            margin-right: 5px;
-          }
-        }
-        .info-item {
-          display: flex;
-          background: rgba(237, 237, 237, 0.55);
-          align-items: center;
-          width: 110px;
-          border-radius: 7px;
-          margin-right: 8px;
-          height: 30px;
-          justify-content: center;
-          .info-label {
-            font-family: Alibaba PuHuiTi;
-            font-weight: 400;
-            font-size: 16px;
-            color: #959494;
-            // width:45%;
-            display: flex;
-            justify-content: center;
-            padding-right: 5px;
-          }
-          .info-data {
-            font-family: HarmonyOS Sans;
-            font-weight: 500;
-            font-size: 16px;
-            color: #000000;
-          }
-        }
       }
     }
-    .data-list-item:nth-last-child(1) {
-      border-bottom-left-radius: 6px;
-      border-bottom-right-radius: 6px;
-    }
-    .data-list-item.checked{
-      background:#EFF3FC;
-      border: 1px solid #139AF8;
-      }
   }
+  .data-list-item:nth-last-child(1) {
+    border-bottom-left-radius: 6px;
+    border-bottom-right-radius: 6px;
+  }
+  .data-list-item.checked {
+    border: 1px solid #139af8;
+  }
+  .data-list-item.close-div {
+    background: #eff3fc;
+  }
+  .data-list-item.checked.close-div {
+    background: #eff3fc;
+    border: 1px solid #139af8;
+  }
+}
 </style>