DigitalScholl/Learun.Framework.Ultimate V7/LearunApp-2.2.0/pages/EducationalAdministration/JournalSend/list.vue

<template>
	<view class="page">
		<!-- 主列表页 -->
		<view :class="sideOpen ? 'show' : ''" class="mainpage" style="padding-top: 80rpx;">
			<!-- 顶部条目/分页信息栏 -->
			<l-customlist-banner :buttonShow="false" @buttonClick="sideOpen = true">{{ 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.JournalSendId">

						<view class="customlist-item-field">
							<text class="customlist-item-field-title">日志主题：</text>
							{{ displayListItem(item, 'JTitle') }}
						</view>

						<view class="customlist-item-field">
							<text class="customlist-item-field-title">日志类型：</text>
							{{ displayListItem(item, 'JTypeId') }}
						</view>

						<!-- <view class="customlist-item-field">
							<text class="customlist-item-field-title">接收人：</text>
							{{ displayListItem(item, 'JReceiveId') }}
						</view> -->

						<view class="customlist-item-field">
							<text class="customlist-item-field-title">日志内容：</text>
							{{ displayListItem(item, 'JContent') }}
						</view>


						<l-customlist-action :showEdit="user.userId != item.JReceiveId" @edit="action('edit', item.JournalSendId)" :showDelete="user.userId != item.JReceiveId"
							@delete="action('delete', item.JournalSendId)" @view="action('view', item.JournalSendId)" />
					</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">


				<!-- 重置查询条件按钮 -->
				<view class="padding-tb">
					<l-button @click="reset" line="orange" class="block" block>重置查询条件</l-button>
				</view>
			</view>
		</scroll-view>

		<l-customlist-add v-if="!sideOpen" @click="action('add')" />

	</view>
</template>


<script>
	/* 
	 * 版 本 Learun-ADMS V7.0.3 力软敏捷开发框架(http://www.learun.cn) 
	 * Copyright (c) 2013-2020 上海力软信息技术有限公司 
	 * 创建人：超级管理员 
	 * 日  期：2020-10-16 15:39 
	 * 描  述：工作日志 
	 */

	/** 
	 * 本段代码由移动端代码生成器输出，移动端须 2.2.0 版本及以上可以使用 
	 * 请在移动端 /pages.json 中的 pages 字段中添加一条记录： 
	 * { "path": "pages/EducationalAdministration/Journal/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: {
					JTitle: {
						type: 'text'
					},
					JTypeId: {
						type: 'select',
						dataSource: '0'
					},
					// JReceiveId: {
					// 	type: 'organize',
					// 	dataType: 'user'
					// },
					JContent: {
						type: 'textarea'
					},
				},

				// 查询条件 
				searchData: {},
				defaultQueryData: {},
				queryData: {},

				// 数据源 
				dataSource: {
					JTypeId: Object.values(this.GET_GLOBAL('dataDictionary').JournalType).map(t => ({
							value: t.value,
							text: t.text
						})),
				},

				// 页面相关参数 
				ready: false,
				tips: '加载中...',
				loadState: '向下翻以加载更多',
				sideOpen: false,

				// 列表与分页信息 
				page: 1,
				total: 2,
				list: [],
				user: null,
			}
		},

		async onLoad() {
			await this.init()
		},
		onUnload() {
			this.OFF('EducationalAdministrationJournalSend-list-change')
		},

		methods: {
			// 页面初始化 
			async init() {
				this.ON('EducationalAdministrationJournalSend-list-change', this.refreshList)

				// 拉取加载列表和数据源 
				await Promise.all([


					() => {}
				])
				await this.fetchList()
				// 初始化查询条件 
				this.defaultQueryData = this.COPY(this.queryData)
				this.ready = true
			},

			// 拉取列表 
			async fetchList() {
				if (this.page > this.total) {
					return
				}

				const result = await this.HTTP_GET(
					'learun/adms/EducationalAdministration/Journal/pagelist', {
						// 这里 sidx 表示排序字段，sord 表示排序方式(DESC=降序，ASC=升序) 
						// 代码生成器生成时默认按照主键排序，您可以修改成按创建时间的字段降序 
						pagination: {
							rows: 10,
							page: this.page,
							sidx: 'JournalSendId',
							sord: 'DESC'
						},
						queryJson: JSON.stringify(this.searchData)
					},
					'加载数据时出错'
				)

				if (!result) {
					return
				}

				this.total = result.total
				this.page = result.page + 1
				this.list = this.list.concat(result.rows)

				this.tips = `已加载 ${Math.min(result.page, result.total)} / ${result.total} 页，共 ${result.records} 项`
				this.loadState = result.page >= result.total ? '已加载所有项目' : '向下翻以加载更多'
			},

			// 刷新清空列表 
			async refreshList() {
				this.page = 1
				this.total = 2
				this.list = []

				await this.fetchList()
			},

			// 列表下拉 
			pullDown() {
				this.refreshList().then(() => {
					this.$refs.list.stopPullDown()
				})
			},

			// 设置搜索条件 
			async searchChange() {
				const result = {}

				// 将其他查询项添加到查询 JSON 中 
				const queryObj = pickBy(this.queryData, t => (Array.isArray(t) ? t.length > 0 : t))
				Object.assign(result, mapValues(queryObj, t => (Array.isArray(t) ? t.join(',') : t)))

				this.searchData = result
				await this.refreshList()
			},

			// 点击「清空查询条件」按钮 
			reset() {
				this.queryData = this.COPY(this.defaultQueryData)
				this.searchChange()
			},

			// 点击「编辑」、「查看」、「添加」、「删除」按钮 
			async action(type, id = '') {
				switch (type) {
					case 'view':
						this.NAV_TO(`./single?type=view&id=${id}`)
						return

					case 'add':
						this.NAV_TO('./single?type=create')
						return

					case 'edit':
						this.NAV_TO(`./single?type=edit&id=${id}`)
						return

					case 'delete':
						if (!(await this.CONFIRM('删除项目', '确定要删除该项吗？', true))) {
							return
						}

						this.HTTP_POST('learun/adms/EducationalAdministration/Journal/delete', id, '删除失败').then(
							success => {
								if (!success) {
									return
								}
								this.TOAST('删除成功', 'success')
								this.refreshList()
							})
						return

					default:
						return
				}
			},

			// 显示列表中的标题项 
			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 '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
				}
			}

		},
		created() {
			this.user = this.GET_GLOBAL('loginUser');
			console.log(this.user)
		}
	}
</script>


<style lang="less" scoped>
	@import '~@/common/css/sidepage.less';
	@import '~@/common/css/customlist.less';
</style>