|
|
@@ -0,0 +1,276 @@ |
|
|
|
<template> |
|
|
|
<view class="page"> |
|
|
|
<!-- 主列表页 --> |
|
|
|
<view :class="sideOpen ? 'show' : ''" class="mainpage" style="padding-top: 80rpx"> |
|
|
|
<!-- 顶部条目/分页信息栏 --> |
|
|
|
<l-customlist-banner @buttonClick="sideOpen = false">{{ tips }}</l-customlist-banner> |
|
|
|
|
|
|
|
<!-- 滚动列表,跨端支持上拉/下拉 --> |
|
|
|
<l-scroll-list v-if="ready" @pullDown="pullDown" @toBottom="fetchList()" ref="list"> |
|
|
|
<l-customlist :tips="loadState" showTips> |
|
|
|
<!-- 单条记录 --> |
|
|
|
<view class="customlist-item" v-for="item of list" :key="item.ID" @click="tapLi(item)"> |
|
|
|
<view class="customlist-item-field"> |
|
|
|
<text class="customlist-item-field-title">学号:</text> |
|
|
|
{{ item.StuNo }} |
|
|
|
</view> |
|
|
|
|
|
|
|
<view class="customlist-item-field"> |
|
|
|
<text class="customlist-item-field-title">姓名:</text> |
|
|
|
{{ item.StuName }} |
|
|
|
</view> |
|
|
|
|
|
|
|
<!-- <view class="customlist-item-field"> |
|
|
|
<text class="customlist-item-field-title">班级:</text> |
|
|
|
{{ displayListItem(item, 'ClassNo') }} |
|
|
|
</view> --> |
|
|
|
|
|
|
|
<view class="customlist-item-field"> |
|
|
|
<text class="customlist-item-field-title">性别:</text> |
|
|
|
{{ displayListItem(item, 'GenderNo') }} |
|
|
|
</view> |
|
|
|
|
|
|
|
<view class="customlist-item-field"> |
|
|
|
<text class="customlist-item-field-title">缴费状态:</text> |
|
|
|
{{ displayListItem(item, 'PayStatus') }} |
|
|
|
</view> |
|
|
|
|
|
|
|
<view class="customlist-item-field"> |
|
|
|
<text class="customlist-item-field-title">开票状态:</text> |
|
|
|
{{ displayListItem(item, 'InvoiceStatus') }} |
|
|
|
</view> |
|
|
|
|
|
|
|
<view class="customlist-item-field"> |
|
|
|
<text class="customlist-item-field-title">缴费年度:</text> |
|
|
|
{{ item.PayYear }} |
|
|
|
</view> |
|
|
|
|
|
|
|
</view> |
|
|
|
</l-customlist> |
|
|
|
</l-scroll-list> |
|
|
|
</view> |
|
|
|
|
|
|
|
<!-- 关闭侧边抽屉按钮 --> |
|
|
|
<view @click="sideOpen = false" :class="sideOpen ? 'show' : ''" class="sideclose"><l-icon type="pullright" color="blue" /></view> |
|
|
|
|
|
|
|
<!-- 侧边栏,用于设置查询条件 --> |
|
|
|
<scroll-view :class="sideOpen ? 'show' : ''" class="sidepage" scroll-y> |
|
|
|
<view v-if="ready" class="padding"> |
|
|
|
<l-input v-model="queryData.StuNo" title="学号" placeholder="请填写学号" right /> |
|
|
|
<l-input v-model="queryData.StuName" title="学生姓名" placeholder="请填写学生姓名" right /> |
|
|
|
|
|
|
|
<!-- 重置查询条件按钮 --> |
|
|
|
<view class="padding-tb"><l-button @click="searchChange" line="orange" class="block" block>查询</l-button></view> |
|
|
|
</view> |
|
|
|
</scroll-view> |
|
|
|
|
|
|
|
</view> |
|
|
|
</template> |
|
|
|
|
|
|
|
<script> |
|
|
|
/* |
|
|
|
* 版 本 Learun-ADMS V7.0.3 力软敏捷开发框架(http://www.learun.cn) |
|
|
|
* Copyright (c) 2013-2020 上海力软信息技术有限公司 |
|
|
|
* 创建人:超级管理员 |
|
|
|
* 日 期:2020-10-12 17:22 |
|
|
|
* 描 述:班级自诊打卡 |
|
|
|
*/ |
|
|
|
|
|
|
|
/** |
|
|
|
* 本段代码由移动端代码生成器输出,移动端须 2.2.0 版本及以上可以使用 |
|
|
|
* 请在移动端 /pages.json 中的 pages 字段中添加一条记录: |
|
|
|
* { "path": "pages/EducationalAdministration/Thermography/list", "style": { "navigationBarTitleText": "表单列表页" } } |
|
|
|
* |
|
|
|
* (navigationBarTitleText 字段为本页面的标题文本,可以修改) |
|
|
|
* (必须自行操作该步骤,力软代码生成器不会自动帮您修改 /pages.json 文件) |
|
|
|
*/ |
|
|
|
import moment from 'moment'; |
|
|
|
import get from 'lodash/get'; |
|
|
|
import set from 'lodash/set'; |
|
|
|
import pickBy from 'lodash/pickBy'; |
|
|
|
import mapValues from 'lodash/mapValues'; |
|
|
|
|
|
|
|
export default { |
|
|
|
data() { |
|
|
|
return { |
|
|
|
// 数据项的数据类型、结构 |
|
|
|
scheme: { |
|
|
|
ClassNo: { |
|
|
|
type: 'select', |
|
|
|
dataSource: '1', |
|
|
|
dataSourceId: 'bjsj,classname,classno' |
|
|
|
}, |
|
|
|
GenderNo:{ |
|
|
|
type: 'dataItem', |
|
|
|
dataType: 'dataDictionary' |
|
|
|
}, |
|
|
|
PayStatus:{ |
|
|
|
type: 'dataItem', |
|
|
|
dataType: 'dataDictionary' |
|
|
|
}, |
|
|
|
InvoiceStatus:{ |
|
|
|
type: 'dataItem', |
|
|
|
dataType: 'dataDictionary' |
|
|
|
} |
|
|
|
}, |
|
|
|
|
|
|
|
defaultQueryData: {}, |
|
|
|
queryData: { |
|
|
|
StuNo: '', |
|
|
|
StuName: '' |
|
|
|
}, |
|
|
|
|
|
|
|
user:null, |
|
|
|
|
|
|
|
// 数据源 |
|
|
|
dataSource: { |
|
|
|
ClassNo: [], |
|
|
|
GenderNo: Object.values(this.GET_GLOBAL('dataDictionary').usersexbit).map(t => ({ value: t.value, text: t.text })), |
|
|
|
PayStatus:Object.values(this.GET_GLOBAL('dataDictionary').PayStatus).map(t => ({ value: t.value, text: t.text })), |
|
|
|
InvoiceStatus:Object.values(this.GET_GLOBAL('dataDictionary').InvoiceStatus).map(t => ({ value: t.value, text: t.text })), |
|
|
|
}, |
|
|
|
|
|
|
|
// 页面相关参数 |
|
|
|
ready: false, |
|
|
|
tips: '加载中...', |
|
|
|
loadState: '向下翻以加载更多', |
|
|
|
sideOpen: false, |
|
|
|
|
|
|
|
// 列表与分页信息 |
|
|
|
page: 1, |
|
|
|
total: 2, |
|
|
|
rows: 10, |
|
|
|
list: [], |
|
|
|
}; |
|
|
|
}, |
|
|
|
|
|
|
|
async onLoad() { |
|
|
|
console.log(this.GET_GLOBAL('dataDictionary')) |
|
|
|
await this.init(); |
|
|
|
}, |
|
|
|
onUnload() { |
|
|
|
this.OFF('stuInfoFreshPayFee'); |
|
|
|
}, |
|
|
|
|
|
|
|
methods: { |
|
|
|
// 页面初始化 |
|
|
|
async init() { |
|
|
|
this.ON('stuInfoFreshPayFee', this.refreshList); |
|
|
|
this.user = this.GET_GLOBAL('loginUser'); |
|
|
|
this.queryData.StuNo = this.user.account |
|
|
|
|
|
|
|
// 拉取加载列表和数据源 |
|
|
|
await Promise.all([ |
|
|
|
this.FETCH_DATASOURCE('bjsj').then(data => { |
|
|
|
this.dataSource.ClassNo = data.data.map(t => ({ |
|
|
|
text: t.classname, |
|
|
|
value: t.classno |
|
|
|
})); |
|
|
|
}), |
|
|
|
|
|
|
|
() => {} |
|
|
|
]); |
|
|
|
await this.fetchList(); |
|
|
|
// 初始化查询条件 |
|
|
|
this.defaultQueryData = this.COPY(this.queryData); |
|
|
|
this.ready = true; |
|
|
|
}, |
|
|
|
tapLi(data) { |
|
|
|
this.NAV_TO('./single', data, true); |
|
|
|
}, |
|
|
|
// 拉取列表 |
|
|
|
async fetchList(isConcat=true) { |
|
|
|
if (this.page > this.total) { |
|
|
|
return; |
|
|
|
} |
|
|
|
let _postParam = { |
|
|
|
pagination: { |
|
|
|
rows: this.rows, |
|
|
|
page: this.page, |
|
|
|
sidx: 'ClassNo,StuNo', |
|
|
|
sord: 'ASC' |
|
|
|
}, |
|
|
|
queryJson: JSON.stringify(this.queryData) |
|
|
|
}; |
|
|
|
this.LOADING('加载数据中…'); |
|
|
|
await this.HTTP_GET('/learun/payfee/getpayfeelist', _postParam,'加载数据时出错').then(res => { |
|
|
|
this.HIDE_LOADING(); |
|
|
|
// console.log(res) |
|
|
|
this.total = res.total; |
|
|
|
this.page = res.page + 1; |
|
|
|
this.list = isConcat?this.list.concat(res.rows):res.rows; |
|
|
|
|
|
|
|
this.tips = `已加载 ${Math.min(res.page, res.total)} / ${res.total} 页,共 ${res.records} 项`; |
|
|
|
this.loadState = res.page >= res.total ? '已加载所有项目' : '向下翻以加载更多'; |
|
|
|
}) |
|
|
|
}, |
|
|
|
|
|
|
|
// 刷新清空列表 |
|
|
|
async refreshList(isConcat=true) { |
|
|
|
this.page = 1; |
|
|
|
this.total = 2; |
|
|
|
this.list = []; |
|
|
|
|
|
|
|
await this.fetchList(isConcat); |
|
|
|
}, |
|
|
|
|
|
|
|
// 列表下拉 |
|
|
|
pullDown() { |
|
|
|
this.refreshList().then(() => { |
|
|
|
this.$refs.list.stopPullDown(); |
|
|
|
}); |
|
|
|
}, |
|
|
|
|
|
|
|
// 设置搜索条件 |
|
|
|
async searchChange() { |
|
|
|
this.sideOpen = false |
|
|
|
await this.refreshList(false); |
|
|
|
}, |
|
|
|
|
|
|
|
// 显示列表中的标题项 |
|
|
|
displayListItem(item, field) { |
|
|
|
const fieldItem = this.scheme[field]; |
|
|
|
const value = item[field]; |
|
|
|
|
|
|
|
switch (fieldItem.type) { |
|
|
|
case 'currentInfo': |
|
|
|
case 'organize': |
|
|
|
return fieldItem.dataType === 'time' ? value : get(this.GET_GLOBAL(fieldItem.dataType), `${value}.name`, ''); |
|
|
|
|
|
|
|
case 'radio': |
|
|
|
case 'select': |
|
|
|
const selectItem = this.dataSource[field].find(t => t.value === String(value)); |
|
|
|
return get(selectItem, 'text', ''); |
|
|
|
|
|
|
|
case 'dataItem': |
|
|
|
const sex = this.dataSource[field].find(t => t.value === String(value)); |
|
|
|
return get(sex, 'text', ''); |
|
|
|
|
|
|
|
case 'checkbox': |
|
|
|
if (!value || value.split(',').length <= 0) { |
|
|
|
return ''; |
|
|
|
} |
|
|
|
const checkboxItems = value.split(','); |
|
|
|
return this.dataSource[field] |
|
|
|
.filter(t => checkboxItems.includes(t.value)) |
|
|
|
.map(t => t.text) |
|
|
|
.join(','); |
|
|
|
|
|
|
|
case 'datetime': |
|
|
|
if (!value) { |
|
|
|
return ''; |
|
|
|
} |
|
|
|
return moment(value).format(Number(fieldItem.dateformat) === 0 ? 'YYYY年 M月 D日' : 'YYYY-MM-DD HH:mm'); |
|
|
|
|
|
|
|
default: |
|
|
|
return value === null || value === undefined ? '' : value; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
}; |
|
|
|
</script> |
|
|
|
|
|
|
|
<style lang="less" scoped> |
|
|
|
@import '~@/common/css/sidepage.less'; |
|
|
|
@import '~@/common/css/customlist.less'; |
|
|
|
</style> |