后台编目bug

This commit is contained in:
851673013@qq.com 2022-07-08 10:42:00 +08:00
parent de9e38e5bf
commit 08bb99011b
2 changed files with 409 additions and 369 deletions

View File

@ -8,9 +8,7 @@
<template>
<div class="management-pop">
<div class="top">
<a-button series="primary" @click="showAdd()">
新增
</a-button>
<a-button series="primary" @click="showAdd()"> 新增 </a-button>
<a-popconfirm
title="是否删除选中字段?"
okText="是"
@ -25,81 +23,159 @@
:columns="columns"
:data-source="data"
:expanded-row-keys.sync="expandedRowKeys"
:pagination='false'
:pagination="false"
ref="aTable"
:key="showKey"
:scroll="{ x: 1200, y: 500 }"
>
<template
v-for="col in ['name', 'isAttr', 'isLinkToDic', 'linkValue', 'isFilterCriteria', 'type', 'xh', 'operation']"
v-for="col in [
'name',
'isAttr',
'isLinkToDic',
'linkValue',
'isFilterCriteria',
'type',
'xh',
'operation'
]"
:slot="col"
slot-scope="text, record, index"
class="text"
>
<div :key="col" style="display: inline-block;" v-if="col==='name'">
<div :key="col" style="display: inline-block" v-if="col === 'name'">
<a-input
v-if="record.editable"
style="margin: -5px 0"
:value="text"
@change="e => handleChange(e.target.value, record.key, col)"
@change="(e) => handleChange(e.target.value, record.key, col)"
/>
<template v-else>
{{ text }}
</template>
</div>
<div :key="col" style="display: inline-block;" v-else-if="col==='isAttr'">
<a-switch v-if="record.editable && !record.children" default-checked @change="isAttrOnChange" :checked="text" />
<div
:key="col"
style="display: inline-block"
v-else-if="col === 'isAttr'"
>
<a-switch
v-if="record.editable && !record.children"
default-checked
@change="isAttrOnChange"
:checked="text"
/>
<template v-else>
<a-switch default-checked :disabled='disabled' :checked="text" />
<a-switch default-checked :disabled="disabled" :checked="text" />
</template>
</div>
<div :key="col" style="display: inline-block;" v-else-if="col==='isLinkToDic'">
<a-switch v-if="record.editable && record.isAttr" default-checked @change="isLinkToDicOnChange" :checked="text" />
<div
:key="col"
style="display: inline-block"
v-else-if="col === 'isLinkToDic'"
>
<a-switch
v-if="record.editable && record.isAttr"
default-checked
@change="isLinkToDicOnChange"
:checked="text"
/>
<template v-else>
<a-switch default-checked :disabled='disabled' :checked="text" />
<a-switch default-checked :disabled="disabled" :checked="text" />
</template>
</div>
<div :key="col" style="display: inline-block;" v-else-if="col==='linkValue'">
<a-select :defaultValue="text" style="width: 150px" @change="linkValueHandleChange" :disabled='(record.editable && record.isLinkToDic)?!disabled:disabled'>
<div
:key="col"
style="display: inline-block"
v-else-if="col === 'linkValue'"
>
<a-select
:defaultValue="text"
style="width: 150px"
@change="linkValueHandleChange"
:disabled="
record.editable && record.isLinkToDic ? !disabled : disabled
"
>
<a-select-option :value="val.id" v-for="val in zdList" :key="val">
{{ val.dictName }}
</a-select-option>
</a-select>
</div>
<div :key="col" style="display: inline-block;" v-else-if="col==='isFilterCriteria'">
<a-switch v-if="record.editable && record.linkValue" default-checked @change="isFilterCriteriaOnChange" :checked="text" />
<div
:key="col"
style="display: inline-block"
v-else-if="col === 'isFilterCriteria'"
>
<a-switch
v-if="record.editable && record.linkValue"
default-checked
@change="isFilterCriteriaOnChange"
:checked="text"
/>
<template v-else>
<a-switch default-checked :disabled='disabled' :checked="text" />
<a-switch default-checked :disabled="disabled" :checked="text" />
</template>
</div>
<div :key="col" style="display: inline-block;" v-else-if="col==='type'">
<a-select :defaultValue="text" style="width: 150px" @change="typeHandleChange" :disabled='(record.editable && !record.children)?!disabled:disabled'>
<a-select-option :value="val.dictValue" v-for="val in fieldTypeList" :key="val">
<div
:key="col"
style="display: inline-block"
v-else-if="col === 'type'"
>
<a-select
:defaultValue="text"
style="width: 150px"
@change="typeHandleChange"
:disabled="
record.editable && !record.children ? !disabled : disabled
"
>
<a-select-option
:value="val.dictValue"
v-for="val in fieldTypeList"
:key="val"
>
{{ val.dictLabel }}
</a-select-option>
</a-select>
</div>
<div :key="col" style="display: inline-block;" v-else-if="col==='xh'">
<div :key="col" style="display: inline-block" v-else-if="col === 'xh'">
<a-input
v-if="record.editable"
style="margin: -5px 0"
:value="text"
@change="e => handleChange(e.target.value, record.key, col)"
@change="(e) => handleChange(e.target.value, record.key, col)"
/>
<template v-else>
{{ text }}
</template>
</div>
<div :key="col" class="editable-row-operations" v-else-if="col==='operation'">
<div
:key="col"
class="editable-row-operations"
v-else-if="col === 'operation'"
>
<span v-if="record.editable">
<a @click="() => save(record.key)">保存</a>
<a-popconfirm title="是否取消修改?" @confirm="() => cancel(record.key)" okText='是' cancelText='否'>
<a-popconfirm
title="是否取消修改?"
@confirm="() => cancel(record.key)"
okText="是"
cancelText="否"
>
<a>取消</a>
</a-popconfirm>
</span>
<span v-else>
<a :disabled="editingKey !== ''" @click="() => add(record.id,record.children)" v-if="!record.isAttr&&record.cengji<=3">新增</a>
<a :disabled="editingKey !== ''" @click="() => edit(record.key)">修改</a>
<a
:disabled="editingKey !== ''"
@click="() => add(record.id, record.children)"
v-if="!record.isAttr && record.cengji <= 3"
>新增</a
>
<a :disabled="editingKey !== ''" @click="() => edit(record.key)"
>修改</a
>
<a-popconfirm
title="是否确定删除?"
okText="是"
@ -184,9 +260,7 @@ const columns = [
]
const data = []
export default {
components: {
},
components: {},
props: {
showItem: {
type: Object,
@ -198,7 +272,7 @@ export default {
}
},
data () {
this.cacheData = data.map(item => ({ ...item }))
this.cacheData = data.map((item) => ({ ...item }))
return {
time: true,
showKey: 0,
@ -217,19 +291,27 @@ export default {
editingKey: '',
rowSelection: {
onChange: (selectedRowKeys, selectedRows) => {
console.log(`selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows)
console.log(
`selectedRowKeys: ${selectedRowKeys}`,
'selectedRows: ',
selectedRows
)
this.delList = []
if (selectedRows) {
selectedRows.forEach((val) => {
this.delList.push(val.key)
})
}
console.log('delList================>', this.expandedRowKeys, this.delList)
console.log(
'delList================>',
this.expandedRowKeys,
this.delList
)
},
onSelect: (record, selected, selectedRows) => {
console.log(record, selected, selectedRows)
if (record.children) {
record.children.forEach(item => {
record.children.forEach((item) => {
this.delList.push(item.key)
})
}
@ -258,83 +340,13 @@ export default {
},
//
getCategoryTree () {
this.$http.get('/category/getCategoryTree').then(res => {
console.log(res.data.data, this.index)
this.$http.get('/category/getCategoryTree').then((res) => {
this.data = []
if (res.data.data[this.index].children) {
res.data.data[this.index].children.forEach(val => {
if (this.showItem.children) {
this.showItem.children.forEach((val) => {
this.initData(val, this.cengji)
// if (val.children) {
// if (val.children.length === 0) {
// delete val.children
// } else {
// val.children.forEach(item => {
// item.key = item.id
// item.cengji = '2'
// console.log(item)
// if (item.children && item.children.length === 0) {
// delete item.children
// } else if (item.children) {
// item.children.forEach(child => {
// child.key = child.id
// child.cengji = '3'
// if (child.children && child.children.length === 0) {
// delete child.children
// }
// if (child.isAttr === 'true') {
// child.isAttr = true
// } else if (child.isAttr === 'false') {
// child.isAttr = false
// }
// if (child.isFilterCriteria === 'true') {
// child.isFilterCriteria = true
// } else if (child.isFilterCriteria === 'false') {
// child.isFilterCriteria = false
// }
// if (child.isLinkToDic === 'true') {
// child.isLinkToDic = true
// } else if (child.isLinkToDic === 'false') {
// child.isLinkToDic = false
// }
// })
// }
// if (item.isAttr === 'true') {
// item.isAttr = true
// } else if (item.isAttr === 'false') {
// item.isAttr = false
// }
// if (item.isFilterCriteria === 'true') {
// item.isFilterCriteria = true
// } else if (item.isFilterCriteria === 'false') {
// item.isFilterCriteria = false
// }
// if (item.isLinkToDic === 'true') {
// item.isLinkToDic = true
// } else if (item.isLinkToDic === 'false') {
// item.isLinkToDic = false
// }
// })
// }
// }
// val.key = val.id
// val.cengji = '1'
// if (val.isAttr === 'true') {
// val.isAttr = true
// } else if (val.isAttr === 'false') {
// val.isAttr = false
// }
// if (val.isFilterCriteria === 'true') {
// val.isFilterCriteria = true
// } else if (val.isFilterCriteria === 'false') {
// val.isFilterCriteria = false
// }
// if (val.isLinkToDic === 'true') {
// val.isLinkToDic = true
// } else if (val.isLinkToDic === 'false') {
// val.isLinkToDic = false
// }
})
this.data = res.data.data[this.index].children
this.data = this.showItem.children
console.log('data======================>', this.data)
this.flag = true
this.showKey++
@ -365,7 +377,7 @@ export default {
delete data.children
} else {
cengji++
data.children.forEach(item => {
data.children.forEach((item) => {
this.initData(item, cengji)
})
}
@ -373,14 +385,18 @@ export default {
},
//
selectZd () {
this.$http.get('/sys/dict/type/page?limit=10000&page=1').then(res => {
this.$http.get('/sys/dict/type/page?limit=10000&page=1').then((res) => {
this.zdList = res.data.data.list
console.log(this.zdList)
})
},
//
selectFieldType () {
this.$http.get('/sys/dict/data/page?limit=10000&page=1&dictTypeId=1531163741457014785').then(res => {
this.$http
.get(
'/sys/dict/data/page?limit=10000&page=1&dictTypeId=1531163741457014785'
)
.then((res) => {
this.fieldTypeList = res.data.data.list
console.log(this.fieldTypeList)
})
@ -408,7 +424,8 @@ export default {
//
handleOk () {
if (this.nameTxt) {
this.$http.post('/category/insert', {
this.$http
.post('/category/insert', {
isAttr: true,
isFilterCriteria: false,
isLinkToDic: false,
@ -418,7 +435,8 @@ export default {
rootCategory: this.rootCategory,
type: 'input',
xh: this.px || this.data.length + 1
}).then(res => {
})
.then((res) => {
console.log(res)
this.visible = false
this.nameTxt = ''
@ -429,18 +447,19 @@ export default {
},
//
confirmDel () {
this.$http.post('/category/deleteById', { ids: this.delList }).then(res => {
this.$http
.post('/category/deleteById', { ids: this.delList })
.then((res) => {
console.log(res)
this.init()
})
},
//
cancelDel () {
},
cancelDel () {},
handleChange (value, key, column) {
const newData = [...this.data]
this.editData = {}
newData.forEach(val => {
newData.forEach((val) => {
this.handleChangeFor(val, key)
})
if (this.editData) {
@ -454,7 +473,7 @@ export default {
this.editData = val
} else {
if (val.children) {
val.children.forEach(item => {
val.children.forEach((item) => {
this.handleChangeFor(item, key)
})
}
@ -495,7 +514,7 @@ export default {
}
},
editFor (data, key) {
data.forEach(val => {
data.forEach((val) => {
if (val.key === key) {
this.editData = val
} else {
@ -515,7 +534,7 @@ export default {
})
} else {
this.flag = false
this.$http.post('/category/update', this.editData).then(res => {
this.$http.post('/category/update', this.editData).then((res) => {
console.log(res)
this.editingKey = ''
this.init()
@ -586,12 +605,12 @@ export default {
// }
// })
}
this.$http.post('/category/deleteById', { ids: arr }).then(res => {
this.$http.post('/category/deleteById', { ids: arr }).then((res) => {
this.init()
})
},
delFor (data, arr) {
data.forEach(val => {
data.forEach((val) => {
arr.push(val.id)
if (val.children) {
this.delFor(val.children, arr)
@ -601,7 +620,7 @@ export default {
}
}
</script>
<style lang='scss' scoped>
<style lang="scss" scoped>
.top {
display: flex;
justify-content: flex-end;

View File

@ -24,7 +24,9 @@
<div
class="resource-detail-wrap"
:style="{
backgroundImage: `url(${topicCardBgImg(slotProps.item.positionNum)})`,
backgroundImage: `url(${topicCardBgImg(
slotProps.item.positionNum
)})`
}"
>
<!-- 企业标题 -->
@ -36,11 +38,17 @@
<input
v-model="slotProps.item.name"
class="edit-enterprise-input"
>
/>
</div>
<!-- 专题资源列表 -->
<div class="resource-detail-resource">
<div class="num" v-for="item2 in slotProps.item.children" :key="item2.id">{{ item2.name }}</div>
<div
class="num"
v-for="item2 in slotProps.item.children"
:key="item2.id"
>
{{ item2.name }}
</div>
<!-- <span class="unit"></span> -->
</div>
<!-- 删除资源按钮 -->
@ -48,7 +56,9 @@
<i
v-if="isRemoveCard"
class="resource-detail-remove"
@click.stop="removeEnterpriseCard(slotProps.item,slotProps.index)"
@click.stop="
removeEnterpriseCard(slotProps.item, slotProps.index)
"
/>
</transition>
</div>
@ -61,7 +71,7 @@
</div>
<div>
<span @click.stop="editTopicCard">{{
isRemoveCard ? "完成" : "编辑"
isRemoveCard ? '完成' : '编辑'
}}</span>
</div>
</div>
@ -75,7 +85,7 @@
:style="{
top: cardAddTop,
left: cardAddLeft,
backgroundImage: `url(${addCardBgImg})`,
backgroundImage: `url(${addCardBgImg})`
}"
>
<div v-if="!isAddCard">
@ -88,7 +98,7 @@
v-model="addEnterpriseName"
class="add-enterprise-input"
placeholder="请输入目录名称"
>
/>
</div>
<div class="add-enterprise-button-wrap">
<el-button
@ -109,24 +119,26 @@
</div>
</transition>
<!-- 卡片覆盖层-->
<div class="enterprise-card-cover" :style="{ zIndex: topicCoverZIndex||1000 }">
<div
class="enterprise-card-cover"
:style="{ zIndex: topicCoverZIndex || 1000 }"
>
<div
v-for="(item, index) in topicList"
:key="index"
@click="test(item, index)"
>
</div>
></div>
</div>
<a-modal
:visible="show"
title="编目配置"
@ok.stop="handleOk"
@cancel.stop="handleCancel"
:footer='null'
:footer="null"
:key="showKey"
width="1200px"
>
<ManagementPop :showItem="showItem" :index='index'></ManagementPop>
<ManagementPop :showItem="showItem" :index="index"></ManagementPop>
</a-modal>
</div>
</template>
@ -147,7 +159,8 @@ export default {
ManagementPop
},
props: {
enterpriseTypeOption: { //
enterpriseTypeOption: {
//
type: Array,
default: () => {
return []
@ -169,8 +182,7 @@ export default {
cardInsideWidth: 360, //
cardOutsideHeight: 198, //
cardInsideHeight: 176, //
topicList: [
],
topicList: [],
newGroupName: {
//
cur: []
@ -271,7 +283,9 @@ export default {
},
//
async initTopicCardList () {
this.$http.get('/category/getCategoryTree').then(({ data: res }) => {
this.$http
.get('/category/getCategoryTree')
.then(({ data: res }) => {
// 便
this.oldIdList = res.data
res.data.sort((a, b) => a.sortIndex - b.sortIndex)
@ -285,7 +299,7 @@ export default {
if (this.selectIndex !== -1) {
console.log('showItem=============>', res.data[this.selectIndex])
if (res.data[this.selectIndex].children) {
res.data[this.selectIndex].children.forEach(val => {
res.data[this.selectIndex].children.forEach((val) => {
val.key = val.id
if (val.isAttr === 'true') {
val.isAttr = true
@ -308,7 +322,8 @@ export default {
this.showItem = res.data[this.selectIndex]
}
this.cardNum = this.topicList.length
}).catch(() => {})
})
.catch(() => {})
},
//
startDrag () {},
@ -348,7 +363,9 @@ export default {
const params = {
ids: letid
}
this.$http.post('/category/deleteById', params).then(({ data: res }) => {
this.$http
.post('/category/deleteById', params)
.then(({ data: res }) => {
let removeIndex = 0
this.topicList.forEach((enterprise, index) => {
if (
@ -395,7 +412,9 @@ export default {
id: item.id.slice(5),
name: item.name
}
this.$http.post('/category/update', params).then(({ data: res }) => {
this.$http
.post('/category/update', params)
.then(({ data: res }) => {
item.name = newGroupName
})
.catch((e) => {
@ -437,7 +456,9 @@ export default {
linkValue: '',
xh: this.topicList.length + 1
}
const response = this.$http.post('/category/insert', params).then(({ data: res }) => {
const response = this.$http
.post('/category/insert', params)
.then(({ data: res }) => {
if (res.code !== 0) {
console.log('response.code', res)
this.$message.error('新增目录失败,请联系管理员!')
@ -548,7 +569,7 @@ export default {
height: 28px;
margin-left: 14px;
margin-top: 9px;
background-image: url("~@/assets/img/capabilityCatalogingManagement/edit-card.png");
background-image: url('~@/assets/img/capabilityCatalogingManagement/edit-card.png');
}
}
div:nth-child(2) {
@ -587,7 +608,7 @@ export default {
left: 50%;
margin-left: -45.5px;
margin-top: -45.5px;
background-image: url("~@/assets/img/capabilityCatalogingManagement/add.png");
background-image: url('~@/assets/img/capabilityCatalogingManagement/add.png');
cursor: pointer;
}
> span {
@ -596,7 +617,7 @@ export default {
padding-top: 5px;
padding-left: 20px;
font-size: 26px;
font-family: "Microsoft YaHei";
font-family: 'Microsoft YaHei';
}
.add-enterprise-input-wrap {
// height: 50px;
@ -634,7 +655,7 @@ export default {
background: #0fa7f6;
span {
color: #ffffff;
font-family: "Microsoft YaHei";
font-family: 'Microsoft YaHei';
font-size: 16px;
}
}
@ -682,7 +703,7 @@ export default {
text-align: center;
color: #ffffff;
font-size: 14px;
font-family: "Microsoft YaHei";
font-family: 'Microsoft YaHei';
}
span:nth-child(2) {
display: inline-block;
@ -691,7 +712,7 @@ export default {
text-align: center;
color: #ffffff;
font-size: 14px;
font-family: "Microsoft YaHei";
font-family: 'Microsoft YaHei';
border: 1px solid rgba(255, 255, 255, 0.5);
padding-top: 4px;
margin-top: 15px;
@ -702,7 +723,7 @@ export default {
.enterprise-card-tip-first:before,
.enterprise-card-tip-first:after {
position: absolute;
content: " ";
content: ' ';
top: 32px;
left: -16px;
display: block;
@ -730,7 +751,7 @@ export default {
text-align: center;
color: #ffffff;
font-size: 14px;
font-family: "Microsoft YaHei";
font-family: 'Microsoft YaHei';
}
span:nth-child(2) {
display: inline-block;
@ -739,7 +760,7 @@ export default {
text-align: center;
color: #ffffff;
font-size: 14px;
font-family: "Microsoft YaHei";
font-family: 'Microsoft YaHei';
border: 1px solid rgba(255, 255, 255, 0.5);
padding-top: 4px;
margin-top: 15px;
@ -750,7 +771,7 @@ export default {
.enterprise-card-tip-third:before,
.enterprise-card-tip-third:after {
position: absolute;
content: " ";
content: ' ';
top: 32px;
left: 180px;
display: block;
@ -779,7 +800,7 @@ export default {
text-align: center;
color: #ffffff;
font-size: 14px;
font-family: "Microsoft YaHei";
font-family: 'Microsoft YaHei';
}
span:nth-child(2) {
display: inline-block;
@ -788,7 +809,7 @@ export default {
text-align: center;
color: #ffffff;
font-size: 14px;
font-family: "Microsoft YaHei";
font-family: 'Microsoft YaHei';
border: 1px solid rgba(255, 255, 255, 0.5);
padding-top: 4px;
margin-top: 15px;
@ -799,7 +820,7 @@ export default {
.enterprise-card-tip-second:before,
.enterprise-card-tip-second:after {
position: absolute;
content: " ";
content: ' ';
top: -15px;
left: 78px;
display: block;
@ -814,7 +835,7 @@ export default {
width: 100%;
// height: 373px;
height: 176px;
background-image: url("~@/assets/img/capabilityCatalogingManagement/small-card-orange.png");
background-image: url('~@/assets/img/capabilityCatalogingManagement/small-card-orange.png');
.resource-detail-title {
width: 100%;
height: 40px;
@ -826,7 +847,7 @@ export default {
span {
width: 100%;
height: 100%;
font-family: "Microsoft YaHei";
font-family: 'Microsoft YaHei';
font-size: 20px;
display: inline-block;
overflow: hidden;
@ -845,7 +866,7 @@ export default {
width: 100%;
height: 30px;
padding-left: 19px;
font-family: "Microsoft YaHei";
font-family: 'Microsoft YaHei';
font-size: 20px;
color: white;
vertical-align: middle;
@ -877,7 +898,7 @@ export default {
position: absolute;
width: 28px;
height: 28px;
background-image: url("~@/assets/img/capabilityCatalogingManagement/remove.png");
background-image: url('~@/assets/img/capabilityCatalogingManagement/remove.png');
top: 0;
right: 0;
cursor: pointer;
@ -886,7 +907,7 @@ export default {
}
input::-webkit-input-placeholder {
font-size: 14px;
font-family: "Microsoft YaHei";
font-family: 'Microsoft YaHei';
color: #999999;
}
</style>