<template> 
 | 
  <GlobalAlertWindow 
 | 
    :title="title" 
 | 
    :visible.sync="visible" 
 | 
    :confirm-working="isWorking" 
 | 
    @confirm="confirm" 
 | 
    width="600px" 
 | 
  > 
 | 
    <div class="title-style"> 
 | 
      <div class="header-title">{{ form.name }}</div> 
 | 
      <div class="item-value">{{ `${form.roomName} ${form.meetingTime}` }}</div> 
 | 
    </div> 
 | 
    <div class="content-style"> 
 | 
      <div class="item"> 
 | 
        <div class="item-title">参会人员</div> 
 | 
        <div>{{ form.sysList.map(item => `${item.realName}`).join(',') }}</div> 
 | 
      </div> 
 | 
      <div class="item"> 
 | 
        <div class="item-title">会议内容</div> 
 | 
        <div class="item-value">{{ form.content || '无' }}</div> 
 | 
      </div> 
 | 
      <div v-if="form.projectList.length" class="item"> 
 | 
        <div class="">服务项</div> 
 | 
        <div class="item-value">{{ form.projectList.map(item => item.projectName).join(' | ') }}</div> 
 | 
      </div> 
 | 
      <div class="item" v-if="form.fileList.length"> 
 | 
        <div class="item-title">附件</div> 
 | 
        <div> 
 | 
          <FileLink 
 | 
            :links="form.fileList" 
 | 
            linkName="fileFullUrl" 
 | 
            :isUpload="false" 
 | 
          /> 
 | 
        </div> 
 | 
      </div> 
 | 
      <div class="item" v-if="!!form.remark"> 
 | 
        <div class="item-title">备注</div> 
 | 
        <div class="item-value">{{ form.remark }}</div> 
 | 
      </div> 
 | 
    </div> 
 | 
    <div class="bottom-style"> 
 | 
      <div class="item-title">预约人</div> 
 | 
      <div class="item-value">{{ form.managerInfo }}</div> 
 | 
    </div> 
 | 
    <div slot="footer"> 
 | 
      <el-button @click="visible=false">取消</el-button> 
 | 
    </div> 
 | 
  </GlobalAlertWindow> 
 | 
</template> 
 | 
  
 | 
<script> 
 | 
import BaseOpera from '@/components/base/BaseOpera' 
 | 
import GlobalAlertWindow from '@/components/common/GlobalAlertWindow' 
 | 
import FileLink from '@/views/meeting/components/common/FileLink' 
 | 
export default { 
 | 
  name: 'OperaBookingsDetailWindow', 
 | 
  extends: BaseOpera, 
 | 
  components: { GlobalAlertWindow, FileLink }, 
 | 
  data () { 
 | 
    return { 
 | 
      // 表单数据 
 | 
      form: { 
 | 
        id: null, 
 | 
        name: '', 
 | 
        roomName: '', 
 | 
        meetingTime: '', 
 | 
        date: '', 
 | 
        editDate: '', 
 | 
        projectList: [], 
 | 
        remark: '', 
 | 
        roomId: '', 
 | 
        startTime: '', 
 | 
        endTime: '', 
 | 
        times: [], 
 | 
        content: '', 
 | 
        sysList: [], 
 | 
        fileList: [], 
 | 
        managerInfo: '' 
 | 
      }, 
 | 
      // room: [], 
 | 
      sysList: [], 
 | 
      projectList: [], 
 | 
      timelist: [], 
 | 
      // 验证规则 
 | 
      rules: { 
 | 
  
 | 
      } 
 | 
    } 
 | 
  }, 
 | 
  created () { 
 | 
    this.config({ 
 | 
      api: '/meeting/bookings', 
 | 
      'field.id': 'id' 
 | 
    }) 
 | 
  
 | 
  }, 
 | 
  methods: { 
 | 
    /** 
 | 
     * 打开窗口 
 | 
     * @title 窗口标题 
 | 
     * @target 编辑的对象 
 | 
     */ 
 | 
    //  open (title, target) { 
 | 
    //   this.title = title 
 | 
    //   this.visible = true 
 | 
    //   this.timelist = [] 
 | 
    //   // 新建 
 | 
    //   if (target == null) { 
 | 
    //     this.$nextTick(() => { 
 | 
    //       this.$refs.form.resetFields() 
 | 
    //       this.form[this.configData['field.id']] = null 
 | 
    //     }) 
 | 
    //     return 
 | 
    //   } 
 | 
    //   // 编辑 
 | 
    //   this.$nextTick(() => { 
 | 
    //     for (const key in this.form) { 
 | 
    //       this.form[key] = target[key] 
 | 
    //     } 
 | 
    //     // this.form.projectList = target.projectList ? target.projectList.map(item => item.projectId) : [] 
 | 
    //     // this.form.sysList = this.form.sysList ? this.form.sysList.map(item => item.userId) : [] 
 | 
    //     // this.form.date = target.startTime.split(' ')[0] 
 | 
  
 | 
    //   }) 
 | 
    // }, 
 | 
  
 | 
  }, 
 | 
} 
 | 
</script> 
 | 
  
 | 
<style lang="scss" scoped> 
 | 
::v-deep .el-dialog__body { 
 | 
  padding: 0; 
 | 
} 
 | 
.title-style { 
 | 
  padding: 20px; 
 | 
  border-bottom: 10px #f7f7f7 solid; 
 | 
} 
 | 
.content-style { 
 | 
  padding: 20px; 
 | 
  border-bottom: 10px #f7f7f7 solid; 
 | 
} 
 | 
.item { 
 | 
  padding: 5px 0; 
 | 
} 
 | 
.header-title { 
 | 
  font-size: 16px; 
 | 
  font-weight: 600; 
 | 
  padding-bottom: 5px; 
 | 
} 
 | 
.item-title { 
 | 
  font-size: 16px; 
 | 
  color: #999; 
 | 
  padding-bottom: 5px; 
 | 
} 
 | 
.item-value { 
 | 
  font-size: 14px; 
 | 
  color: #111; 
 | 
} 
 | 
.bottom-style { 
 | 
  padding: 20px; 
 | 
} 
 | 
  
 | 
</style> 
 |