''

liukangdong

2024-05-16 e016353b27ac0694d52966b9e573dc8d5beb3359

 admin/src/views/task/taskDetail.vue

@@ -5,6 +5,7 @@
    backText="拒绝"
    :visible.sync="isShowModal"
    @confirm="confirm"
    @close="reject"
  >
    <div class="modal_wrap">
      <div class="modal_content">
@@ -65,7 +66,11 @@
            <el-table-column label="证件类型" prop="" min-width="80" />
            <el-table-column label="证件号码" prop="" min-width="120" />
            <el-table-column label="公司名称" prop="" min-width="120" />
            <el-table-column label="人脸照片" prop="" min-width="80" />
            <el-table-column label="人脸照片" prop="" min-width="80">
              <template slot-scope="{ row }">
                <el-image :src="row.url" :preview-src-list="[row.url]"> </el-image>
              </template>
            </el-table-column>
          </el-table>
        </div>
      </div>
@@ -110,6 +115,79 @@
        </div>
      </div>
    </div>
    <!--  -->
    <template #btns>
      <el-button type="primary" plain @click="handleTransfer">转交</el-button>
    </template>
    <!--  同意/拒绝 -->
    <el-dialog
      append-to-body
      :title="apprTitle"
      :visible.sync="isShowAppr"
      width="480px"
    >
      <el-input
        type="textarea"
        :placeholder="apprTitle + '说明，非必填'"
        :rows="4"
        v-model="param.explain"
      />
      <span slot="footer" class="dialog-footer">
        <el-button @click="isShowAppr = false">取消</el-button>
        <el-button type="primary" @click="isShowAppr = false">确定</el-button>
      </span>
    </el-dialog>
    <!-- 隐患 -->
    <el-dialog
      append-to-body
      title="隐患"
      :visible.sync="isShowProblem"
      width="480px"
    >
      <el-form :model="param" :rules="rules" ref="ruleForm" label-width="100px">
        <el-form-item label="退回时间">
          <el-date-picker
            class="w300"
            value-format="yyyy-MM-dd"
            type="date"
            placeholder="选择日期"
            v-model="param.date"
          />
        </el-form-item>
        <el-form-item label="整改前">
          <div class="df_ac">
            <img src="@/assets/avatar/man.png" />
            <el-upload
              class="avatar-uploader"
              action="https://jsonplaceholder.typicode.com/posts/"
              :show-file-list="false"
              :on-success="handleAvatarSuccess"
              :before-upload="beforeAvatarUpload"
            >
              <img v-if="param.url" :src="param.url" class="avatar" />
              <div v-else class="upload_box">
                <el-icon class="el-icon-plus icon" />
                <div class="text">图片/视频</div>
              </div>
            </el-upload>
          </div>
        </el-form-item>
        <el-form-item label="退回说明">
          <el-input
            type="textarea"
            placeholder="请填写说明"
            :rows="4"
            v-model="param.explain"
          />
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="isShowProblem = false">取消</el-button>
        <el-button type="primary" @click="isShowProblem = false"
          >确定</el-button
        >
      </span>
    </el-dialog>
  </GlobalWindow>
</template>

@@ -123,18 +201,49 @@
      isShowModal: false,
      detail: {
        datalist: [{}]
      }
      },

      isShowAppr: false,
      apprTitle: '同意',
      param: {},

      isShowProblem: false,
      rules: {}
    }
  },
  methods: {
    confirm() {
      console.log('--')
    }
    },
    handleTransfer() {
      this.isShowProblem = true
    },
    reject() { },
    handleAvatarSuccess() { },
    beforeAvatarUpload() { }
  }
}
</script>

<style lang="scss" scoped>
.upload_box {
  width: 84px;
  height: 84px;
  border-radius: 4px;
  background-color: #f7f7f7;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  color: #999999;
  border: 1px solid #e4e4e4;
  .icon {
    font-size: 24px;
  }
  .text {
    font-size: 12px;
  }
}
.modal_wrap {
  display: flex;
  height: 100%;