add shop module

wangzhibo

6 天以前 7bd866831780abcf5a59c4cbb7d1be456eea7c99

 src/modules/monitor/components/site-tree.vue

@@ -13,32 +13,21 @@

      <div class="site-tree__container">
         <el-scrollbar>
            <el-tree
               v-loading="loading"
               node-key="a_id"
               default-expand-all
               :data="list"
               :props="{
                  label: 'a_name',
                  children: 'children'
               }"
               highlight-current
               :expand-on-click-node="false"
               @node-click="rowClick"
            >
            <el-tree v-loading="loading" node-key="a_id" default-expand-all :data="list" :props="{
               label: 'a_name',
               children: 'children'
            }" highlight-current :expand-on-click-node="false" @node-click="rowClick">
               <template #default="{ node, data }">
                  <div class="site-tree__node">
                     <span
                        class="site-tree__node-label"
                        :class="{
                           'is-active': data.a_id == selectId
                        }"
                     >
                     <span class="site-tree__node-label" :class="{
                        'is-active': data.a_id == selectId
                     }">
                        {{ node.label }}
                        <span v-if="!/^\d+$/.test(data.a_id)" style="margin-left:6px;color:#67c23a;font-size:12px;">(站点)</span>
                        <span v-if="!/^\d+$/.test(data.a_id)"
                           style="margin-left:6px;color:#67c23a;font-size:12px;">(站点)</span>
                     </span>
                  </div>
               </template>					
               </template>
            </el-tree>
         </el-scrollbar>
      </div>
@@ -66,37 +55,37 @@
const selectId = ref<number | string>();

function buildTree(source: any[]) {
  const map = new Map<string, any>();
  const roots: any[] = [];
  source.forEach(item => {
    map.set(item.a_id, { ...item, children: [] });
  });
  source.forEach(item => {
    const node = map.get(item.a_id);
    if (item.a_parentId && map.has(item.a_parentId)) {
      map.get(item.a_parentId).children.push(node);
    } else {
      roots.push(node);
    }
  });
  return roots;
   const map = new Map<string, any>();
   const roots: any[] = [];
   source.forEach(item => {
      map.set(item.a_id, { ...item, children: [] });
   });
   source.forEach(item => {
      const node = map.get(item.a_id);
      if (item.a_parentId && map.has(item.a_parentId)) {
         map.get(item.a_parentId).children.push(node);
      } else {
         roots.push(node);
      }
   });
   return roots;
}

async function refresh() {
  loading.value = true;
  try {
    const res = await service.basicdata.iot.list();
    const formatList = res.map(item => ({
      ...item,
      a_id: String(item.a_id),
      a_parentId: item.a_parentId === null ? null : String(item.a_parentId)
    }));
    list.value = buildTree(formatList);
  } catch (err) {
    ElMessage.error('加载树形失败');
  } finally {
    loading.value = false;
  }
   loading.value = true;
   try {
      const res = await service.basicdata.iot.getSitelist();
      const formatList = res.map(item => ({
         ...item,
         a_id: String(item.a_id),
         a_parentId: item.a_parentId === null ? null : String(item.a_parentId)
      }));
      list.value = buildTree(formatList);
   } catch (err) {
      ElMessage.error('加载树形失败');
   } finally {
      loading.value = false;
   }
}

// 节点点击
@@ -135,6 +124,7 @@
   &__op {
      display: flex;
      align-items: center;

      .item {
         display: flex;
         justify-content: center;
@@ -146,6 +136,7 @@
         height: 26px;
         width: 26px;
         color: var(--el-text-color-primary);

         &:hover {
            background-color: var(--el-fill-color-light);
         }
@@ -155,6 +146,7 @@
   &__container {
      height: calc(100% - 40px);
      padding: 10px;

      :deep(.el-tree-node__content) {
         height: 38px;
         border-radius: 4px;
@@ -167,6 +159,7 @@
      height: 100%;
      width: 100%;
      box-sizing: border-box;

      &-label {
         display: flex;
         align-items: center;
@@ -176,6 +169,7 @@
         overflow: hidden;
         text-overflow: ellipsis;
         white-space: nowrap;

         &.is-active {
            color: var(--el-color-primary);
         }