You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
299 lines
8.0 KiB
299 lines
8.0 KiB
<template>
|
|
<view class="dynamicModel-list-v">
|
|
<view class="head-warp com-dropdown">
|
|
<u-dropdown class="u-dropdown" ref="uDropdown">
|
|
<u-dropdown-item title="筛选">
|
|
<view class="dropdown-slot-content">
|
|
<view class="dropdown-slot-content-main search-main">
|
|
<scroll-view scroll-y="true" style="height: 1000rpx;">
|
|
<view class="u-p-l-32 u-p-r-32" v-if="showParser && columnCondition.length">
|
|
<Parser :formConf="columnCondition" ref="searchForm" @submit="sumbitSearchForm"
|
|
:webType="config.webType" />
|
|
</view>
|
|
<view v-else class="notData-box u-flex-col">
|
|
<view class="u-flex-col notData-inner">
|
|
<image :src="icon" class="iconImg"></image>
|
|
<text class="notData-inner-text">暂无数据</text>
|
|
</view>
|
|
</view>
|
|
</scroll-view>
|
|
<view class="buttom-actions" v-if="showParser && columnCondition.length">
|
|
<u-button class="buttom-btn" @click="reset">重置</u-button>
|
|
<u-button class="buttom-btn" type="primary" @click="closeDropdown">检索</u-button>
|
|
</view>
|
|
</view>
|
|
<view class="dropdown-slot-bg" @click="$refs.uDropdown.close()"></view>
|
|
</view>
|
|
</u-dropdown-item>
|
|
</u-dropdown>
|
|
</view>
|
|
<view class="list-warp">
|
|
<mescroll-uni ref="mescrollRef" @init="mescrollInit" @down="downCallback" @up="upCallback" :up="upOption"
|
|
top="200">
|
|
<view class="list" ref="tableRef">
|
|
<view class="list-box">
|
|
<uni-swipe-action ref="swipeAction">
|
|
<uni-swipe-action-item v-for="(item, index) in list" :key="item.id" :threshold="0"
|
|
:disabled="true">
|
|
<view class="item" @click="goDetail(item)">
|
|
<view class="u-line-1 item-cell" v-for="(column,i) in columnList" :key="i">
|
|
<view v-if="column.jnpfKey != 'table'">
|
|
<view class="" v-if="column.jnpfKey == 'relationForm'">
|
|
<text class="listTit u-line-1">{{column.label}}:</text>
|
|
<text class="listContent"
|
|
@click.stop="relationFormClick(item,column.__vModel__)"
|
|
style="color: blue;">{{item[column.prop]}}</text>
|
|
</view>
|
|
<view v-else class="u-line-1">
|
|
<text class="listTit u-line-1">{{column.label}}:</text>
|
|
<text class="listContent ">{{item[column.prop]}}</text>
|
|
</view>
|
|
</view>
|
|
<view class="collapse-box u-flex" v-else>
|
|
<tableCell :label="column.label" :childList="item[column.prop]||[]"
|
|
:children="column.children" ref="tableCell" :pageLen="3"></tableCell>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</uni-swipe-action-item>
|
|
</uni-swipe-action>
|
|
</view>
|
|
</view>
|
|
</mescroll-uni>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import tableCell from '@/pages/apply/dynamicModel/components/tableCell.vue'
|
|
import resources from '@/libs/resources.js'
|
|
import MescrollMixin from "@/uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins.js";
|
|
import Parser from '@/pages/apply/dynamicModel/components/parser/index.vue'
|
|
import {
|
|
listLink
|
|
} from '@/api/apply/webDesign'
|
|
export default {
|
|
mixins: [MescrollMixin],
|
|
props: ['config', 'modelId', 'columnCondition', 'columnText', 'encryption'],
|
|
components: {
|
|
Parser,
|
|
tableCell
|
|
},
|
|
data() {
|
|
return {
|
|
show: false,
|
|
icon: resources.message.nodata,
|
|
upOption: {
|
|
page: {
|
|
num: 0,
|
|
size: 10,
|
|
time: null
|
|
},
|
|
empty: {
|
|
icon: resources.message.nodata,
|
|
tip: "暂无数据",
|
|
top: "300rpx"
|
|
},
|
|
textNoMore: '没有更多数据',
|
|
toTop: {
|
|
bottom: 250
|
|
}
|
|
},
|
|
list: [],
|
|
listQuery: {
|
|
sort: 'desc',
|
|
sidx: '',
|
|
keyword: '',
|
|
queryJson: ''
|
|
},
|
|
options: [{
|
|
text: '删除',
|
|
style: {
|
|
backgroundColor: '#dd524d'
|
|
}
|
|
}],
|
|
showParser: false,
|
|
columnList: {},
|
|
searchList: [],
|
|
searchFormConf: [],
|
|
key: +new Date()
|
|
}
|
|
},
|
|
created() {
|
|
this.init()
|
|
},
|
|
methods: {
|
|
init() {
|
|
this.columnList = this.transformColumnList(this.columnText)
|
|
this.columnList.map((o) => {
|
|
if (o.jnpfKey != 'table' && o.label.length > 4) {
|
|
o.label = o.label.substring(0, 4)
|
|
}
|
|
})
|
|
this.listQuery.sidx = this.columnText[0].prop
|
|
this.$nextTick(() => {
|
|
this.key = +new Date()
|
|
})
|
|
},
|
|
transformColumnList(columnList) {
|
|
let list = []
|
|
for (let i = 0; i < columnList.length; i++) {
|
|
const e = columnList[i];
|
|
if (!e.prop.includes('-')) {
|
|
e.option = null
|
|
list.push(e)
|
|
} else {
|
|
let prop = e.prop.split('-')[0]
|
|
let vModel = e.prop.split('-')[1]
|
|
let label = e.label.split('-')[0]
|
|
let childLabel = e.label.replace(label + '-', '');
|
|
let newItem = {
|
|
align: "center",
|
|
jnpfKey: "table",
|
|
prop,
|
|
label,
|
|
children: []
|
|
}
|
|
e.vModel = vModel
|
|
e.childLabel = childLabel
|
|
if (!list.some(o => o.prop === prop)) list.push(newItem)
|
|
for (let i = 0; i < list.length; i++) {
|
|
if (list[i].prop === prop) {
|
|
e.option = null
|
|
list[i].children.push(e)
|
|
break
|
|
}
|
|
}
|
|
}
|
|
}
|
|
return list
|
|
},
|
|
upCallback(page) {
|
|
if (this.isPreview == '1') return this.mescroll.endSuccess(0, false);
|
|
const query = {
|
|
currentPage: page.num,
|
|
pageSize: page.size,
|
|
menuId: this.modelId,
|
|
...this.listQuery
|
|
}
|
|
listLink(this.modelId, query, this.encryption, {
|
|
load: page.num == 1
|
|
}, this.encryption).then(res => {
|
|
this.showParser = true
|
|
if (page.num == 1) this.list = [];
|
|
this.mescroll.endSuccess(res.data.list.length);
|
|
const list = res.data.list.map((o, i) => ({
|
|
show: false,
|
|
...o
|
|
}));
|
|
this.list = this.list.concat(list);
|
|
uni.$off('refresh')
|
|
}).catch((err) => {
|
|
this.mescroll.endByPage(0, 0);
|
|
this.mescroll.endErr();
|
|
uni.$off('refresh')
|
|
})
|
|
},
|
|
goDetail(item) {
|
|
if (!item.id) return
|
|
let config = {
|
|
modelId: this.modelId,
|
|
id: item.id,
|
|
formTitle: '详情',
|
|
noShowBtn: 1,
|
|
encryption: this.encryption
|
|
}
|
|
this.$nextTick(() => {
|
|
const url =
|
|
'./detail?config=' + this.base64.encode(JSON.stringify(config),
|
|
"UTF-8")
|
|
uni.navigateTo({
|
|
url: url
|
|
})
|
|
})
|
|
|
|
},
|
|
reset() {
|
|
this.showParser = false
|
|
this.searchFormConf = JSON.parse(JSON.stringify(this.searchList))
|
|
this.$nextTick(() => {
|
|
this.showParser = true
|
|
})
|
|
},
|
|
closeDropdown() {
|
|
if (this.isPreview == '1') {
|
|
uni.showToast({
|
|
title: '功能预览不支持检索',
|
|
icon: 'none'
|
|
})
|
|
return
|
|
}
|
|
this.$refs.searchForm && this.$refs.searchForm.submitForm()
|
|
},
|
|
fillFormData(list, data) {
|
|
for (let i = 0; i < list.length; i++) {
|
|
let item = list[i]
|
|
const val = data.hasOwnProperty(item.__vModel__) ? data[item.__vModel__] : item.__config__
|
|
.defaultValue
|
|
if (!item.__config__.custom && item.__config__.defaultCurrent && item.__config__
|
|
.jnpfKey === 'timePicker') val = this.jnpf.toDate(new Date(), item.format)
|
|
if (!item.__config__.custom && item.__config__.defaultCurrent && item.__config__
|
|
.jnpfKey === 'datePicker') val = new Date().getTime()
|
|
item.__config__.defaultValue = val
|
|
}
|
|
},
|
|
sumbitSearchForm(data) {
|
|
const queryJson = data || {}
|
|
this.fillFormData(this.searchFormConf, data)
|
|
this.listQuery.queryJson = JSON.stringify(queryJson) !== '{}' ? JSON.stringify(queryJson) : ''
|
|
this.$refs.uDropdown.close();
|
|
this.$nextTick(() => {
|
|
this.list = [];
|
|
this.mescroll.resetUpScroll();
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
page {
|
|
background-color: #f0f2f6;
|
|
height: 100%;
|
|
/* #ifdef MP-ALIPAY */
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
/* #endif */
|
|
}
|
|
|
|
.item {
|
|
padding: 0 !important;
|
|
}
|
|
|
|
.notData-box {
|
|
width: 100%;
|
|
height: 100%;
|
|
justify-content: center;
|
|
align-items: center;
|
|
padding-bottom: 200rpx;
|
|
|
|
.notData-inner {
|
|
width: 280rpx;
|
|
height: 308rpx;
|
|
align-items: center;
|
|
|
|
|
|
.iconImg {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
|
|
.notData-inner-text {
|
|
padding: 30rpx 0;
|
|
color: #909399;
|
|
}
|
|
}
|
|
}
|
|
</style> |