[update]-分标委、工作组、理事会会议列表页功能的开发

2021-12-15 21:22:59 +08:00
parent ed4092c436
commit b41a4347b1
10 changed files with 485 additions and 188 deletions
@@ -4,117 +4,119 @@
    :width="width"
    :visible="visible"
    switchFullscreen
+    fullscreen
    @cancel="handleCancel"
    cancelText="关闭">
-    <!--会议信息begin-->
-    <section class="base-info">
-      <h3 class="title">会议信息</h3>
-      <a-row :gutter="24" class="flex-col">
-        <a-col :span="12">
-          <label>会议名称：</label>
-          <span><j-ellipsis :value="model.meetingName" :length="20"></j-ellipsis></span>
-        </a-col>
-        <a-col :span="12">
-          <label>会议类型：</label>
-          <span><j-ellipsis :value="generateMeetingType(model.meetingType)" :length="20"></j-ellipsis></span>
-        </a-col>
-      </a-row>
-      <a-row :gutter="24" class="flex-col">
-        <a-col :span="12">
-          <label>召开时间：</label>
-          <span>{{ model.startTime + '~' + model.endTime }}</span>
-        </a-col>
-        <a-col :span="12">
-          <label>年份：</label>
-          <span><j-ellipsis :value="model.particularYear" :length="20"></j-ellipsis></span>
-        </a-col>
-      </a-row>
-      <a-row :gutter="24" class="flex-col">
-        <a-col :span="12">
-          <label>召开地点：</label>
-          <span><j-ellipsis :value="model.venue + '/' + model.address"></j-ellipsis></span>
-        </a-col>
-        <a-col :span="12">
-          <label>负责人：</label>
-          <span><j-ellipsis :value="model.directorName" :length="20"></j-ellipsis></span>
-        </a-col>
-      </a-row>
-      <a-row :gutter="24" class="flex-col">
-        <a-col :span="12">
-          <label>报名截止时间：</label>
-          <span><j-ellipsis :value="model.registerDeadline" :length="20"></j-ellipsis></span>
-        </a-col>
-        <a-col :span="12">
-          <label>会议通知：</label>
-          <span style="width: 100%;">
+    <a-spin :spinning="situationInfoLoading">
+      <!--会议信息begin-->
+      <section class="base-info">
+        <h3 class="title">会议信息</h3>
+        <a-row :gutter="24" class="flex-col">
+          <a-col :span="12">
+            <label>会议名称：</label>
+            <span><j-ellipsis :value="model.meetingName" :length="20"></j-ellipsis></span>
+          </a-col>
+          <a-col :span="12">
+            <label>会议类型：</label>
+            <span><j-ellipsis :value="generateMeetingType(model.meetingType)" :length="20"></j-ellipsis></span>
+          </a-col>
+        </a-row>
+        <a-row :gutter="24" class="flex-col">
+          <a-col :span="12">
+            <label>召开时间：</label>
+            <span>{{ model.startTime + '~' + model.endTime }}</span>
+          </a-col>
+          <a-col :span="12">
+            <label>年份：</label>
+            <span><j-ellipsis :value="model.particularYear" :length="20"></j-ellipsis></span>
+          </a-col>
+        </a-row>
+        <a-row :gutter="24" class="flex-col">
+          <a-col :span="12">
+            <label>召开地点：</label>
+            <span><j-ellipsis :value="model.venue + '/' + model.address"></j-ellipsis></span>
+          </a-col>
+          <a-col :span="12">
+            <label>负责人：</label>
+            <span><j-ellipsis :value="model.directorName" :length="20"></j-ellipsis></span>
+          </a-col>
+        </a-row>
+        <a-row :gutter="24" class="flex-col">
+          <a-col :span="12">
+            <label>报名截止时间：</label>
+            <span><j-ellipsis :value="model.registerDeadline" :length="20"></j-ellipsis></span>
+          </a-col>
+          <a-col :span="12">
+            <label>会议通知：</label>
+            <span style="width: 100%;">
            <preview-file style="width: 80%" :file-id="model.meetingFiles"></preview-file>
          </span>
-        </a-col>
-      </a-row>
-      <a-row :gutter="24" class="flex-col">
-        <a-col :span="12">
-          <label>会议费用：</label>
-          <span>{{ model.meetingCosts }} 元/人</span>
-        </a-col>
-        <a-col :span="12" v-show="model.meetingType === '2' ">
-          <label>会议费用(标协会员)：</label>
-          <span>{{ model.meetingCostsVip }} 元/人</span>
-        </a-col>
-        <a-col :span="12" v-if="model.paymentQrCode && model.meetingType !== '2'">
-          <label>收费二维码：</label>
-          <span>
+          </a-col>
+        </a-row>
+        <a-row :gutter="24" class="flex-col">
+          <a-col :span="12">
+            <label>会议费用：</label>
+            <span>{{ model.meetingCosts }} 元/人</span>
+          </a-col>
+          <a-col :span="12" v-show="model.meetingType === '2' ">
+            <label>会议费用(标协会员)：</label>
+            <span>{{ model.meetingCostsVip }} 元/人</span>
+          </a-col>
+          <a-col :span="12" v-if="model.paymentQrCode && model.meetingType !== '2'">
+            <label>收费二维码：</label>
+            <span>
            <img :src="paymentQrCodeSrc" alt="nothing show" class="payment-qrcode-img" />
          </span>
-        </a-col>
-      </a-row>
-      <a-row :gutter="24" class="flex-col" v-if="model.paymentQrCode && model.meetingType === '2'">
-        <a-col :span="24">
-          <label>收费二维码：</label>
-          <span>
+          </a-col>
+        </a-row>
+        <a-row :gutter="24" class="flex-col" v-if="model.paymentQrCode && model.meetingType === '2'">
+          <a-col :span="24">
+            <label>收费二维码：</label>
+            <span>
            <img :src="paymentQrCodeSrc" alt="nothing show" class="payment-qrcode-img" />
          </span>
-        </a-col>
-      </a-row>
-      <a-row :gutter="24" class="flex-col">
-        <a-col :span="24">
-          <label>会议内容：</label>
-          <span><j-ellipsis :value="model.meetingContent" :length="100"></j-ellipsis></span>
-        </a-col>
-      </a-row>
-    </section>
-    <!--会议信息end-->
-    <!--开票邮寄信息begin-->
-    <section class="logistics-info">
-      <h3 class="title">开票邮寄信息</h3>
-      <div>
+          </a-col>
+        </a-row>
+        <a-row :gutter="24" class="flex-col">
+          <a-col :span="24">
+            <label>会议内容：</label>
+            <span><j-ellipsis :value="model.meetingContent" :length="100"></j-ellipsis></span>
+          </a-col>
+        </a-row>
+      </section>
+      <!--会议信息end-->
+      <!--开票邮寄信息begin-->
+      <section class="logistics-info">
+        <h3 class="title">开票邮寄信息</h3>
+        <div>
        <span class="collapse-span color-blue"
              @click="showMoreInfo = !showMoreInfo">{{ showMoreInfo ? '收起' : '查看' }}</span>
-      </div>
-      <div class="wrap-table" :class="{'hide': !showMoreInfo}">
-        <a-table
-          ref="table"
-          size="middle"
-          rowKey="id"
-          :scroll="{x:true}"
-          :pagination="false"
-          :columns="columns"
-          :dataSource="logisticsInfoList"
-          class="j-table-force-nowrap"
-          :class="{'hide': !showMoreInfo}"
-        >
+        </div>
+        <div class="wrap-table" :class="{'hide': !showMoreInfo}">
+          <a-table
+            ref="table"
+            size="middle"
+            rowKey="id"
+            :scroll="{x:true}"
+            :pagination="false"
+            :columns="columns"
+            :dataSource="logisticsInfoList"
+            class="j-table-force-nowrap"
+            :class="{'hide': !showMoreInfo}"
+          >
        <span slot="action" slot-scope="record" class="action-span-cell">
          <a @click="lookLogistics(record)" v-if="record.postStatus === 1">查看物流</a>
        </span>
-          <!--          <p slot="expandedRowRender" slot-scope="record" style="margin: 0">-->
-          <!--            {{ record.sendDate }}-->
-          <!--          </p>-->
-        </a-table>
-      </div>
-    </section>
-    <!--开票邮寄信息end-->
+            <!--          <p slot="expandedRowRender" slot-scope="record" style="margin: 0">-->
+            <!--            {{ record.sendDate }}-->
+            <!--          </p>-->
+          </a-table>
+        </div>
+      </section>
+      <!--开票邮寄信息end-->
+
+      <!--报名信息begin-->

-    <!--报名信息begin-->
-    <a-spin :spinning="situationInfoLoading">
      <!--  除开国际研讨会嘉宾身份个人信息的显示   -->
      <section class="base-info" v-if="!(model.meetingType === 3 && situationInfo.identity === 1 )">
        <h3 class="title">报名信息</h3>
@@ -161,7 +163,8 @@
              </a-col>
            </a-row>
            <!--      只有参会人才会显示  会议费用为 0 不显示  -->
-            <a-row :gutter="24" class="flex-col" v-show="situationInfo.identity === 2 && model.meetingCosts !== '0.00' ">
+            <a-row :gutter="24" class="flex-col"
+                   v-show="situationInfo.identity === 2 && model.meetingCosts !== '0.00' ">
              <a-col :span="12">
                <label>付款方式：</label>
                <span><j-ellipsis :value="situationInfo.payMode_dictText" :length="20"></j-ellipsis></span>
@@ -196,7 +199,8 @@
            <a-col :span="12">
              <label>报名状态：</label>
              <span>
-                <sign-step :register-process="Number(situationInfo.registerProcess)" :need-costs="model.meetingCosts !== '0.00'"></sign-step>
+                <sign-step :register-process="Number(situationInfo.registerProcess)"
+                           :need-costs="model.meetingCosts !== '0.00'"></sign-step>
              </span>
            </a-col>
          </a-row>
@@ -508,7 +512,8 @@
            <a-col :span="12">
              <label>报名状态：</label>
              <span>
-                <sign-step :register-process="Number(situationInfo.registerProcess)" :need-costs="model.meetingCosts !== '0.00'"></sign-step>
+                <sign-step :register-process="Number(situationInfo.registerProcess)"
+                           :need-costs="model.meetingCosts !== '0.00'"></sign-step>
              </span>
            </a-col>
          </a-row>
@@ -667,20 +672,29 @@ export default {
  methods: {
    async open(param) {
      this.visible = true
+      this.situationInfoLoading = true
+      this.showMoreInfo = false
      // 通过id查询项目详情
-      queryCommonProjectById({ id: param.situationId }).then(res => {
-        if (res.success) {
-          console.log(res.result, 'res.result')
-          // 到账信息
-          this.paymentInfoList = res.result.paymentRecord
-          // 开票邮寄信息
-          this.logisticsInfoList = res.result.mailBill
-        } else {
-          console.log('未查到相应的信息')
-        }
-      })
+      if(!param.situationId) {
+        queryCommonProjectById({ id: param.situationId }).then(res => {
+          if (res.success) {
+            console.log(res.result, 'res.result')
+            // 到账信息
+            this.paymentInfoList = res.result.paymentRecord
+            // 开票邮寄信息
+            this.logisticsInfoList = res.result.mailBill
+          } else {
+            console.log('未查到相应的信息')
+          }
+        })
+      } else {
+        this.paymentInfoList = []
+        // 开票邮寄信息
+        this.logisticsInfoList = []
+      }

      if (param && !this.isMeetingBool) {
+        // 查询参会人的信息
        await this.getSingUpUserInfoFunc(param)
        // 消息进来的获取会议的详情
        this.queryMeetingInfoById(param.id).then(res => {
@@ -688,37 +702,33 @@ export default {
          this.model = Object.assign({}, res)
          console.log(this.model, 'this.model')
        })
-        // 查询参会人的信息
-        // getSingUpUserInfo({ id: param.situationId }).then(res => {
-        //   if (res.success) {
-        //     this.situationInfo = res.result
-        //   }
-        // })
-
-
      } else {
        // 会议进来查询的会议信息
        this.model = Object.assign({}, param)
        // 会议进来的查询参会人信息
        await this.getSingUpUserInfoFunc(param)
-        // getSingUpUserInfo({ id: param.situationId }).then(res => {
-        //   if (res.success) {
-        //     this.situationInfo = res.result
-        //   }
-        // })
      }
+      setTimeout(() => {
+        this.situationInfoLoading = false
+      }, 100)
    },
    getSingUpUserInfoFunc(param) {
      return new Promise(resolve => {
-        this.situationInfoLoading = true
-        getSingUpUserInfo({ id: param.situationId }).then(res => {
-          if (res.success) {
-            this.situationInfo = res.result
-          }
-        }).finally(() => {
-          this.situationInfoLoading = false
+        // 存在报名信息
+        if(param.situationId) {
+          getSingUpUserInfo({ id: param.situationId }).then(res => {
+            if (res.success) {
+              this.situationInfo = res.result
+            } else {
+              this.situationInfo = {}
+            }
+          }).finally(() => {
+            resolve()
+          })
+        } else {
+          this.situationInfo = {}
          resolve()
-        })
+        }
      })
    },
    close() {
@@ -783,7 +793,7 @@ export default {
              return '标协会议-信息交流会'
          }
          break
-          // return '标协会议'
+        // return '标协会议'
        case '3':
          return '国际研讨会'
        case '4':
@@ -28,18 +28,21 @@ const columns = [
  {
    title: '文件名',
    align: 'center',
-    dataIndex: 'name'
+    dataIndex: 'name',
+    width: 200
  },
  {
    title: '上传时间',
    align: 'center',
-    dataIndex: 'createTime'
+    dataIndex: 'createTime',
+    width: 100
  },
  {
    title: '操作',
    align: 'center',
    dataIndex: '',
-    scopedSlots: {customRender: 'action'}
+    scopedSlots: {customRender: 'action'},
+    width: 100
  }
 ]