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

A股数据添加懒加载

Browse Source
dev
yujialong 3 years ago
parent de645bddad
commit 9f83df4d31
3 changed files with 144 additions and 81 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 6
      src/utils/api.js
  2. 120
      src/views/data/Framework.vue
  3. 87
      src/views/data/Product.vue

6
src/utils/api.js
Unescape View File

@ -1,8 +1,10 @@
let host = 'http://39.108.250.202:9000'
if(process.env.NODE_ENV === 'development'){
host = 'http://192.168.31.216:9000'
}
let host1 = 'http://192.168.31.216:9000'//榕
let host2 = 'http://192.168.31.125:9000'//林
let host3 = 'http://192.168.31.140:9000'//7
// let host = 'http://192.168.31.137:9000'// 陈赓
export default {
upload:`${host}/nakadai/nakadai/oss/fileUpload`,// 上传文件-订单
@ -106,7 +108,6 @@ export default {
// 数据管理
getIdQueryTable:`${host}/data/data/table/getIdQueryTable`,
getTableByClassification:`${host}/data/data/table/getTableByClassification`,
getTableByCondition:`${host}/data/data/table/getTableByCondition`,
originalList:`${host}/data/data/table/originalList`,
@ -118,6 +119,7 @@ export default {
deleteTable:`${host}/data/data/table/deleteTable`,
previewData:`${host}/data/data/preview`,
staticPreview:`${host}/data/data/staticPreview`,
// 产品管理
deleteProduct:`${host}/data/data/product/delete`,
findById:`${host}/data/data/product/findById`,

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

@ -22,7 +22,7 @@
<el-form label-width="80px" class="flex-between mgb20">
<div class="flex-center">
<el-form-item label="更新时间" style="margin: 0 20px 0 0">
<el-date-picker v-model="updateTime" type="date" placeholder="选择日期" format="yyyy-MM-dd" value-format="yyyy-MM-dd" @change="searchData"></el-date-picker>
<el-date-picker v-model="updateTime" type="date" placeholder="选择日期" format="yyyy-MM-dd" value-format="yyyy-MM-dd" @change="initData"></el-date-picker>
</el-form-item>
<el-input placeholder="请输入数据表名称" v-model="keyword" prefix-icon="el-icon-search" clearable></el-input>
</div>
@ -59,8 +59,8 @@
<el-dialog title="导入" :visible.sync="importVisible" width="80%" center @close="closeImport" class="dialog" :close-on-click-modal="false">
<el-container style="padding: 20px 0 20px 20px;background-color: #f0f0f0;">
<div style="overflow:auto;height: 558px;width:330px;padding:15px;background:#fff">
<el-tree ref="typeTree" :data="importTypeList" node-key="id" accordion :default-expanded-keys="defaultTypeActive" :default-checked-keys="defaultTypeChecked" :current-node-key="curId" show-checkbox :props="defaultProps" highlight-current @node-click="importTypeClick"></el-tree>
<div style="overflow:auto;height: 558px;width:330px;padding:15px;background:#fff" ref="typeTreeWrap" @scroll="loadType">
<el-tree ref="typeTree" :data="importTypeList" node-key="id" accordion :default-expanded-keys="defaultTypeActive" :default-checked-keys="defaultTypeChecked" :current-node-key="curId" show-checkbox :props="defaultProps" highlight-current @node-click="importTypeClick" @node-expand="importTypeExpand"></el-tree>
</div>
<el-main style="padding-top: 0;padding-bottom: 0;">
<el-card shadow="hover">
@ -118,8 +118,6 @@ export default {
defaultTypeActive: [],
defaultTypeChecked: [],
listData: [],
listDataAll: [],
searchListData: [],
keyword: '',
page: 1,
pageSize: 10,
@ -131,6 +129,10 @@ export default {
fieldHead: [],
tableName: '',
curId: '',
curExpand: '',
typeTreeUnit: 20,
typeTreeScrollTop: 0,
typeTimer: null,
categoryIndex: 0,
previewVisible: false,
previewHead: [],
@ -142,7 +144,7 @@ export default {
keyword: function(val) {
clearTimeout(this.searchTimer)
this.searchTimer = setTimeout(() => {
this.searchData()
this.initData()
},500)
}
},
@ -181,36 +183,10 @@ export default {
},
getData(){
this.$post(`${this.api.getIdQueryTable}?categoryId=${this.categoryId}&showName=${this.keyword}&pageNum=${this.page}&pageSize=${this.pageSize}&updateTime=${this.updateTime ? this.updateTime : ''}`).then(res => {
let list = JSON.parse(res.getIdQueryTable)
list.map(n => {
n.updateTime = n.updateTime ? this.formatDate('yyyy-MM-dd hh:mm:ss',new Date(n.updateTime)) : ''
})
this.listDataAll = list
this.total = list.length
this.handlePage()
this.listData = res.pageList.records
this.total = res.pageList.total
}).catch(res => {})
},
handlePage(){
let list = this.keyword ? this.searchListData : this.listDataAll
let result = list.slice((this.page - 1) * this.pageSize,this.page * this.pageSize)
this.listData = result
},
searchData(){
let list = this.listDataAll
let result = []
let updateTime = this.updateTime
list.map(n => {
if(updateTime){
if(n.updateTime && updateTime == this.formatDate('yyyy-MM-dd',new Date(n.updateTime)) && n.showName.includes(this.keyword)) result.push(n)
}else{
n.showName.includes(this.keyword) && result.push(n)
}
})
this.searchListData = result
this.listData = result.slice(0,10)
this.total = result.length
},
initData(){
this.page = 1
this.getData()
@ -279,7 +255,6 @@ export default {
for(let i in n){
if(typeof n[i] == 'string' && n[i].endsWith('+0000')) n[i] = this.formatDate('yyyy-MM-dd hh:mm:ss',new Date(n[i]))
}
})
this.previewData = data
this.previewVisible = true
@ -292,7 +267,6 @@ export default {
this.$post(`${this.api.deleteTable}?tableIds=${row.id}`).then(res => {
this.$message.success('删除成功')
this.getData()
this.cacheTable(this.typeList)
}).catch(res => {})
}).catch(() => {})
},
@ -301,7 +275,7 @@ export default {
},
handleCurrentChange(val) {
this.page = val
this.handlePage()
this.getData()
},
delAllSelection() {
if(this.multipleSelection.length != ''){
@ -316,16 +290,39 @@ export default {
this.$refs.table.clearSelection()
this.$message.success('删除成功')
this.getData()
this.cacheTable(this.typeList)
}).catch(res => {})
}).catch(() => {})
}else{
this.$message.error('请先选择数据')
}
},
getTable(n,i){
this.$post(`${this.api.originalListById}?categoryId=${n.realId}`).then(res => {
let list = JSON.parse(res.originalListById)
getMoreTable(list,id){
list.map(n => {
if(n.id == id){
this.getTable(n,1)
}else if(n.children && n.children.length){
this.getMoreTable(n.children,id)
}
})
},
loadType(e){
clearTimeout(this.typeTimer)
let typeTree = this.$refs.typeTreeWrap
this.typeTimer = setTimeout(() => {
this.typeTreeScrollTop = typeTree.scrollTop - this.typeTreeScrollTop
if(this.typeTreeScrollTop > 0 && typeTree.clientHeight + typeTree.scrollTop == typeTree.scrollHeight){
this.getMoreTable(this.importTypeList,this.curExpand)
setTimeout(() => {
this.$nextTick(() => {
this.$refs.typeTree.setCheckedKeys(this.defaultTypeChecked)
})
},300)
}
},50)
},
getTable(n,isConcat){
this.$post(`${this.api.originalListById}?categoryId=${n.realId}&pageNum=${n.typeTreePage}&pageSize=${this.typeTreeUnit}`).then(res => {
let list = res.list.records
list.map(n => {
n.label = n.showName
n.id = String(n.id)
@ -333,12 +330,12 @@ export default {
n.disabled = true
}
})
if(isConcat){
n.typeTreePage++
n.children = n.children.concat(list)
}else{
n.children = list
// if(!i && !this.tableName){
// this.tableName = res.list[0].name
// this.curId = res.list[0].id
// }
}
}).catch(res => {})
},
batchImport(){
@ -363,26 +360,28 @@ export default {
})
})
this.$post(`${this.api.getIdQueryTable}?categoryId=${this.categoryId}&showName=${this.keyword}&pageNum=1&pageSize=10000&updateTime=${this.updateTime ? this.updateTime : ''}`).then(res1 => {
let list = JSON.parse(res1.getIdQueryTable)
let list = res1.pageList.records
this.defaultTypeChecked = list.map(n => n.copyId)
res.map((n,i) => {
if(n.children.length){
n.children.map(n => {
if(n.children.length){
n.children.map(n => this.getTable(n,i))
n.children.map(n => {
n.typeTreePage = 1
this.getTable(n)
})
}else{
this.getTable(n,i)
n.typeTreePage = 1
this.getTable(n)
}
})
}else{
this.getTable(n,i)
n.typeTreePage = 1
this.getTable(n)
}
})
setTimeout(() => {
this.importTypeList = res
// this.defaultTypeActive = [res[0].id]
// if(res[0].children.length) this.defaultTypeActive.push(res[0].children[0].id)
// this.getFields()
},500)
}).catch(res => {})
@ -415,6 +414,10 @@ export default {
this.getFields()
}
},
importTypeExpand(obj,node,com){
this.curExpand = obj.id
this.$refs.typeTree.setCheckedKeys(this.defaultTypeChecked)
},
closeImport(){
this.$refs.typeTree.setCheckedKeys([])
},
@ -448,21 +451,10 @@ export default {
setTimeout(() => {
this.submited = false
},1000)
this.cacheTable(this.typeList)
}).catch(res => {
this.submited = false
})
},
cacheTable(list){
list.map(n => {
if(n.children.length){
this.cacheTable(n.children)
}else{
this.$post(`${this.api.getIdQueryTable}?categoryId=${n.id}&showName=&pageNum=1&pageSize=1000&updateTime=`).then(res => {}).catch(res => {})
}
})
}
}
};
</script>

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

@ -82,11 +82,13 @@
</el-form-item>
<el-form-item label="已选数据">
<el-button type="primary" size="small" @click="configData">配置数据权限</el-button>
<el-tree ref="type" :data="typeList" show-checkbox node-key="id" :default-expanded-keys="checkedIds" :default-checked-keys="checkedIds" :props="defaultProps">
<div class="type-wrap" ref="typeWrap" @scroll="loadType">
<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 :title="node.label">{{ node.label }}</span>
</span>
</el-tree>
</div>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer" v-if="!isDetail">
@ -187,7 +189,11 @@ export default {
},
checkedIds: [],
isDetail: false,
typeIndex: 1000,
typeIndex: 100000,
curExpand: '',
typeUnit: 20,
typeScrollTop: 0,
typeTimer: null,
configVisible: false,
configChecked: [],
@ -252,14 +258,19 @@ export default {
this.page = 1
this.getData()
},
getTable(n,i){
this.$post(`${this.api.getIdQueryTable}?categoryId=${n.originId}&showName=&pageNum=1&pageSize=10000&updateTime=`).then(res => {
let list = JSON.parse(res.getIdQueryTable)
getTable(n,isConcat){
this.$post(`${this.api.getIdQueryTable}?categoryId=${n.originId}&showName=&pageNum=${n.typePage}&pageSize=${this.typeUnit}&updateTime=`).then(res => {
let list = res.pageList.records
list.map(n => {
n.label = n.showName
n.id = String(n.id)
})
if(isConcat){
n.typePage++
n.children = n.children.concat(list)
}else{
n.children = list
}
}).catch(res => {})
},
getType(){
@ -285,13 +296,18 @@ export default {
if(n.children.length){
n.children.map(n => {
if(n.children.length){
n.children.map(n => this.getTable(n,i))
n.children.map(n => {
n.typePage = 1
this.getTable(n)
})
}else{
this.getTable(n,i)
n.typePage = 1
this.getTable(n)
}
})
}else{
this.getTable(n,i)
n.typePage = 1
this.getTable(n)
}
})
setTimeout(() => {
@ -312,6 +328,55 @@ export default {
}
return result
},
typeExpand(obj,node,com){
this.curExpand = obj.id
},
getMoreTable(list,id){
list.map(n => {
if(n.id == id){
this.getTable(n,1)
}else if(n.children && n.children.length){
this.getMoreTable(n.children,id)
}
})
},
loadType(e){
clearTimeout(this.typeTimer)
let typeTree = this.$refs.typeWrap
this.typeTimer = setTimeout(() => {
this.typeScrollTop = typeTree.scrollTop - this.typeScrollTop
if(this.typeScrollTop > 0 && typeTree.clientHeight + typeTree.scrollTop == typeTree.scrollHeight){
let curExpand = this.curExpand
if(!curExpand){
let id = this.checkedIds[0]
let list = this.typeList
list.map(n => {
if(n.id == id){
curExpand = n.id
}else if(n.children && n.children.length){
n.children.map(e => {
if(e.id == id){
curExpand = n.id
}else if(e.children && e.children.length){
e.children.map(j => {
if(j.id == id){
curExpand = e.id
}
})
}
})
}
})
}
this.getMoreTable(this.typeList,curExpand)
setTimeout(() => {
this.$nextTick(() => {
this.$refs.type.setCheckedKeys(this.checkedIds)
})
},300)
}
},50)
},
getDetail(){
this.$post(`${this.api.findById}?id=${this.id}`).then(res => {
let data = res.product
@ -478,7 +543,7 @@ export default {
},
getConfigTable(){
this.$post(`${this.api.getIdQueryTable}?categoryId=${this.categoryId}&showName=${this.keywordConfig}&pageNum=${this.pageConfig}&pageSize=${this.pageSizeConfig}&updateTime=${this.updateTime ? this.updateTime : ''}`).then(res => {
let list = JSON.parse(res.getIdQueryTable)
let list = res.pageList.records
list.map(n => {
n.updateTime = n.updateTime ? this.formatDate('yyyy-MM-dd hh:mm:ss',new Date(n.updateTime)) : ''
})
@ -553,4 +618,8 @@ export default {
background-color: #fff;
}
}
.type-wrap{
height: 450px;
overflow:auto;
}
</style>
Write Preview
Loading…
Cancel
Save