|
|
@@ -25,8 +25,15 @@
|
|
|
</a-radio-button>
|
|
|
</a-radio-group>
|
|
|
<div style="display: flex; align-items: center">
|
|
|
- <a-input />
|
|
|
- <span style="margin-left: 8px; width: 100px">类目搜索</span>
|
|
|
+ <a-select
|
|
|
+ v-model:value="searchName"
|
|
|
+ show-search
|
|
|
+ :allow-clear="true"
|
|
|
+ :options="options"
|
|
|
+ placeholder="请选择分类"
|
|
|
+ style="width: 380px"
|
|
|
+ />
|
|
|
+ <span style="margin: 0 16px 0 8px">类目搜索</span>
|
|
|
</div>
|
|
|
</div>
|
|
|
</a-layout-header>
|
|
|
@@ -64,22 +71,22 @@
|
|
|
class="list-item"
|
|
|
>
|
|
|
<div class="left fl">
|
|
|
- {{ item.parent }}
|
|
|
+ <span class="parent_name">{{ item.parent }}</span>
|
|
|
<span class="jt_icon"> > </span>
|
|
|
</div>
|
|
|
<div class="right fl">
|
|
|
<ul>
|
|
|
- <template v-if="item.children">
|
|
|
+ <template v-if="item.children && item.children.length">
|
|
|
<li
|
|
|
v-for="(asset, index1) in item.children"
|
|
|
:key="index1"
|
|
|
@click="selectAsset(asset)"
|
|
|
>
|
|
|
- {{ asset }}
|
|
|
+ {{ asset.text }}
|
|
|
</li>
|
|
|
</template>
|
|
|
<template v-else>
|
|
|
- <li />
|
|
|
+ <li><span> </span></li>
|
|
|
</template>
|
|
|
</ul>
|
|
|
</div>
|
|
|
@@ -109,6 +116,8 @@ const list = ref([]);
|
|
|
const openKeys = ref([]);
|
|
|
const selectedKeys1 = ref([]);
|
|
|
const menuList = ref([]);
|
|
|
+const searchName = ref([]);
|
|
|
+const options = ref([]);
|
|
|
|
|
|
const emit = defineEmits(['getStepInfo', 'getAllName']);
|
|
|
const props = defineProps({
|
|
|
@@ -129,8 +138,11 @@ const selectedKeys = ref([]);
|
|
|
// 菜单一级目录
|
|
|
const assetItems = ref([]);
|
|
|
|
|
|
-// 所有资产分类数据
|
|
|
-const assetCategorys = ref([]);
|
|
|
+// 通用资产分类数据
|
|
|
+const assetCommonCategorys = ref([]);
|
|
|
+
|
|
|
+// 明细资产分类数据
|
|
|
+const assetDetailCategorys = ref([]);
|
|
|
|
|
|
const secondMenu = ref([]);
|
|
|
|
|
|
@@ -144,23 +156,20 @@ const allName = ref('');
|
|
|
const addNewAssets = () => {
|
|
|
step.value = '1';
|
|
|
emit('getStepInfo', '1');
|
|
|
- getAssetCategorys();
|
|
|
+ getCommonAssetCategorys();
|
|
|
+ getDetailAssetCategorys();
|
|
|
};
|
|
|
|
|
|
// 当通用资产切换类别时获取对应的子分类
|
|
|
const changeAssets = key => {
|
|
|
- const thirdMenu = [];
|
|
|
secondMenu.value = [];
|
|
|
- assetCategorys.value.forEach(item => {
|
|
|
+ assetCommonCategorys.value.forEach(item => {
|
|
|
if (item.id === key) {
|
|
|
if (item.children && item.children.length > 0) {
|
|
|
item.children.forEach((child, index) => {
|
|
|
if (child.children && child.children.length > 0) {
|
|
|
- child.children.forEach(child1 => {
|
|
|
- thirdMenu.push(child1.text);
|
|
|
- });
|
|
|
secondMenu.value.push({ parent: child.text });
|
|
|
- secondMenu.value[index].children = thirdMenu;
|
|
|
+ secondMenu.value[index].children = child.children;
|
|
|
} else {
|
|
|
secondMenu.value.push({ parent: child.text });
|
|
|
}
|
|
|
@@ -168,6 +177,9 @@ const changeAssets = key => {
|
|
|
}
|
|
|
}
|
|
|
});
|
|
|
+ const parentDiv = document.querySelector('.item-list');
|
|
|
+ const childDiv = parentDiv.querySelector('.ul_list');
|
|
|
+ childDiv.scrollIntoView({ behavior: 'smooth', block: 'start' });
|
|
|
};
|
|
|
|
|
|
// 处理明细资产分类数据
|
|
|
@@ -199,7 +211,7 @@ const changeDetailAsset = key => {
|
|
|
let listMenu = [];
|
|
|
assetName.value = '';
|
|
|
allName.value = '';
|
|
|
- assetCategorys.value.forEach(item => {
|
|
|
+ assetDetailCategorys.value.forEach(item => {
|
|
|
if (item.children && item.children.length) {
|
|
|
item.children.forEach(child => {
|
|
|
if (child.id === key) {
|
|
|
@@ -219,24 +231,28 @@ const changeDetailAsset = key => {
|
|
|
isFirst.value = false;
|
|
|
};
|
|
|
|
|
|
+// 获取通用所选资产
|
|
|
+const selectAsset = record => {
|
|
|
+ console.log(record, '通用资产所选数据------');
|
|
|
+ emit('getStepInfo', step.value, record.text, record);
|
|
|
+};
|
|
|
+
|
|
|
// 获取明细所选资产
|
|
|
-const getAssetName = name => {
|
|
|
+const getAssetName = (name,record) => {
|
|
|
if (name) {
|
|
|
allName.value = '';
|
|
|
allName.value = assetName.value + '->' + name;
|
|
|
}
|
|
|
- emit('getStepInfo', step.value, allName.value);
|
|
|
-};
|
|
|
-
|
|
|
-// 获取当前所选资产
|
|
|
-const selectAsset = asset => {
|
|
|
- emit('getStepInfo', step.value, asset);
|
|
|
+ console.log(record, '明细资产所选数据------');
|
|
|
+ emit('getStepInfo', step.value, allName.value, record);
|
|
|
};
|
|
|
|
|
|
-// 获取资分类数据
|
|
|
-const getAssetCategorys = () => {
|
|
|
+// 获取通用分类数据
|
|
|
+const getCommonAssetCategorys = () => {
|
|
|
$.ajax({
|
|
|
- url: Common.getApiURL('AssetCategoryResource/listRootSubAssetCategorys'),
|
|
|
+ url: Common.getApiURL(
|
|
|
+ 'AssetCategoryResource/listAssetCategorysByCategory?type=CommonlyUsedClassifications',
|
|
|
+ ),
|
|
|
type: 'get',
|
|
|
|
|
|
dataType: 'json',
|
|
|
@@ -254,8 +270,32 @@ const getAssetCategorys = () => {
|
|
|
assetItems.value[index].title = item.text;
|
|
|
});
|
|
|
selectedKeys.value.push(data.datas[0].id);
|
|
|
- assetCategorys.value = data.datas;
|
|
|
+ assetCommonCategorys.value = data.datas;
|
|
|
changeAssets(data.datas[0].id);
|
|
|
+ } else {
|
|
|
+ message.warning(data.errorMessage);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ error: function (XMLHttpRequest, textStatus, errorThrown) {
|
|
|
+ Common.processException(XMLHttpRequest, textStatus, errorThrown);
|
|
|
+ },
|
|
|
+ });
|
|
|
+};
|
|
|
+// 获取明细分类数据
|
|
|
+const getDetailAssetCategorys = () => {
|
|
|
+ $.ajax({
|
|
|
+ url: Common.getApiURL(
|
|
|
+ 'AssetCategoryResource/listAssetCategorysByCategory?type=ItemizedClassification',
|
|
|
+ ),
|
|
|
+ type: 'get',
|
|
|
+
|
|
|
+ dataType: 'json',
|
|
|
+ beforeSend: function (request) {
|
|
|
+ Common.addTokenToRequest(request);
|
|
|
+ },
|
|
|
+ success: function (data) {
|
|
|
+ if (data.errorCode === 0 && data.datas.length > 0) {
|
|
|
+ assetDetailCategorys.value = data.datas;
|
|
|
getDetailData(data.datas);
|
|
|
} else {
|
|
|
message.warning(data.errorMessage);
|
|
|
@@ -376,9 +416,16 @@ watch(
|
|
|
line-height: 40px;
|
|
|
}
|
|
|
.ul_list li .left {
|
|
|
- width: 130px;
|
|
|
+ width: 160px;
|
|
|
padding: 0 10px 0 16px;
|
|
|
color: #777;
|
|
|
+ display: flex;
|
|
|
+}
|
|
|
+.left > .parent_name {
|
|
|
+ width: 150px;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ white-space: nowrap;
|
|
|
}
|
|
|
.ul_list li .right {
|
|
|
width: 440px;
|
|
|
@@ -406,4 +453,18 @@ watch(
|
|
|
height: 430px;
|
|
|
overflow: auto;
|
|
|
}
|
|
|
+:deep(.ant-menu-light .ant-menu-submenu-selected > .ant-menu-submenu-title) {
|
|
|
+ color: #277fd0;
|
|
|
+}
|
|
|
+:deep(.ant-menu-item) {
|
|
|
+ height: 24px;
|
|
|
+ line-height: 24px;
|
|
|
+ border-radius: 4px;
|
|
|
+ /* text-align: center;
|
|
|
+ padding-left: 12px !important; */
|
|
|
+}
|
|
|
+:deep(.ant-menu-item-selected) {
|
|
|
+ color: #fff;
|
|
|
+ background-color: #3e9aef !important;
|
|
|
+}
|
|
|
</style>
|