jiangping
2024-12-27 5506edbe54883b31db3cc8e4a1d9d0795a18a3c9
company/src/components/business/OperaCompanyUserApplyCarefulWindow.vue
¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,179 @@
<template>
    <GlobalWindow
        :title="title"
        width="100%"
        :visible.sync="visible"
        :confirm-working="isWorking"
        @confirm="confirm"
    >
        <div class="info" v-if="info">
            <div class="info_list">
                <div class="info_list_item" style="width: 100%;">
                    <div class="info_list_item_label">申请授权账号:</div>
                    <div class="info_list_item_val">{{info.userName}}</div>
                </div>
                <div class="info_list_item" style="width: 100%;">
                    <div class="info_list_item_label">授权管理企业:</div>
                    <div class="info_list_item_val">{{info.companyNames}}</div>
                </div>
                <div class="info_list_item" style="width: 100%;">
                    <div class="info_list_item_label">申请说明:</div>
                    <div class="info_list_item_val">{{info.content}}</div>
                </div>
                <div class="info_list_item" style="width: 100%;">
                    <div class="info_list_item_label">申请附件:</div>
                    <div class="info_list_item_val">
                        <div class="info_list_item_val_cul">
                            <u v-for="(item, index) in info.multifileList" :key="index" @click="openFile(item.fileurlFull)">{{item.name}}</u>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <el-form :model="form" ref="form" :rules="rules">
            <el-form-item label="是否通过" prop="status">
                <el-radio-group v-model="form.status">
                    <el-radio :label="1">审核通过</el-radio>
                    <el-radio :label="2">审核不通过</el-radio>
                </el-radio-group>
            </el-form-item>
            <el-form-item :label="form.status === 1 ? '备注理由' : '驳回理由'" prop="checkInfo" :rules="form.status === 2 ? { required: true, message: '驳回理由不能为空', trigger: 'blur' } : { required: false } ">
                <el-input
                    type="textarea"
                    placeholder="请输入"
                    v-model="form.checkInfo"
                    maxlength="300"
                    show-word-limit />
            </el-form-item>
        </el-form>
        <!-- é¢„览pdf -->
        <OperaPdfViewerWindow ref="OperaPdfViewerWindow" />
    </GlobalWindow>
</template>
<script>
  import BaseOpera from '@/components/base/BaseOpera'
  import GlobalWindow from '@/components/common/GlobalWindow'
  import UploadFile from '@/components/common/UploadFile'
  import OperaPdfViewerWindow from '@/components/business/OperaPdfViewerWindow'
  import { audit, getById } from '@/api/business/companyUserApply'
  export default {
    name: 'OperaCompanyUserApplyCarefulWindow',
    extends: BaseOpera,
    components: { GlobalWindow, UploadFile, OperaPdfViewerWindow },
    data () {
      return {
        // è¡¨å•数据
        form: {
          id: null,
          status: 1,
          checkInfo: ''
        },
        info: null,
        // éªŒè¯è§„则
        rules: {}
      }
    },
    methods: {
      open (title, id) {
        this.title = title
        this.form.checkInfo = ''
        this.form.status = 1
        this.form.id = id
        getById(id)
          .then(res => {
            this.info = res
            this.visible = true
          })
      },
      openFile(url) {
        this.$refs.OperaPdfViewerWindow.open('附件', url)
      },
      confirm() {
        this.$refs.form.validate((valid) => {
          if (!valid) {
            return
          }
          // è°ƒç”¨æ–°å»ºæŽ¥å£
          this.isWorking = true
          audit(this.form)
            .then(() => {
              this.visible = false
              this.$tip.apiSuccess('审核成功')
              this.$emit('success')
            })
            .catch(e => {
              this.$tip.apiFailed(e)
            })
            .finally(() => {
              this.isWorking = false
            })
        })
      }
    }
  }
</script>
<style lang="scss" scoped>
    .info {
        width: 100%;
        .info_label {
            width: 100%;
            display: flex;
            align-items: center;
            justify-content: space-between;
            margin-bottom: 20px;
            span {
                font-size: 18px;
                font-weight: 600;
                color: #000000;
            }
        }
        .info_list {
            width: 100%;
            display: flex;
            align-items: center;
            flex-wrap: wrap;
            .info_list_item {
                width: 50%;
                display: flex;
                align-items: start;
                margin-bottom: 20px;
                .info_list_item_label {
                    font-size: 15px;
                    flex-shrink: 0;
                }
                .info_list_item_val {
                    flex: 1;
                    display: flex;
                    align-items: center;
                    font-size: 15px;
                    .info_list_item_val_cul {
                        display: flex;
                        flex-direction: column;
                        u {
                            font-size: 15px;
                            color: #2E68EC;
                            cursor: pointer;
                            margin-top: 5px;
                            &:first-child {
                                margin: 0;
                            }
                        }
                    }
                    .image {
                        width: 100px;
                        height: 100px;
                        display: flex;
                        align-items: center;
                        justify-content: center;
                        overflow: hidden;
                        img {
                            width: 100%;
                        }
                    }
                }
            }
        }
    }
</style>