huoran
/
FE_middlePlatform_server
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 14 Wiki Activity

Merge remote-tracking branch 'origin/master'

Browse Source
dev_2022-03-03
e 3 years ago
parent 2f6ea7ff59 0d8e6c5ca9
commit e8d7a23c0e
3 changed files with 187 additions and 164 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 115
      src/views/data/Framework.vue
  2. 56
      src/views/data/Introduce.vue
  3. 180
      src/views/data/Product.vue

115
src/views/data/Framework.vue
Unescape View File

@ -5,7 +5,7 @@
<div class="plus"> <div class="plus">
<i class="el-icon-circle-plus-outline" @click.stop="addType(0)"></i> <i class="el-icon-circle-plus-outline" @click.stop="addType(0)"></i>
</div> </div>
<el-tree ref="type" :load="getType" lazy node-key="id" accordion :default-expanded-keys="defaultActive" :current-node-key="categoryId" :props="defaultProps" :highlight-current="true" @current-change="typeClick"> <el-tree ref="type" :data="typeList" node-key="id" accordion :default-expanded-keys="defaultActive" :current-node-key="categoryId" :props="defaultProps" :highlight-current="true" @current-change="typeClick">
<span class="custom-tree-node" slot-scope="{ node, data }"> <span class="custom-tree-node" slot-scope="{ node, data }">
<span :title="node.label">{{ node.label }}</span> <span :title="node.label">{{ node.label }}</span>
<span class="actions"> <span class="actions">
@ -156,9 +156,10 @@
export default { export default {
data() { data() {
return { return {
typeList: [],
defaultProps: { defaultProps: {
children: 'children', children: 'children',
label: 'categoryName' label: 'label'
}, },
defaultActive: [], defaultActive: [],
added: false, added: false,
@ -211,20 +212,37 @@ export default {
},500) },500)
} }
}, },
mounted(){}, mounted(){
this.getType()
},
methods: { methods: {
getType(node, resolve){ getType(){
this.$post(`${this.api.getLevel}?parentId=${node.level ? node.data.id : 0}`).then(res => { this.$post(this.api.getTableByClassification).then(res => {
const list = res.list // 递归赋值,同时添加层级标识
this.node = node function handleId(data,level = 0){
this.resolve = resolve data.map(n => {
resolve(list) n.id = String(n.id)
// 取第一个分类的id n.label = n.categoryName
if (!this.added && list.length) { n.level = level + 1
this.categoryId = list[0].id if(n.children.length){
this.defaultActive = [list[0].id] handleId(n.children,n.level)
}
})
}
handleId(res)
this.typeList = res
if (!this.added) {
if(res[0].children.length){
this.categoryId = res[0].children[0].id
this.defaultActive = [res[0].children[0].id]
}else{
this.categoryId = res[0].id
this.defaultActive = [res[0].id]
}
// 取第一个分类的id
this.$nextTick(() => { this.$nextTick(() => {
this.$refs.type.setCurrentKey(list[0].id) this.$refs.type.setCurrentKey(res[0].children[0].id)
}) })
} }
this.added = false this.added = false
@ -258,7 +276,6 @@ export default {
this.getData() this.getData()
}, },
addType(row){ addType(row){
this.categoryId = row.data.id
if (row) this.defaultActive = [row.data.id] if (row) this.defaultActive = [row.data.id]
this.typeVisible = true this.typeVisible = true
this.levelId = row ? row.data.id : 0 this.levelId = row ? row.data.id : 0
@ -267,8 +284,6 @@ export default {
this.typeVisible = true this.typeVisible = true
this.id = row.data.id this.id = row.data.id
this.categoryName = row.data.categoryName this.categoryName = row.data.categoryName
this.curNode = row
this.categoryId = row.data.id
}, },
delType(row){ delType(row){
// 该分类下的数据表已存在于产品管理中，是否确认删除？ // 该分类下的数据表已存在于产品管理中，是否确认删除？
@ -278,7 +293,7 @@ export default {
this.added = true this.added = true
this.$post(`${this.api.deleteCategory}?categoryId=${row.data.id}`).then(res => { this.$post(`${this.api.deleteCategory}?categoryId=${row.data.id}`).then(res => {
this.$message.success('删除成功') this.$message.success('删除成功')
this.$refs.type.remove(row) this.getType()
}).catch(res => {}) }).catch(res => {})
}).catch(() => {}) }).catch(() => {})
}, },
@ -292,9 +307,7 @@ export default {
categoryName: this.categoryName categoryName: this.categoryName
}).then(res => { }).then(res => {
this.$message.success('编辑成功') this.$message.success('编辑成功')
this.curNode.data.categoryName = this.categoryName this.getType()
this.$refs.type.updateKeyChildren(this.id, this.curNode)
this.getType(this.node, this.resolve)
this.typeVisible = false this.typeVisible = false
setTimeout(() => { setTimeout(() => {
this.submited = false this.submited = false
@ -308,10 +321,7 @@ export default {
categoryName: this.categoryName categoryName: this.categoryName
}).then(res => { }).then(res => {
this.$message.success('添加成功') this.$message.success('添加成功')
this.getType(this.node, this.resolve) this.getType()
let node = this.$refs.type.getNode(this.categoryId)
node.loaded = false
node.expand()
this.typeVisible = false this.typeVisible = false
setTimeout(() => { setTimeout(() => {
this.submited = false this.submited = false
@ -578,33 +588,52 @@ export default {
if(!checked.length) return this.$message.warning('请选择数据') if(!checked.length) return this.$message.warning('请选择数据')
this.submited = true this.submited = true
const typeIds = checked.filter(e => !e.name).map(e => e.realId) // 先筛选出分类id，再获取分类真正的id const typeIds = checked.filter(e => !e.name).map(e => e.realId) // 先筛选出分类id，再获取分类真正的id
this.getNames(typeIds).then(() => { const tableIds = checked.filter(e => e.name)
const data = this.names const categoryId = Number(this.categoryId)
const dataList = [] tableIds.map(e => {
for (let i = 0, len = data.length; i < len; i += 2000) { delete e.id
dataList.push(data.slice(i, i + 2000)) e.categoryId = categoryId
} })
const promiseList = [] if (typeIds.length) {
dataList.map(e => { this.getNames(typeIds).then(() => {
promiseList.push(new Promise((resolve,reject) => { const data = this.names
this.$post(this.api.saveTable, e).then(res => { const dataList = []
resolve() for (let i = 0, len = data.length; i < len; i += 2000) {
}).catch(res => { dataList.push(data.slice(i, i + 2000))
reject() }
}) const promiseList = []
})) dataList.map(e => {
promiseList.push(new Promise((resolve,reject) => {
this.$post(this.api.saveTable, e).then(res => {
resolve()
}).catch(res => {
reject()
})
}))
})
Promise.all(promiseList).then(res => {
this.$message.success('导入成功')
this.getData()
this.importVisible = false
setTimeout(() => {
this.submited = false
},1000)
}).catch(err => {
this.submited = false
})
}) })
Promise.all(promiseList).then(res => { } else {
this.$post(this.api.saveTable, tableIds).then(res => {
this.$message.success('导入成功') this.$message.success('导入成功')
this.getData() this.getData()
this.importVisible = false this.importVisible = false
setTimeout(() => { setTimeout(() => {
this.submited = false this.submited = false
},1000) },1000)
}).catch(err => { }).catch(res => {
this.submited = false this.submited = false
}) })
}) }
} }
} }
}; };

56
src/views/data/Introduce.vue
Unescape View File

@ -2,7 +2,7 @@
<div> <div>
<el-container> <el-container>
<el-aside width="350px"> <el-aside width="350px">
<el-tree ref="type" :load="getData" lazy node-key="id" accordion :default-expanded-keys="defaultActive" :current-node-key="categoryId" :props="defaultProps" :highlight-current="true" @current-change="typeClick"></el-tree> <el-tree ref="type" :data="typeList" node-key="id" accordion :default-expanded-keys="defaultActive" :current-node-key="categoryId" :props="defaultProps" highlight-current @node-click="typeClick"></el-tree>
</el-aside> </el-aside>
<el-main style="padding-top: 0"> <el-main style="padding-top: 0">
@ -56,9 +56,10 @@
export default { export default {
data() { data() {
return { return {
typeList: [],
defaultProps: { defaultProps: {
children: 'children', children: 'children',
label: 'categoryName' label: 'label'
}, },
defaultActive: [], defaultActive: [],
editing: false, editing: false,
@ -68,10 +69,7 @@ export default {
introduceText: '', introduceText: '',
categoryId: '', categoryId: '',
keywordList: [], keywordList: [],
newKeyword: '', newKeyword: ''
node: [],
resolve: null,
curNode: {}
}; };
}, },
watch: { watch: {
@ -82,22 +80,42 @@ export default {
},500) },500)
} }
}, },
mounted(){}, mounted(){
this.getData()
},
methods: { methods: {
getData(node, resolve){ getData(){
// 获取分类 // 获取分类
this.$post(`${this.api.getLevel}?parentId=${node.level ? node.data.id : 0}`).then(res => { this.$post(this.api.getTableByClassification).then(res => {
const list = res.list // 递归处理id和label
this.node = node function handleId(data){
this.resolve = resolve data.map(n => {
resolve(list) n.id = String(n.id)
n.label = n.categoryName
if(n.children.length){
handleId(n.children)
}
})
}
handleId(res)
this.typeList = res
// 取首个的id和简介 // 取首个的id和简介
if (!this.edited && list.length) { if (!this.edited) {
this.categoryId = list[0].id if(res[0].children.length){
this.dataSource = list[0].dataSource let item = res[0].children[0]
this.defaultActive = [list[0].id] this.categoryId = item.id
this.introduceText = list[0].introduce this.dataSource = res[0].children[0].dataSource
this.introduce = list[0].introduce this.defaultActive = [item.id]
this.introduceText = item.introduce
this.introduce = item.introduce
}else{
this.categoryId = res[0].id
this.dataSource = res[0].dataSource
this.defaultActive = [res[0].id]
this.introduceText = res[0].introduce
this.introduce = res[0].introduce
}
} }
this.getKeyword() this.getKeyword()
}).catch(res => {}) }).catch(res => {})

180
src/views/data/Product.vue
Unescape View File

@ -82,7 +82,7 @@
</el-form-item> </el-form-item>
<el-form-item label="配置数据"> <el-form-item label="配置数据">
<el-button type="primary" @click="configData">配置数据权限</el-button> <el-button type="primary" @click="configData">配置数据权限</el-button>
<div class="type-wrap" ref="typeWrap" @scroll="loadType" style="display: none"> <div class="type-wrap" ref="typeWrap" @scroll="loadType" v-show="checkedIds.length">
<el-tree ref="type" :data="typeList" show-checkbox accordion node-key="id" :default-expanded-keys="checkedIds" :default-checked-keys="checkedIds" :props="defaultProps" @node-expand="typeExpand"> <el-tree ref="type" :data="typeList" show-checkbox accordion node-key="id" :default-expanded-keys="checkedIds" :default-checked-keys="checkedIds" :props="defaultProps" @node-expand="typeExpand">
<span class="custom-tree-node" slot-scope="{ node, data }"> <span class="custom-tree-node" slot-scope="{ node, data }">
<span :title="node.label">{{ node.label }}</span> <span :title="node.label">{{ node.label }}</span>
@ -137,7 +137,7 @@
</el-container> </el-container>
<span slot="footer" class="dialog-footer"> <span slot="footer" class="dialog-footer">
<el-button @click="configVisible = false">取 消</el-button> <el-button @click="configVisible = false">取 消</el-button>
<el-button type="primary" @click="confirmConfig">确 定</el-button> <el-button type="primary" :loading="configLoading" @click="confirmConfig">确 定</el-button>
</span> </span>
</el-dialog> </el-dialog>
@ -194,11 +194,9 @@ export default {
typeUnit: 20, typeUnit: 20,
typeScrollTop: 0, typeScrollTop: 0,
typeTimer: null, typeTimer: null,
tableId: [],
configVisible: false, configVisible: false,
configChecked: [], configLoading: false,
configCheckedTableId: [],
categoryId: '', categoryId: '',
configIds: [], configIds: [],
updateTime: '', updateTime: '',
@ -278,7 +276,7 @@ export default {
}).catch(res => {}) }).catch(res => {})
}, },
// 获取分类 // 获取分类
getType(){ getType(queryDetail){
this.productVisible = true this.productVisible = true
this.$post(this.api.getTableByClassification).then(res => { this.$post(this.api.getTableByClassification).then(res => {
const that = this const that = this
@ -294,6 +292,7 @@ export default {
}) })
} }
handleId(res) handleId(res)
this.typeConfigList = JSON.parse(JSON.stringify(res))
// 获取分类下的表 // 获取分类下的表
function getTable(data){ function getTable(data){
@ -311,6 +310,7 @@ export default {
setTimeout(() => { setTimeout(() => {
this.typeList = res this.typeList = res
queryDetail && this.getDetail()
},500) },500)
this.importVisible = true this.importVisible = true
}).catch(res => {}) }).catch(res => {})
@ -381,9 +381,8 @@ export default {
const data = res.product const data = res.product
this.productName = data.productName this.productName = data.productName
this.market = data.market this.market = data.market
this.configChecked = data.tableId this.checkedIds = data.tableId.split(',')
this.checkedIds = this.handleType(data.tableId.split(','),this.typeList) this.$refs.type.setCheckedKeys(this.checkedIds)
this.$refs.type.setCheckedNodes(this.checkedIds)
}).catch(res => {}) }).catch(res => {})
}, },
add(){ add(){
@ -392,12 +391,11 @@ export default {
this.checkedIds = [] this.checkedIds = []
}, },
edit(row){ edit(row){
this.getType() this.getType(true)
this.id = row.id this.id = row.id
this.userId = row.userId this.userId = row.userId
this.getDetail()
}, },
switchOff(val,row,index) { switchOff(val,row) {
this.$post(this.api.updateProduct,{ this.$post(this.api.updateProduct,{
id: row.id, id: row.id,
productName: row.productName, productName: row.productName,
@ -415,10 +413,9 @@ export default {
}).catch(err => {}) }).catch(err => {})
}, },
preview(row){ preview(row){
this.getType(true)
this.isDetail = true this.isDetail = true
this.getType()
this.id = row.id this.id = row.id
this.getDetail()
}, },
handleDelete(row) { handleDelete(row) {
this.$confirm('确定要删除吗？', '提示', { this.$confirm('确定要删除吗？', '提示', {
@ -460,21 +457,19 @@ export default {
this.isDetail = false this.isDetail = false
this.typeIndex = 100000 this.typeIndex = 100000
this.typeList = [] this.typeList = []
this.tableId = []
this.configChecked = []
this.configIds = [] this.configIds = []
}, },
// 获取tableId,提交的时候需要 // 获取tableId,提交的时候需要
getIds(){ getIds(list){
// 获取已经勾选的分类 // 获取已经勾选的分类
let list = this.checkedIds this.checkedIds = []
this.tableId = []
const proList = [] const proList = []
this.configLoading = true
// 勾选的分类id分别去查询下面的表id，也可以全部id用逗号分隔去查，这里遍历去查是因为这样速度更快 // 勾选的分类id分别去查询下面的表id，也可以全部id用逗号分隔去查，这里遍历去查是因为这样速度更快
list.map(e => { list.map(e => {
proList.push(new Promise((resolve,reject) => { proList.push(new Promise((resolve,reject) => {
this.$get(`${this.api.getAllTableIdBycategoryId}?categoryId=${e}`).then(res => { this.$get(`${this.api.getAllTableIdBycategoryId}?categoryId=${e}`).then(res => {
res.tableId && this.tableId.push(...res.tableId.split(',')) res.tableId && this.checkedIds.push(...res.tableId.split(','))
resolve() resolve()
}).catch(res => { }).catch(res => {
this.submited = false this.submited = false
@ -483,8 +478,11 @@ export default {
}) })
// 全部分类id遍历查询完resolve回去 // 全部分类id遍历查询完resolve回去
return Promise.all(proList).then(res => { return Promise.all(proList).then(res => {
this.configLoading = false
resolve() resolve()
}).catch(err => {}) }).catch(err => {
this.configLoading = false
})
}, },
confirm(){ confirm(){
if(this.submited) return false if(this.submited) return false
@ -493,57 +491,52 @@ export default {
if(isNaN(this.market)) return this.$message.warning('市场价格请输入数字') if(isNaN(this.market)) return this.$message.warning('市场价格请输入数字')
if(!this.checkedIds.length) return this.$message.warning('请选择数据') if(!this.checkedIds.length) return this.$message.warning('请选择数据')
this.submited = true // 提交状态 this.submited = true // 提交状态
this.getIds().then(() => { let tableId = this.checkedIds
let tableId = Array.from(new Set(this.tableId)) if(!tableId.length) return this.$message.warning('请选择数据')
if(!tableId.length) return this.$message.warning('请选择数据') let data = {
let data = { id: this.id,
id: this.id, productName: this.productName,
productName: this.productName, market: this.market,
market: this.market, tableId: tableId.join(),
tableId: tableId.join(), userId: this.userId,
userId: this.userId, userName: this.userName,
userName: this.userName, createTime: '',
createTime: '', orderNum: '',
orderNum: '', status: '',
status: '', tableNum: tableId.length,
tableNum: tableId.length, updateTime: ''
updateTime: '' }
} if(this.id){
if(this.id){ this.$post(this.api.updateProduct,data).then(res => {
this.$post(this.api.updateProduct,data).then(res => { this.$message.success('新增成功')
this.$message.success('新增成功') this.productVisible = false
this.productVisible = false this.getData()
this.getData() this.submited = false
this.submited = false }).catch(res => {
}).catch(res => { this.submited = false
this.submited = false })
}) }else{
}else{ this.$post(this.api.saveProduct,data).then(res => {
this.$post(this.api.saveProduct,data).then(res => { this.$message.success('新增成功')
this.$message.success('新增成功') this.productVisible = false
this.productVisible = false this.getData()
this.getData() this.submited = false
this.submited = false }).catch(res => {
}).catch(res => { this.submited = false
this.submited = false })
}) }
}
})
}, },
configData(){ configData(){
this.configVisible = true this.configVisible = true
this.getConfigType() this.getConfigType()
// 编辑的时候才需要获取外面的弹框的已选数据，传到配置数据里去默认勾选 // 编辑的时候才需要获取外面的弹框的已选数据，传到配置数据里去默认勾选
if (this.id) { if (this.checkedIds.length) {
let list = this.$refs.type.getCheckedNodes() let list = this.$refs.type.getCheckedNodes()
let configIds = [] this.configIds = list.filter(n => !n.name).map(n => n.id)
list.map(n => { this.$refs.typeConfig.setCheckedKeys(this.configIds)
if(!n.name) configIds.push(n.originId) // 分类没有name。只需要分类id，因为配置数据里是以分类为维度的，所以获取表id无法默认勾选
})
this.configIds = configIds
} }
}, },
typeConfigClick(data,node){ typeConfigClick(data){
this.categoryId = data.id this.categoryId = data.id
this.getConfigTable() this.getConfigTable()
}, },
@ -553,25 +546,22 @@ export default {
}, },
// 获取配置数据里面的分类 // 获取配置数据里面的分类
getConfigType(){ getConfigType(){
this.$post(this.api.getTableByClassification).then(res => { const list = this.typeConfigList
function handleId(data){ function handleId(data){
data.map(n => { data.map(n => {
n.id = String(n.id) n.disabled = false // 配置数据都是可选的
n.label = n.categoryName if(n.children.length){
if(n.children.length){ handleId(n.children)
handleId(n.children) }
} })
}) }
} handleId(list)
handleId(res) if(list[0].children.length){
this.typeConfigList = res this.categoryId = list[0].children[0].id
if(res[0].children.length){ }else{
this.categoryId = res[0].children[0].id this.categoryId = list[0].id
}else{ }
this.categoryId = res[0].id this.getConfigTable()
}
this.getConfigTable()
}).catch(res => {})
}, },
// 获取配置数据里面分类下的表 // 获取配置数据里面分类下的表
getConfigTable(){ getConfigTable(){
@ -614,26 +604,12 @@ export default {
this.previewVisible = true this.previewVisible = true
}).catch(res => {}) }).catch(res => {})
}, },
// 递归获取选中的分类id
getTableId(list){
let checked = this.configChecked
list.map(n => {
if(n.children && n.children.length){
this.getTableId(n.children)
if(checked.includes(n.originId) && n.children[0].name){ // 选中的并且是表（表才有name）
this.configCheckedTableId = [...this.configCheckedTableId,...n.children.map(n => n.id)]
}else{
this.getTableId(n.children)
}
}
})
},
confirmConfig(){ confirmConfig(){
this.configChecked = this.$refs.typeConfig.getCheckedKeys().map(n => n) // 获取选中的id const list = this.$refs.typeConfig.getCheckedNodes().map(e => e.originId) // 获取选中的id
this.checkedIds = this.configChecked this.getIds(list).then(() => {
this.configVisible = false this.configVisible = false
this.$nextTick(() => { this.$refs.type.setCheckedKeys(this.checkedIds)
this.$refs.type.setCheckedNodes(this.checkedIds)
}) })
} }
} }

Write Preview
Loading…
Cancel
Save