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.

list.vue 11 KiB

4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363
  1. <template>
  2. <view class="page">
  3. <!-- 主列表页 -->
  4. <view :class="sideOpen ? 'show' : ''" class="mainpage" style="padding-top: 80rpx;">
  5. <!-- 顶部条目/分页信息栏 -->
  6. <l-customlist-banner @buttonClick="sideOpen = true">{{ tips }}</l-customlist-banner>
  7. <!-- 滚动列表,跨端支持上拉/下拉 -->
  8. <l-scroll-list v-if="ready" @pullDown="pullDown" @toBottom="fetchList()" ref="list">
  9. <l-customlist :tips="loadState" showTips>
  10. <!-- 单条记录 -->
  11. <view class="customlist-item" v-for="item of list" :key="item.Id">
  12. <view class="customlist-item-field">
  13. <text class="customlist-item-field-title">申请时间:</text>
  14. {{ displayListItem(item, 'UpdateDate') }}
  15. </view>
  16. <view class="customlist-item-field">
  17. <text class="customlist-item-field-title">审核状态:</text>
  18. {{ IsCheckitem(displayListItem(item, 'IsCheck')) }}
  19. </view>
  20. <view class="customlist-item-field">
  21. <text class="customlist-item-field-title">原上课时间:</text>
  22. {{itmeDel(displayListItem(item, 'LessonDate')) }}
  23. </view>
  24. <view class="customlist-item-field">
  25. <text class="customlist-item-field-title">学年度:</text>
  26. {{ displayListItem(item, 'AcademicYearNo') }}
  27. </view>
  28. <view class="customlist-item-field">
  29. <text class="customlist-item-field-title">学期:</text>
  30. {{ displayListItem(item, 'Semester') }}
  31. </view>
  32. <view class="customlist-item-field">
  33. <text class="customlist-item-field-title">学号:</text>
  34. {{ displayListItem(item, 'StuNo') }}
  35. </view>
  36. <view class="customlist-item-field">
  37. <text class="customlist-item-field-title">姓名:</text>
  38. {{ displayListItem(item, 'StuName') }}
  39. </view>
  40. <view class="customlist-item-field">
  41. <text class="customlist-item-field-title">年级:</text>
  42. {{ displayListItem(item, 'Grade') }}
  43. </view>
  44. <view class="customlist-item-field">
  45. <text class="customlist-item-field-title">系所码:</text>
  46. {{ displayListItem(item, 'DeptNo') }}
  47. </view>
  48. <view class="customlist-item-field">
  49. <text class="customlist-item-field-title">系名:</text>
  50. {{ displayListItem(item, 'DeptName') }}
  51. </view>
  52. <view class="customlist-item-field">
  53. <text class="customlist-item-field-title">专业码:</text>
  54. {{ displayListItem(item, 'MajorNo') }}
  55. </view>
  56. <view class="customlist-item-field">
  57. <text class="customlist-item-field-title">专业名:</text>
  58. {{ displayListItem(item, 'MajorName') }}
  59. </view>
  60. <view class="customlist-item-field">
  61. <text class="customlist-item-field-title">所在行政班号:</text>
  62. {{ displayListItem(item, 'ClassNo') }}
  63. </view>
  64. <l-customlist-action :showButton="!item.IsCheck" buttonText="审核" @join="action('check',item.ID)" @view="action('view', item.ID)" />
  65. </view>
  66. </l-customlist>
  67. </l-scroll-list>
  68. </view>
  69. <!-- 关闭侧边抽屉按钮 -->
  70. <view @click="sideOpen = false" :class="sideOpen ? 'show' : ''" class="sideclose">
  71. <l-icon type="pullright" color="blue" />
  72. </view>
  73. <!-- 侧边栏,用于设置查询条件 -->
  74. <scroll-view :class="sideOpen ? 'show' : ''" class="sidepage" scroll-y>
  75. <view v-if="ready" class="padding">
  76. <l-input
  77. v-model="queryData.StuNo"
  78. @change="searchChange"
  79. title ="学号"
  80. placeholder="按学号查询"
  81. />
  82. <l-input
  83. v-model="queryData.StuName"
  84. @change="searchChange"
  85. title ="姓名"
  86. placeholder="按姓名查询"
  87. />
  88. <!-- 重置查询条件按钮 -->
  89. <view class="padding-tb">
  90. <l-button @click="reset" line="orange" class="block" block>重置查询条件</l-button>
  91. </view>
  92. </view>
  93. </scroll-view>
  94. <!-- <l-customlist-add v-if="!sideOpen" @click="action('add')" /> -->
  95. </view>
  96. </template>
  97. <script>
  98. /*
  99. * 版 本 Learun-ADMS V7.0.3 力软敏捷开发框架(http://www.learun.cn)
  100. * Copyright (c) 2013-2020 上海力软信息技术有限公司
  101. * 创建人:超级管理员
  102. * 日 期:2020-10-20 15:22
  103. * 描 述:aaa
  104. */
  105. /**
  106. * 本段代码由移动端代码生成器输出,移动端须 2.2.0 版本及以上可以使用
  107. * 请在移动端 /pages.json 中的 pages 字段中添加一条记录:
  108. * { "path": "pages/EducationalAdministration/StuAttendanceLeave/list", "style": { "navigationBarTitleText": "表单列表页" } }
  109. *
  110. * (navigationBarTitleText 字段为本页面的标题文本,可以修改)
  111. * (必须自行操作该步骤,力软代码生成器不会自动帮您修改 /pages.json 文件)
  112. */
  113. import moment from 'moment'
  114. import get from 'lodash/get'
  115. import set from 'lodash/set'
  116. import pickBy from 'lodash/pickBy'
  117. import mapValues from 'lodash/mapValues'
  118. export default {
  119. data() {
  120. return {
  121. // 数据项的数据类型、结构
  122. scheme: {
  123. UpdateDate:{type: 'text'},
  124. IsCheck:{type: 'text'},
  125. LessonDate:{type: 'text'},
  126. AcademicYearNo: { type: 'text' },
  127. Semester: { type: 'text' },
  128. StuNo: { type: 'text' },
  129. StuName: { type: 'text' },
  130. Grade: { type: 'text' },
  131. DeptNo: { type: 'text' },
  132. DeptName: { type: 'text' },
  133. MajorNo: { type: "text" },
  134. MajorName: { type: "text" },
  135. ClassNo: { type: 'text' },
  136. },
  137. // 查询条件
  138. searchData: {},
  139. defaultQueryData: {},
  140. queryData: {
  141. StuNo: '',
  142. StuName: '',
  143. },
  144. // 数据源
  145. dataSource: {
  146. MajorNo:[]
  147. },
  148. // 页面相关参数
  149. ready: false,
  150. tips: '加载中...',
  151. loadState: '向下翻以加载更多',
  152. sideOpen: false,
  153. // 列表与分页信息
  154. page: 1,
  155. total: 2,
  156. list: [],
  157. user: null
  158. }
  159. },
  160. async onLoad() {
  161. await this.init()
  162. },
  163. onUnload() {
  164. this.OFF('EducationalAdministrationStuAttendanceLeave-list-change')
  165. },
  166. methods: {
  167. // 页面初始化
  168. async init() {
  169. this.ON('EducationalAdministrationStuAttendanceLeave-list-change', this.refreshList)
  170. // 拉取加载列表和数据源
  171. await Promise.all([
  172. this.FETCH_DATASOURCE('CdMajorInfo').then(result => {
  173. this.dataSource.MajorNo = result.data.map(t => ({ text: t.majorname, value: t.majorno }))
  174. }),
  175. () => {}
  176. ])
  177. await this.fetchList()
  178. // 初始化查询条件
  179. this.defaultQueryData = this.COPY(this.queryData)
  180. this.ready = true
  181. },
  182. // 拉取列表
  183. async fetchList() {
  184. if (this.page > this.total) { return }
  185. const result = await this.HTTP_GET(
  186. 'learun/adms/EducationalAdministration/StuAttendanceLeave/pagelist',
  187. {
  188. // 这里 sidx 表示排序字段,sord 表示排序方式(DESC=降序,ASC=升序)
  189. // 代码生成器生成时默认按照主键排序,您可以修改成按创建时间的字段降序
  190. pagination: { rows: 10, page: this.page, sidx: 'UpdateDate', sord: 'DESC' },
  191. queryJson: JSON.stringify(Object.assign(this.searchData,{ClassManagerNo:this.user.account}))
  192. },
  193. '加载数据时出错'
  194. )
  195. if (!result) { return }
  196. this.total = result.total
  197. this.page = result.page + 1
  198. this.list = this.list.concat(result.rows)
  199. this.tips = `已加载 ${Math.min(result.page, result.total)} / ${result.total} 页,共 ${result.records} 项`
  200. this.loadState = result.page >= result.total ? '已加载所有项目' : '向下翻以加载更多'
  201. },
  202. // 刷新清空列表
  203. async refreshList() {
  204. this.page = 1
  205. this.total = 2
  206. this.list = []
  207. await this.fetchList()
  208. },
  209. // 列表下拉
  210. pullDown() {
  211. this.refreshList().then(() => {
  212. this.$refs.list.stopPullDown()
  213. })
  214. },
  215. // 设置搜索条件
  216. async searchChange() {
  217. const result = {}
  218. // 将其他查询项添加到查询 JSON 中
  219. const queryObj = pickBy(this.queryData, t => (Array.isArray(t) ? t.length > 0 : t))
  220. Object.assign(result, mapValues(queryObj, t => (Array.isArray(t) ? t.join(',') : t)))
  221. this.searchData = result
  222. await this.refreshList()
  223. },
  224. // 点击「清空查询条件」按钮
  225. reset() {
  226. this.queryData = this.COPY(this.defaultQueryData)
  227. this.searchChange()
  228. },
  229. // 点击「编辑」、「查看」、「添加」、「删除」按钮
  230. async action(type, id = '') {
  231. switch (type) {
  232. case 'view':
  233. this.NAV_TO(`./single?type=view&id=${id}`)
  234. return
  235. case 'add':
  236. this.NAV_TO('./single?type=create')
  237. return
  238. case 'edit':
  239. this.NAV_TO(`./single?type=edit&id=${id}`)
  240. return
  241. case 'delete':
  242. if (!(await this.CONFIRM('删除项目', '确定要删除该项吗?', true))) {
  243. return
  244. }
  245. this.HTTP_POST('learun/adms/EducationalAdministration/StuAttendanceLeave/delete', id, '删除失败').then(success => {
  246. if(!success) { return }
  247. this.TOAST('删除成功', 'success')
  248. this.refreshList()
  249. })
  250. return
  251. case 'check':
  252. this.NAV_TO(`./single?type=edit&id=${id}`)
  253. return
  254. default:
  255. return
  256. }
  257. },
  258. // 显示列表中的标题项
  259. displayListItem(item, field) {
  260. const fieldItem = this.scheme[field]
  261. const value = item[field]
  262. switch (fieldItem.type) {
  263. case 'currentInfo':
  264. case 'organize':
  265. return fieldItem.dataType === 'time' ? value : get(this.GET_GLOBAL(fieldItem.dataType), `${value}.name`, '')
  266. case 'radio':
  267. case 'select':
  268. const selectItem = this.dataSource[field].find(t => t.value === String(value))
  269. return get(selectItem, 'text', '')
  270. case 'checkbox':
  271. if (!value || value.split(',').length <= 0) { return '' }
  272. const checkboxItems = value.split(',')
  273. return this.dataSource[field].filter(t => checkboxItems.includes(t.value)).map(t => t.text).join(',')
  274. case 'datetime':
  275. if (!value) { return '' }
  276. return moment(value).format(Number(fieldItem.dateformat) === 0 ? 'YYYY年 M月 D日' : 'YYYY-MM-DD HH:mm')
  277. default: return value === null || value === undefined ? '' : value
  278. }
  279. },
  280. IsCheckitem(data){
  281. if(data){
  282. return data == 1?'同意':'不同意'
  283. }else{
  284. return '待审核'
  285. }
  286. },
  287. itmeDel(data){
  288. var newDate = /\d{4}-\d{1,2}-\d{1,2}/g.exec(data)
  289. return newDate[0]
  290. }
  291. },
  292. created() {
  293. this.user = this.GET_GLOBAL('loginUser');
  294. },
  295. }
  296. </script>
  297. <style lang="less" scoped>
  298. @import '~@/common/css/sidepage.less';
  299. @import '~@/common/css/customlist.less';
  300. </style>