UNION_NSI/target/classes/static/components/activity/site/ReserveInfo.vue

<template>
  <div>
    <el-tabs tab-position="top" v-model="activeName" style="padding: 20px">
<!--      <el-tab-pane v-if="$.parseJSON(role) === true" label="当前场地使用情况" name="1">-->
<!--        <el-calendar v-model="reserve_time">-->
<!--          <template slot="dateCell" slot-scope="{date, data}">-->
<!--            <div class="div-Calendar">-->
<!--              <p :class="data.isSelected ? 'is-selected' : ''">-->
<!--                {{ data.day.split('-').slice(1).join('-') }} {{ data.isSelected ? '√' : '' }}-->
<!--              </p>-->
<!--              <div v-if="$.parseJSON(role) === true" v-for="item in viewData.site_info">-->
<!--                <div v-if="data.day.toString()==item.reserve_day"-->
<!--                     :style="{backgroundColor:([0].includes(item.stateaudittype)?'#FAECD9':'#E0F4D9')}">-->
<!--                  <el-row :gutter="20" style="line-height: 30px;margin-bottom: 10px;">-->
<!--                    <el-col :span="4">-->
<!--                      <el-button v-if="[0].includes(item.stateaudittype)" type="warning"-->
<!--                                 size="mini" circle>待-->
<!--                      </el-button>-->
<!--                      <el-button v-if="item.stateaudittype==3" type="success" size="mini" circle>通-->
<!--                      </el-button>-->
<!--                    </el-col>-->
<!--                    <el-col :span="20" style="font-size: 10px">-->
<!--                      <b>{{ item.reserve_person }}</b>：{{ item.start_time }}-{{ item.end_time }}-->
<!--                    </el-col>-->
<!--                  </el-row>-->
<!--                </div>-->
<!--              </div>-->
<!--            </div>-->
<!--          </template>-->
<!--        </el-calendar>-->
<!--      </el-tab-pane>-->

      <el-tab-pane label="预约基本信息" name="2">
        <border-table>
          <table style="margin-top: 20px">
            <tr>
              <th>预约人姓名</th>
              <td>
                {{ viewData.reserve_person_username }}
              </td>
              <th>预约人工号</th>
              <td>
                {{ viewData.loginname }}
              </td>
              <th>预约人性别</th>
              <td>
                {{ viewData.reserve_person_sex }}
              </td>
            </tr>
            <tr>
              <th>预约人电话</th>
              <td>
                {{ viewData.reserve_person_phone }}
              </td>
              <th>预约人工会</th>
              <td>
                {{ viewData.reserve_person_unitname }}
              </td>
              <th>预约人部门</th>
              <td>
                {{ viewData.reserve_person_unitname }}
              </td>
            </tr>
            <tr>
              <th>预约场地</th>
              <td>
                {{ viewData.site_name }}
              </td>
              <th>预约时间</th>
              <td colspan="3">
                {{ viewData.reserve_start_time }} - {{ viewData.reserve_end_time }}
              </td>
<!--              <th>预约活动项目</th>-->
<!--              <td>-->
<!--                {{ viewData.reserve_activity }}-->
<!--              </td>-->
            </tr>
            <tr>
              <th>参加人数</th>
              <td>
                {{ viewData.reserve_join_user_num }}
              </td>
              <th>预约事由</th>
              <td colspan="3">
                {{ viewData.reserve_cause }}
              </td>

<!--              <th>场地需求</th>-->
<!--              <td>-->
<!--                {{ viewData.reserve_demand }}-->
<!--              </td>-->
            </tr>
            <tr>
              <th>预约状态</th>
              <td :colspan="5">
                <span v-if="[0].includes(viewData.stateAuditType)"
                      style="color: #e6a23c">{{ viewData.state_name }}</span>
                <span v-if="viewData.stateAuditType==3" style="color: #67c23a">{{ viewData.state_name }}</span>
                <span v-if="viewData.stateAuditType==1" style="color: #f56c6c">{{ viewData.state_name }}</span>
              </td>
            </tr>
          </table>
        </border-table>
      </el-tab-pane>

      <el-tab-pane label="分工会审核信息" name="3" v-if="viewData.unionProcess">
        <border-table>
          <table style="margin-top: 20px">
            <tr>
              <th>审核人</th>
              <td>
                {{ viewData.unionProcess.username }}
              </td>
              <th>审核结果</th>
              <td>
                {{ viewData.unionProcess.auditPass?'通过':'驳回' }}
              </td>
            </tr>
            <tr>
              <th>审核时间</th>
              <td>
                {{ viewData.unionProcess.auditTime }}
              </td>
              <th>审核意见</th>
              <td>
                {{ viewData.unionProcess.auditOpinion }}
              </td>
            </tr>
          </table>
        </border-table>
      </el-tab-pane>

      <el-tab-pane label="校工会审核信息" name="4" v-if="viewData.schoolProcess">
        <border-table>
          <table style="margin-top: 20px">
            <tr>
              <th>审核人</th>
              <td>
                {{ viewData.schoolProcess.username }}
              </td>
              <th>审核结果</th>
              <td>
                {{ viewData.schoolProcess.auditPass?'通过':'驳回' }}
              </td>
            </tr>
            <tr>
              <th>审核时间</th>
              <td>
                {{ viewData.schoolProcess.auditTime }}
              </td>
              <th>审核意见</th>
              <td>
                {{ viewData.schoolProcess.auditOpinion }}
              </td>
            </tr>
          </table>
        </border-table>
      </el-tab-pane>

      <slot name="handle"></slot>
    </el-tabs>
  </div>
</template>

<script>
module.exports = {
  props: {
    id: String,
    activeName: {
      type: String,
      default: '1'
    },
  },
  data() {
    return {
      activeName: '2',
      viewData: {},
      reserve_time: '',
    }
  },
  methods: {
    async getSiteReserveInfo(id) {
      const {data} = await $.get(base + "/platform/activity/site/reserve/findOne", {id})
      return data
    },
    async openView(id,activeName = '2') {
      this.viewData = await this.getSiteReserveInfo(id)
      this.activeName = activeName
    }
  }
}
</script>

<style scoped>
.el-descriptions-item__cell {
  text-align: center !important;
}
</style>