大屏

liukangdong

2024-10-24 44dd2c7c73d5fead948902cad2695ae30d4620e2

 admin/src/views/meeting/components/OperaBookingsWindow.vue

@@ -1,88 +1,51 @@
<template>
  <GlobalAlertWindow
    :title="title"
    :visible.sync="visible"
    :confirm-working="isWorking"
    @confirm="confirm"
    width="840px"
  >
  <GlobalAlertWindow :title="title" :visible.sync="visible" :confirm-working="isWorking" @confirm="confirm"
    width="840px">
    <el-form :model="form" ref="form" :rules="rules" label-width="120px" label-suffix="：">
      <el-form-item label="关联会议室" prop="roomId">
        <el-select
          v-model="form.roomId"
          filterable
          clearable
          :disabled="isEdit"
          placeholder="请选择关联会议室"
          @change="selectRoom"
        >
        <el-select v-model="form.roomId" filterable clearable :disabled="isEdit" placeholder="请选择关联会议室"
          @change="selectRoom">
          <el-option v-for="item in rooms()" :key="item.id" :value="item.id" :label="item.name" />
        </el-select>
      </el-form-item>
      <el-form-item label="预定日期" prop="date">
        <el-date-picker
          :disabled="isEdit"
          v-model="form.date"
          value-format="yyyy-MM-dd"
          placeholder="请选择预定日期"
          @change="selectDate"
        ></el-date-picker>
        <el-date-picker :disabled="isEdit" v-model="form.date" value-format="yyyy-MM-dd" placeholder="请选择预定日期"
          @change="selectDate"></el-date-picker>
      </el-form-item>
      <el-form-item label="预定时间" prop="times">
        <div class="time-style">
          <div
            class="time-item"
            v-for="(item, index) in timelist"
            :key="item.id"
            :class="{
              'time-item-sel': form.times.indexOf(index)!=-1,
              'time-item-disable': item.isUse,
              'disable': item.bookingTimeId
            }"
            @click="selectTimes(index, item)"
          >{{ `${item.startTime}-${item.endTime}` }}</div>
          <div class="time-item" v-for="(item, index) in timelist" :key="item.id" :class="{
            'time-item-sel': form.times.indexOf(index) != -1,
            'time-item-disable': item.isUse,
            'disable': item.bookingTimeId
          }" @click="selectTimes(index, item)">{{ `${item.startTime}-${item.endTime}` }}</div>
        </div>
      </el-form-item>
      <el-form-item label="会议主题" prop="name">
        <el-input v-model="form.name" placeholder="请输入会议主题" :maxlength="30" v-trim/>
        <el-input v-model="form.name" placeholder="请输入会议主题" :maxlength="30" v-trim />
      </el-form-item>

      <el-form-item label="参会人员">
        <!-- <el-input style="width:40%" disabled v-model="sysList" placeholder="选择参会人员" v-trim/> -->
        <el-select
          v-model="form.sysList"
          filterable
          clearable
          multiple
          placeholder="选择部门成员"
        >
          <el-option
            v-for="item in sysList"
            :key="item.id"
            :value="item.id"
            :label="item.department?`${item.department.name}-${item.realname}`:item.realname"
          ></el-option>
          <!-- <el-option :key="1" :value="1" label="禁用" /> -->
        </el-select>
      </el-form-item>
      <div class="df_ac">
        <el-form-item label="参会人员">
          <el-select v-model="form.sysList" filterable clearable multiple placeholder="选择部门成员">
            <el-option v-for="item in sysList" :key="item.id" :value="item.id"
              :label="item.department ? `${item.department.name}-${item.realname}` : item.realname"></el-option>
            <!-- <el-option :key="1" :value="1" label="禁用" /> -->
          </el-select>
        </el-form-item>
        <el-form-item class="ml10" label-width="140px" label="是否通知参会人员">
          <el-radio v-model="form.joinNotice" :label="1">不通知</el-radio>
          <el-radio v-model="form.joinNotice" :label="0">通知</el-radio>
        </el-form-item>
      </div>
      <el-form-item label="会议内容" prop="content">
        <el-input
          type="textarea"
          v-model="form.content"
          :maxlength="300"
          show-word-limit
          :autosize="{ minRows: 4, maxRows: 12}"
          placeholder="请输入会议内容"
          v-trim
        />
        <el-input type="textarea" v-model="form.content" :maxlength="300" show-word-limit
          :autosize="{ minRows: 4, maxRows: 12 }" placeholder="请输入会议内容" v-trim />
      </el-form-item>
      <el-form-item v-if="projectList.length" label="选择服务项目" prop="projectList">
        <el-checkbox-group v-model="form.projectList">
          <el-checkbox
            v-for="project in projectList"
            :label="project.id"
            :key="project.id"
          >{{project.name}}</el-checkbox>
          <el-checkbox v-for="project in projectList" :label="project.id"
            :key="project.id">{{ project.name }}</el-checkbox>
        </el-checkbox-group>
      </el-form-item>
      <el-form-item label="会议附件" prop="fileList">
@@ -90,24 +53,16 @@
          <el-button type="primary" icon="el-icon-upload" @click="$refs.upFile.click()">会议附件</el-button>
        </div>
        <div class="data-list">
          <FileLink
            :links="form.fileList"
            linkName="fileFullUrl"
          />
          <FileLink :links="form.fileList" linkName="fileFullUrl" />
        </div>
      </el-form-item>
      <el-form-item label="会议备注" prop="remark">
        <el-input type="textarea" v-model="form.remark" placeholder="请输入会议备注" v-trim/>
        <el-input type="textarea" v-model="form.remark" placeholder="请输入会议备注" v-trim />
      </el-form-item>
      <input type="file" @change="upFiles" ref="upFile" style="display: none;" />
    </el-form>

    <el-dialog
      title="会议室预约情况"
      :visible.sync="isShowDetail"
      append-to-body
      width="600px"
    >
    <el-dialog title="会议室预约情况" :visible.sync="isShowDetail" append-to-body width="600px">
      <div class="detail_modal">
        <div class="h1">{{ activeInfo.meetingName }}</div>
        <div class="line">
@@ -144,7 +99,7 @@
  name: 'OperaBookingsWindow',
  extends: BaseOpera,
  components: { GlobalAlertWindow, FileLink },
  data () {
  data() {
    return {
      // 表单数据
      form: {
@@ -158,6 +113,7 @@
        startTime: '',
        endTime: '',
        times: [],
        joinNotice: 1,
        content: '',
        sysList: [],
        fileList: []
@@ -193,7 +149,7 @@
    }
  },
  inject: ['rooms'],
  created () {
  created() {
    this.config({
      api: '/meeting/bookings',
      'field.id': 'id'
@@ -214,7 +170,7 @@
     * @title 窗口标题
     * @target 编辑的对象
     */
    open (title, target) {
    open(title, target) {
      this.title = title
      this.visible = true
      this.timelist = []
@@ -242,7 +198,7 @@
        this.selectRoom(this.form.roomId)
      })
    },
    selectRoom (objId) {
    selectRoom(objId) {
      this.getTimes()
      findListByObjId({
        objId: objId,
@@ -252,11 +208,11 @@
          this.projectList = res
        })
    },
    selectDate (v) {
    selectDate(v) {
      // console.log(v);
      this.getTimes()
    },
    getTimes (isInit = false) {
    getTimes(isInit = false) {
      this.form.times = []
      this.timelist = []

@@ -293,7 +249,7 @@
          })
      }
    },
    getDetail (id) {
    getDetail(id) {
      BookDetailById({
        id
      }).then(res => {
@@ -301,7 +257,7 @@
        this.isShowDetail = true
      })
    },
    selectTimes (index, item) {
    selectTimes(index, item) {
      if (item.bookingTimeId) {
        this.getDetail(item.bookingTimeId)
        return
@@ -331,7 +287,7 @@
      }
      // console.log(this.form.times);
    },
    upFiles (file) {
    upFiles(file) {
      const formdate = new FormData()
      this.isUploading = true
      formdate.append('file', file.target.files[0])
@@ -352,7 +308,7 @@
      this.$refs.upFile.value = null
    },
    // 确认新建
    __confirmCreate () {
    __confirmCreate() {
      this.$refs.form.validate((valid) => {
        // debugger
        if (!valid) {
@@ -401,7 +357,7 @@
      })
    },
    // 确认修改
    __confirmEdit () {
    __confirmEdit() {
      this.$refs.form.validate((valid) => {
        if (!valid) {
          return
@@ -463,6 +419,7 @@
  display: flex;
  flex-wrap: wrap;
  cursor: pointer;

  .time-item {
    margin-right: 8px;
    margin-bottom: 8px;
@@ -479,46 +436,54 @@
    border: #cccccc solid 1px;
    cursor: pointer;
  }

  .time-item-sel {
    border-color: $primary-color;
    background-color: #f6f9fe;
    color: $primary-color;
  }

  .time-item-disable {
    color: #fff;
    border-color: #cccccc;
    background-color: #cccccc;
  }
  .disable{

  .disable {
    border-color: #bed6f9;
    background-color: #bed6f9;
    color: #fff;
  }
}

.detail_modal {
  padding: 20px 16px;

  .title {
    text-align: center;
    font-weight: 600;
    font-size: 16px;
    margin-bottom: 20px;
  }

  .h1 {
    font-weight: 600;
    font-size: 16px;
    margin-bottom: 15px;
  }

  .line {
    display: flex;
    margin-bottom: 10px;

    .label {
      width: 70px;
      color: #888888;
    }

    .value {
      color: #333333;
    }
  }
}

</style>