DigitalScholl/Learun.Framework.Ultimate V7/LearunApp-2.2.0/pages/PersonnelManagement/MeetingManagement/list.vue

<template>
  <view class="page">
    <!-- 主列表页 -->
    <view
      :class="sideOpen ? 'show' : ''"
      class="mainpage"
      style="padding-top: 80rpx"
    >
      <!-- 顶部条目/分页信息栏 -->
      <l-customlist-banner @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.Id">
            <view class="customlist-item-field">
              <text class="customlist-item-field-title">会议主题：</text>
              {{ displayListItem(item, "MeetingTitle") }}
            </view>

            <view class="customlist-item-field">
              <text class="customlist-item-field-title">会议地点：</text>
              {{ displayListItem(item, "MeetingPlace") }}
            </view>

            <view class="customlist-item-field">
              <text class="customlist-item-field-title">开始时间：</text>
              {{ displayListItem(item, "BeginTime") }}
            </view>

            <view class="customlist-item-field">
              <text class="customlist-item-field-title">结束时间：</text>
              {{ displayListItem(item, "EndTime") }}
            </view>

           <!-- <view class="customlist-item-field">
              <text class="customlist-item-field-title">申请人：</text>
              {{ displayListItem(item, "CreateUser") }}
            </view> -->
			
			<view class="customlist-item-field">
			  <text class="customlist-item-field-title">会议状态：</text>
			  {{ displayListItem(item, "CheckStatus") }}
			</view>

          <!--  <view class="customlist-item-field">
              <text class="customlist-item-field-title">会议记录者：</text>
              {{ displayListItem(item, "RecordPerson") }}
            </view> -->

         <!--   <view class="customlist-item-field">
              <text class="customlist-item-field-title">会议内容：</text>
              {{ displayListItem(item, "Content") }}
            </view> -->

          <!--  <view class="customlist-item-field">
              <text class="customlist-item-field-title">附件上传：</text>
              {{ displayListItem(item, "Files") }}
            </view> -->

              <!-- showButton
              buttonText="会议纪要" -->
           <!-- <l-customlist-action
			  :showButton="item.CheckStatus==0 && user.userId == item.CreateUser"
              :showEdit="item.CheckStatus=='0'"
              @edit="action('edit', item.Id)"
              :showDelete="item.CheckStatus=='0'"
              @delete="action('delete', item.Id)"
              @view="action('view', item.Id)"
            /> -->
			<view class="customlist-banner-action">
				<view 
					v-if="item.CheckStatus==0 && user.userId == item.CreateUser"
					@click="action('delete', item.Id)"
					class="customlist-banner-action-btn line-red text-sm"
					style="border: currentColor 1px solid">
					<l-icon type="delete" />
					删除
				</view>
			
				<view 
					v-if="item.CheckStatus==0 && user.userId == item.CreateUser"
					@click="action('edit', item.Id, item)"
					class="customlist-banner-action-btn line-blue text-sm"
					style="border: currentColor 1px solid">
					<l-icon type="edit" />
					编辑
				</view>
				
				<view @click="action('view', item.Id, item)"
					class="customlist-banner-action-btn line-blue text-sm"
					style="border: currentColor 1px solid">
					<l-icon type="search" />
					查看
				</view>
			</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.MeetingTitle"
          @change="searchChange"
          title="会议主题"
          placeholder="按会议主题查询"
        />
        <l-select
          v-model="queryData.MeetingPlace"
          @change="searchChange"
          :range="dataSource.MeetingPlace"
          title="会议地点"
          placeholder="按会议地点查询"
        />
        <!-- <l-organize-picker
          v-model="queryData.CreateUser"
          @change="searchChange"
          type="user"
          title="申请人"
          placeholder="按申请人查询"
        /> -->

        <!-- 重置查询条件按钮 -->
        <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-2021 上海力软信息技术有限公司
 * 创建人：超级管理员
 * 日  期：2021-02-21 10:07
 * 描  述：会议管理
 */

/**
 * 本段代码由移动端代码生成器输出，移动端须 2.2.0 版本及以上可以使用
 * 请在移动端 /pages.json 中的 pages 字段中添加一条记录：
 * { "path": "pages/PersonnelManagement/MeetingManagement/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: {
        MeetingTitle: { type: "text" },
        MeetingPlace: { type: "select", dataSource: "0" },
        BeginTime: { type: "datetime", dateformat: "1" },
        EndTime: { type: "datetime", dateformat: "1" },
        RecordPerson: { type: "organize", dataType: "user" },
        Content: { type: "texteditor" },
        Files: { type: "upload" },
        // CreateUser: { type: "organize", dataType: "user" },
		CheckStatus:{ type: "select"},
      },

      // 查询条件
      searchData: {},
      defaultQueryData: {},
      queryData: {
        MeetingTitle: "",
        MeetingPlace: "",
        // CreateUser: "",
      },

      // 数据源
      dataSource: {
        MeetingPlace: [],
		CheckStatus:[
		  {
			value:'0',
			text:"未审核"
		  },
		  {
			value:'1',
			text:"已通过"
		  },
		  {
			value:'2',
			text:"未通过"
		  },
		  {
			value:'3',
			text:"审核中"
		  },
		]
      },

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

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

  async onLoad() {
    await this.init();
  },
  onUnload() {
    this.OFF("PersonnelManagementMeetingManagement-list-change");
  },

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

      // 拉取加载列表和数据源
      await Promise.all([
		  this.FETCH_DATASOURCE('ConferenceRoom').then(result => {
		    this.dataSource.MeetingPlace = result.data.map(t => ({ text: t.name, value: t.id }))
		  }),
	  ]);
      await this.fetchList();
      // 初始化查询条件
      this.defaultQueryData = this.COPY(this.queryData);
      this.ready = true;
    },

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

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

      if (!result) {
        return;
      }

      this.total = result.total;
      this.page = result.page + 1;
      this.list = isConcat?this.list.concat(result.rows):result.rows;

      this.tips = `已加载 ${Math.min(result.page, result.total)} / ${
        result.total
      } 页，共 ${result.records} 项`;
      this.loadState =
        result.page >= result.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() {
      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(false);
    },

    // 点击「清空查询条件」按钮
    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 "join":
          this.NAV_TO(`/pages/PersonnelManagement/MeetingMinutes/list?meetId=${id}`);
          return;

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

          this.HTTP_POST(
            "learun/adms/PersonnelManagement/MeetingManagement/delete",
            id,
            "删除失败"
          ).then((success) => {
            if (!success) {
              return;
            }
            this.TOAST("删除成功", "success");
            this.refreshList();
          });
          return;
		case 'check':
			if (!(await this.CONFIRM('提交项目', '确定要提交该项吗？', true))) {
				return
			}
			
			this.HTTP_POST('/learun/adms/PersonnelManagement/MeetingManagement/submit', 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');
  }
};
</script>


<style lang="less" scoped>
@import "~@/common/css/sidepage.less";
@import "~@/common/css/customlist.less";
.customlist-banner-action {
	margin-top: 20rpx;
	text-align: right;

	.customlist-banner-action-btn {
		display: inline-block;
		padding: 4px 6px;
		margin: 0 3px;
		border-radius: 3px;
		text-align: center;
	}
}
</style>