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

<template> 
  <view class="page"> 
    <!-- 主列表页 --> 
    <view class="mainpage" style="padding-top: 80rpx;"> 
      <!-- 顶部条目/分页信息栏 --> 
	  <view class="customlist-banner-header">
	    <view class="customlist-banner-content">
	      <slot>{{tips}}</slot>
	    </view>
	  </view>
  
      <!-- 滚动列表，跨端支持上拉/下拉 --> 
      <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"> 
  
            <view class="customlist-item-field"> 
              <text class="customlist-item-field-title">学生编码：</text> 
              {{ displayListItem(item, 'StuNo') }} 
            </view> 
  
            <view class="customlist-item-field"> 
              <text class="customlist-item-field-title">姓名：</text> 
              {{ displayListItem(item, 'StuName') }} 
            </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, 'IdentityCardNo') }} 
            </view> 
  
            <view class="customlist-item-field"> 
              <text class="customlist-item-field-title">学籍号：</text> 
              {{ displayListItem(item, 'StuCode') }} 
            </view> 
  
            <view class="customlist-item-field"> 
              <text class="customlist-item-field-title">学号：</text> 
              {{ displayListItem(item, 'ProvinceCode') }} 
            </view> 
  
            <view class="customlist-item-field"> 
              <text class="customlist-item-field-title">专业：</text> 
              {{ displayListItem(item, 'MajorNo') }} 
            </view> 
  
            <view class="customlist-item-field"> 
              <text class="customlist-item-field-title">学制：</text> 
              {{ displayListItem(item, 'EduSystem') }} 
            </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, 'mobile') }} 
            </view> 
  
            <view class="customlist-item-field"> 
              <text class="customlist-item-field-title">毕业去向：</text> 
              {{ displayListItem(item, 'GraduateGo') }} 
            </view> 
  
            <view class="customlist-item-field"> 
              <text class="customlist-item-field-title">升入高校名称：</text> 
              {{ displayListItem(item, 'EnterUniversityName') }} 
            </view> 
  
            <view class="customlist-item-field"> 
              <text class="customlist-item-field-title">大学层次：</text> 
              {{ displayListItem(item, 'UniversityLevel') }} 
            </view> 
  
            <view class="customlist-item-field"> 
              <text class="customlist-item-field-title">就业单位名称：</text> 
              {{ displayListItem(item, 'EmployerName') }} 
            </view> 
  
            <view class="customlist-item-field"> 
              <text class="customlist-item-field-title">就业单位所属省：</text> 
              {{ displayListItem(item, 'EmployerProvince') }} 
            </view> 
  
            <view class="customlist-item-field"> 
              <text class="customlist-item-field-title">就业单位所属市：</text> 
              {{ displayListItem(item, 'EmployerCity') }} 
            </view> 
  
            <view class="customlist-item-field"> 
              <text class="customlist-item-field-title">就业单位所属县（区）：</text> 
              {{ displayListItem(item, 'EmployerCountry') }} 
            </view> 
  
            <view class="customlist-item-field"> 
              <text class="customlist-item-field-title">备注：</text> 
              {{ displayListItem(item, 'Remark') }} 
            </view> 
  
  
            <l-customlist-action showEdit @edit="action('edit', item.Id)" showDelete @delete="action('delete', item.Id)" @view="action('view', item.Id)" /> 
          </view> 
        </l-customlist> 
      </l-scroll-list> 
    </view> 
  
    
    <l-customlist-add @click="action('add')" /> 
  
  </view> 
</template> 
  
  
<script> 
/* 
 * 版 本 Learun-ADMS V7.0.3 力软敏捷开发框架(http://www.learun.cn) 
 * Copyright (c) 2013-2020 上海力软信息技术有限公司 
 * 创建人：超级管理员 
 * 日  期：2022-09-23 15:16 
 * 描  述：毕业信息统计 
 */
  
/** 
 * 本段代码由移动端代码生成器输出，移动端须 2.2.0 版本及以上可以使用 
 * 请在移动端 /pages.json 中的 pages 字段中添加一条记录： 
 * { "path": "pages/EducationalAdministration/StuGraduateStatistic/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: { 
        StuNo: { type: 'text', title: '学生编码' }, 
        StuName: { type: 'text', title: '姓名' }, 
        GenderNo: { type: 'select', title: '性别' }, 
        IdentityCardNo: { type: 'text' , title: '身份证号'}, 
        StuCode: { type: 'text', title: '学籍号' }, 
        ProvinceCode: { type: 'text', title: '学号' }, 
        MajorNo: { type: 'select', title: '专业', dataSource: '1', dataSourceId: 'CdMajorInfo,majorname,majorno' },
		EduSystem: { type: 'select', title: '学制', itemCode: 'EduSystem', dataSource: '0' }, 
        ClassNo: { type: 'select', title: '班级', dataSource: '1', dataSourceId: 'bjsj,classname,classno' }, 
        mobile: { type: 'text', title: '联系电话' }, 
		GraduateGo: { type: 'select', title: '毕业去向', itemCode: 'GraduateGo', dataSource: '0' }, 
        EnterUniversityName: { type: 'text', title: '升入高校名称' }, 
		UniversityLevel: { type: 'select', title: '大学层次', itemCode: 'UniversityLevel', dataSource: '0' }, 
        EmployerName: { type: 'text', title: '就业单位名称' }, 
        EmployerProvince: { type: 'select', title: '就业单位所属省', dataSource: '1', dataSourceId: 'DIC_PROVINCE,pname,pcode' }, 
        EmployerCity: { type: 'select', title: '就业单位所属市', dataSource: '1', dataSourceId: 'DIC_CITY,cname,ccode' }, 
        EmployerCountry: { type: 'select', title: '就业单位所属县（区）', dataSource: '1', dataSourceId: 'DIC_AREA,aname,acode' }, 
        Remark: { type: 'textarea' , title: '备注'}, 
      }, 
  
      // 查询条件 
      searchData: {}, 
      defaultQueryData: {}, 
      queryData: { 
		
      }, 
  
      // 数据源 
      dataSource: { 
		GenderNo: [
		    { text: '男', value: 'true' },
		    { text: '女', value: 'false' }
		],
		MajorNo: [], 
		EduSystem: Object.values(this.GET_GLOBAL('dataDictionary').EduSystem).map(t => ({ value: t.value, text: t.text })),
		ClassNo: [], 
		GraduateGo: Object.values(this.GET_GLOBAL('dataDictionary').GraduateGo).map(t => ({ value: t.value, text: t.text })),
		UniversityLevel: Object.values(this.GET_GLOBAL('dataDictionary').GraduateLevel).map(t => ({ value: t.value, text: t.text })),
		EmployerProvince: [], 
		EmployerCity: [], 
		EmployerCountry: [], 
		
      }, 
  
      // 页面相关参数 
      ready: false, 
      tips: '加载中...', 
      loadState: '向下翻以加载更多', 
      sideOpen: false, 
  
      // 列表与分页信息 
      page: 1, 
      total: 2, 
      list: [] 
    } 
  }, 
  
  async onLoad() { 
    await this.init() 
  }, 
  onUnload() { 
    this.OFF('EducationalAdministrationStuGraduateStatistic-list-change') 
  }, 
  
  methods: { 
    // 页面初始化 
    async init() { 
      this.ON('EducationalAdministrationStuGraduateStatistic-list-change', this.refreshList) 
  
      // 拉取加载列表和数据源 
      await Promise.all([ 
			this.FETCH_DATASOURCE('CdMajorInfo').then(result => {
			  this.dataSource.MajorNo = result.data.map(t => ({ text: t.majorname, value: t.majorno })) 
			}), 
			this.FETCH_DATASOURCE('bjsj').then(result => { 
			  this.dataSource.ClassNo = result.data.sort((a,b)=>{return b.classno-a.classno}).map(t => ({ text: t.classname, value: t.classno })) 
			}),
			this.FETCH_DATASOURCE('DIC_PROVINCE').then(result => {
			  this.dataSource.EmployerProvince = result.data.map(t => ({ text: t.pname, value: t.pcode })) 
			}),
			this.FETCH_DATASOURCE('DIC_CITY').then(result => {
			  this.dataSource.EmployerCity = result.data.map(t => ({ text: t.cname, value: t.ccode })) 
			}),
			this.FETCH_DATASOURCE('DIC_AREA').then(result => {
			  this.dataSource.EmployerCountry = result.data.map(t => ({ text: t.aname, value: t.acode })) 
			}),
  
        () => {} 
      ]) 
      await this.fetchList() 
      // 初始化查询条件 
      this.defaultQueryData = this.COPY(this.queryData) 
      this.ready = true
    }, 
  
    // 拉取列表 
    async fetchList() { 
      if (this.page > this.total) { return } 
	  
	  const sobj = {
		  StuNo:this.GET_GLOBAL('loginUser').account,
	  };
	  Object.assign(this.searchData,sobj);
  
      const result = await this.HTTP_GET( 
        'learun/adms/EducationalAdministration/StuGraduateStatistic/pagelist', 
        { 
          // 这里 sidx 表示排序字段，sord 表示排序方式(DESC=降序，ASC=升序) 
          // 代码生成器生成时默认按照主键排序，您可以修改成按创建时间的字段降序 
          pagination: { rows: 10, page: this.page, sidx: 'Id', 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/StuGraduateStatistic/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 
      } 
    } 
  
  } 
} 
</script> 
  
  
<style lang="less" scoped> 
@import '~@/common/css/sidepage.less'; 
@import '~@/common/css/customlist.less'; 
</style> 
<style lang="less" scoped>
.customlist-banner-header {
  position: fixed;
  top: var(--window-top);
  z-index: 1024;
  border-bottom: 1rpx solid #ddd;
  height: 80rpx;
  width: 100%;
  box-shadow: 0 0.5px 3px rgba(0, 0, 0, 0.1);
  background: #f1f1f1;

  .customlist-banner-content {
    color: #8f8f94;
    background: #ffffff;
    padding: 20rpx 25rpx;
    width: 100%;
    vertical-align: middle;
    border-bottom: 1rpx solid #ddd;

    .customlist-banner-action {
      position: absolute;
      right: 20rpx;
      top: 20rpx;
    }
  }
}
</style>