taskid:084 remark:'commit'

hx-ai-intelligent/src/view/carbonEmissionManage/carbonEmissionFactorLibrary/index.vue

@@ -36,27 +36,31 @@
           :expanded-keys="expandedKeys"
           :auto-expand-parent="autoExpandParent"
           @expand="onExpand">
-           <template #title="{ emissionName }">
-            <span v-if="emissionName && selectTreeDataValue && emissionName.indexOf(selectTreeDataValue) > -1">
-              {{ emissionName.substring(0, emissionName.indexOf(selectTreeDataValue)) }}
-              <span style="color: #f50">{{ selectTreeDataValue }}</span>
-              {{ emissionName.substring(emissionName.indexOf(selectTreeDataValue) + selectTreeDataValue.length) }}
-            </span>
-            <span v-else>{{ emissionName }}</span>
-          </template>
-        </a-tree>
-        <a-popover v-if="showOperation" placement="rightTop" trigger="focus">
-          <template #content>
-            <div style="display: flex;flex-direction: column;">
-              <a-button type="text" @click="editTreeNodeData">编辑</a-button>
-              <a-button type="text" @click="addTreeNodeData">新增子节点</a-button>
-              <a-button type="text">上移</a-button>
-              <a-button type="text">下移</a-button>
-              <a-button type="text" @click="deleteTreeNode">删除</a-button>
+          <template #title="data">
+            <div class="treeRow">
+              <div>
+                <span v-if="data.emissionName && selectTreeDataValue && data.emissionName.indexOf(selectTreeDataValue) > -1">
+                {{ data.emissionName.substring(0, data.emissionName.indexOf(selectTreeDataValue)) }}
+                <span style="color: #f50" >{{ selectTreeDataValue }}</span>
+                {{ data.emissionName.substring(data.emissionName.indexOf(selectTreeDataValue) + selectTreeDataValue.length) }}
+                </span>
+                <span v-else>{{ data.emissionName }}</span>
+              </div>
+              <a-popover placement="rightTop" trigger="focus">
+                <template #content>
+                  <div style="display: flex;flex-direction: column;">
+                    <a-button type="text" @click="editTreeNodeData">编辑</a-button>
+                    <a-button type="text" @click="addTreeNodeData">新增子节点</a-button>
+                    <a-button type="text">上移</a-button>
+                    <a-button type="text">下移</a-button>
+                    <a-button type="text" @click="deleteTreeNode">删除</a-button>
+                  </div>
+                </template>
+                <MoreOutlined class="actionMore" />
+              </a-popover>
             </div>
           </template>
-          <MoreOutlined style="position: absolute;right: 0;top: 16%;font-size: 25px;cursor: pointer;" />
-        </a-popover>
+        </a-tree>
         <div class="addTreeNode">
           <a-button type="primary" style="width:100%;" @click="addTreeNodeData">新增</a-button>
         </div>
@@ -92,6 +96,66 @@
         <a-button type="primary" @click="onEdit">确定</a-button>
       </template>
     </a-drawer>
+    <!-- 单位管理 -->
+    <a-drawer
+      :width="500"
+      :visible="unitManagement"
+      v-if="unitManagement"
+      :body-style="{ paddingBottom: '80px' }"
+      :footer-style="{ textAlign: 'right' }"
+      destroyOnClose
+      title="单位管理"
+      @close="closeUnitManag">
+      <div class="addButton">
+        <a-button type="primary">新增分组</a-button>
+        <a-button type="primary">新增单位</a-button>
+      </div>
+      <div class="treePart">
+        <div style="width: 100%;height: 7%;display: flex;justify-content: center;align-items: center;">
+          <a-select
+            ref="select"
+            :value="unitTreeParams.cnValue"
+            style="width: 96%"
+            placeholder="选择分组"
+            @change="handleChange"
+          >
+            <a-select-option v-for="(item, index) in groupData" :key="index" :value="item.cnValue">
+              {{ item.cnValue }}
+            </a-select-option>
+          </a-select>
+        </div>
+        <a-tree
+          :expandedKeys="unitExpandedKeys"
+          :selectedKeys="unitSelectedKeys"
+          :tree-data="unitTreeData"
+          v-if="unitTreeData && unitTreeData.length > 0"
+        >
+          <template #title="data">
+            <div class="treeRow">
+              <div>
+                <span>{{ data.cnValue }}</span>
+              </div>
+              <a-popover placement="rightTop" trigger="focus">
+                <template #content>
+                  <div style="display: flex;flex-direction: column;">
+                    <a-button type="text" @click="editTreeNodeData">编辑</a-button>
+                    <a-button type="text" @click="addTreeNodeData">新增子节点</a-button>
+                    <a-button type="text">上移</a-button>
+                    <a-button type="text">下移</a-button>
+                    <a-button type="text" @click="deleteTreeNode">删除</a-button>
+                  </div>
+                </template>
+                <MoreOutlined class="actionMore" />
+              </a-popover>
+            </div>
+          </template>
+        </a-tree>
+      </div>
+      <template #footer>
+        <a-button style="margin-right: 8px" @click="closeUnitManag">取消</a-button>
+        <a-button type="primary" @click="onEdit">确定</a-button>
+      </template>
+    </a-drawer>
   </div>
 </template>
 <script lang="ts" setup>
@@ -107,7 +171,7 @@
     AntTreeNodeDropEvent,
     TreeProps,
   } from 'ant-design-vue/es/tree';
-import { log } from 'node:console';
+  import { log } from 'node:console';
 
   defineOptions({ name: 'OrderListIndex' });
   const selectTreeDataValue = ref<string>('');
@@ -116,6 +180,7 @@ import { log } from 'node:console';
   let formData = ref({});
   const formRef = ref();
   const visible = ref(false);
+  const unitManagement = ref(false);
   const searchValue = ref<string>('');
   const searchValue2 = ref<string>('');
   const disabled = ref(false);
@@ -428,7 +493,9 @@ import { log } from 'node:console';
     formData.value = {};
     userAuthList.value.splice(0);
   };
-
+  const closeUnitManag = () => {
+    unitManagement.value = false;
+  };
   const onEdit = () => {
     formRef.value?.triggerSubmit().then(() => {
       console.log(formData.value, 'formData.value');
@@ -497,6 +564,20 @@ import { log } from 'node:console';
         api: carbonEmissionFactorLibrary.del,
         dynamicParams: { ids: 'id[]' },
       },
+      {
+        label: '单位管理',
+        type: 'primary',
+        name: 'userAdd',
+        handle: () => {
+          unitManagement.value = true,
+          fetch(carbonEmissionFactorLibrary.findOutermost).then((res) => {
+            groupData.value = res.data
+          });
+          fetch(carbonEmissionFactorLibrary.dictionaryUnitManagement, unitTreeParams.value).then((res) => {
+            unitTreeData.value = res.data
+          });
+        },
+      },
     ],
     columns: [
       {
@@ -679,6 +760,22 @@ import { log } from 'node:console';
     // pagination: { defaultPageSize: 10 },
     rowKey: 'id',
   });
+  
+  // 单位管理
+  const unitExpandedKeys = ref<string[]>();
+  const unitSelectedKeys = ref<string[]>([]);
+  const unitTreeParams  = ref({
+    grp: 'MEASUREMENT_UNIT'
+  })
+  const groupData = ref([])
+  const unitTreeData = ref<TreeProps['treeData']>(genData);
+  const handleChange = (value: string) => {
+    unitTreeParams.value.cnValue = value
+    fetch(carbonEmissionFactorLibrary.dictionaryUnitManagement, unitTreeParams.value).then((res) => {
+      unitTreeData.value = res.data
+    });
+  };
+
 </script>
 <style lang="less" scoped>
   .main {
@@ -696,7 +793,6 @@ import { log } from 'node:console';
       // box-shadow: @ns-content-box-shadow;
       flex: 1;
     }
-
     display: flex;
     flex-direction: column;
     .top{
@@ -727,4 +823,34 @@ import { log } from 'node:console';
     padding-bottom: 10px;
     border-bottom: 1px solid #e9e9e9;
   }
+  .treeRow {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+  }
+  .addButton{
+    width: 70%;
+    height: 5vh;
+    display: flex;
+    align-items: center;
+    justify-content: space-evenly;
+  }
+  .treePart{
+    width: 70%;
+    height: 100%;
+    display: flex;
+    border: 1px solid #bfbfbf;
+    margin-left: 10%;
+    flex-direction: column;
+  }
+  .actionMore {
+    display: none;
+  }
+  :deep(.ant-tree-node-content-wrapper) {
+    &:hover {
+      .actionMore {
+        display: block;
+      }
+    }
+  }
 </style>