zxl
4 天以前 93bfb1c5512db9feceb16cd3084a92d4dedf615e
manager/src/views/activity/index.vue
@@ -136,6 +136,11 @@
            <Button
              type="info"
              size="small"
              @click="detail(row)"
            >详情</Button>
            <Button
              type="info"
              size="small"
              @click="openEdit(row)"
            >编辑</Button>
            <Button
@@ -336,6 +341,82 @@
        </Row>
      </Modal>
      <Modal
        v-model="infoModelShow"
        :title="modelTitle"
        @on-cancel="infoModelClose"
        width="800"
        :mask-closable="false"
      >
        <div class="detail-container">
          <Row :gutter="16">
            <Col span="12">
              <div class="detail-item">
                <label>活动名称:</label>
                <span>{{ activityInfo.activityName || '-' }}</span>
              </div>
            </Col>
            <Col span="12">
              <div class="detail-item">
                <label>活动类型:</label>
                <span>{{activityInfo.activityType === 'online' ? '线上':'线下'}}</span>
              </div>
            </Col>
            <Col span="12">
              <div class="detail-item">
                <label>报名时间段:</label>
                <span>{{ activityInfo.reportStartTime }} - {{ activityInfo.reportEndTime }}</span>
              </div>
            </Col>
            <Col span="12">
              <div class="detail-item">
                <label>活动时间段:</label>
                <span>{{ activityInfo.startTime }} - {{ activityInfo.endTime }}</span>
              </div>
            </Col>
            <Col span="24" v-if="coverType === '输入文字封面'">
              <div class="detail-item">
                <label>封面文字:</label>
                <span>{{ activityInfo.cover || '-' }}</span>
              </div>
            </Col>
            <Col span="24" v-if="coverType === '选择文件封面'">
              <div class="detail-item">
                <label>上传封面:</label>
                <span>{{ activityInfo.cover }}</span>
              </div>
            </Col>
            <Col span="12">
              <div class="detail-item">
                <label>人数限制:</label>
                <span>{{ activityInfo.limitUserNum || '无限制' }}</span>
              </div>
            </Col>
            <Col span="12">
              <div class="detail-item">
                <label>活动地点:</label>
                <span>{{ activityInfo.activityLocation || '-' }}</span>
              </div>
            </Col>
            <Col span="24">
              <div class="detail-item">
                <label>活动内容:</label>
                <div
                  class="activity-content"
                  v-html="activityInfo.activityContent || '无内容'"
                ></div>
              </div>
            </Col>
          </Row>
        </div>
        <div slot="footer">
          <Button @click="infoModelClose">关闭</Button>
        </div>
      </Modal>
      <!-- 图片预览模态框 -->
      <Modal v-model="previewVisible" title="图片预览" footer-hide>
        <img :src="previewImageUrl" style="width: 100%">
@@ -361,6 +442,8 @@
  components: {Editor},
  data() {
    return {
      infoModelShow:false,
      loading: false,
      membersLoading: false,
      submitLoading: false,
@@ -397,6 +480,24 @@
      // 活动表单
      activityFrom: {
        id: '',
        activityName: '',
        activityType: '',
        reportTime: [],
        time: [],
        activityContent: '',
        cover: '',
        coverType: '',
        status: '',
        reportStartTime: '',
        reportEndTime: '',
        startTime: '',
        endTime: '',
        recommend: false,
        limitUserNum: 0,
        activityLocation: '',
      },
      activityInfo: {
        id: '',
        activityName: '',
        activityType: '',
@@ -645,6 +746,11 @@
    this.init()
  },
  methods: {
    detail(row){
      this.modelTitle = '活动详情'
      this.infoModelShow = true
      this.activityInfo = row
    },
    // 获取富文本编辑器的内容
    getReason(content) {
      this.activityFrom.activityContent = content
@@ -757,7 +863,9 @@
        this.coverType = row.coverType === 'text' ? '输入文字封面' : '选择文件封面'
      })
    },
    infoModelClose(){
      this.infoModelShow = false
    },
    // 关闭模态框
    modelClose() {
      this.modelShow = false
@@ -1183,4 +1291,33 @@
    margin-top: 4px;
  }
}
.detail-container {
  padding: 16px;
}
.detail-item {
  margin-bottom: 18px;
  line-height: 1.5;
  label {
    display: inline-block;
    width: 100px;
    color: #666;
    font-weight: bold;
    vertical-align: top;
  }
  span {
    display: inline-block;
    width: calc(100% - 110px);
  }
}
.activity-content {
  border: 1px solid #dcdee2;
  border-radius: 4px;
  padding: 12px;
  min-height: 100px;
  margin-top: 8px;
}
</style>