| <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> |