antissoft / NetworkInformation

<template>
  <el-dialog
    title="研判建议"
    :close-on-click-modal="false"
    :visible.sync="visible"
    class="NCC-dialog NCC-dialog_center"
    lock-scroll
    width="60%"
  >
    <el-row :gutter="15" class="NCC-dialog-content" v-loading="loading">
      <el-col :span="10" style="border-right: 1px solid #e6e6e6; height: 400px;">
        <el-row>
            <el-col :span="24" class="form_title"> 巡查上报详情 </el-col>
            <el-col :span="24">
              <div class="form-item">
                <div class="label w-100">问题来源：</div>
                {{ dataForm.reportSourceName || '--' }}
              </div>
            </el-col>
            <el-col :span="24">
              <div class="form-item">
                <div class="label w-100">应用名称：</div>
                {{ dataForm.platformNameStr || "--" }}
              </div>
            </el-col>
            <el-col :span="24">
              <div class="form-item">
                <div class="label w-100">运营主体：</div>
                {{ dataForm.companyStr || "--" }}
              </div>
            </el-col>
            <el-col :span="24">
              <div class="form-item">
                <div class="label w-100">应用类型：</div>
                {{ dataForm.platformTypeStr || "--" }}
              </div>
            </el-col>
            <el-col :span="24" v-if="dataForm.platformType == '580634746028033285'">
              <div class="form-item">
                <div class="label w-100">归属平台：</div>
                {{ dataForm.selfMediaPlatformType || "--" }}
              </div>
            </el-col>
            <el-col :span="24">
              <div class="form-item">
                <div class="label w-100">问题类型：</div>
                {{ dataForm.questionType || "--" }}
              </div>
            </el-col>
            <template v-if="dataForm.questionType == '错误表述'">
              <el-col :span="24">
                <div class="form-item">
                  <div class="label w-100">正确描述：</div>
                  {{ dataForm.accurateDescription || "--" }}
                </div>
              </el-col>
              <el-col :span="24">
                <div class="form-item">
                  <div class="label w-100">错误描述：</div>
                  {{ dataForm.incorrectDescription || "--" }}
                </div>
              </el-col>
            </template>
            <el-col :span="24">
              <div class="form-item">
                <div class="label w-100">问题内容：</div>
                {{ dataForm.questionContent || "--" }}
              </div>
            </el-col>
            <el-col :span="24">
              <div class="form-item">
                <div class="label w-100">关键词：</div>
                {{ dataForm.questionClass || "--" }}
              </div>
            </el-col>
            <el-col :span="24">
              <div class="form-item">
                <div class="label w-100">所属区域：</div>
                {{ dataForm.areaName || "--" }}
              </div>
            </el-col>
            <el-col :span="24" v-if="dataForm.disposalSuggestions">
              <div class="form-item">
                <div class="label w-100">区县处理说明：</div>
                {{ dataForm.disposalSuggestions || "--" }}
              </div>
            </el-col>
        </el-row>
      </el-col>
      <el-col :span="14">
        <el-row>
          <el-col :span="24" class="form_title"> 研判建议 </el-col>
          <el-form
            ref="suggestionForm"
            :rules="rules"
            :model="suggestionForm"
            size="small"
            label-width="100px"
            label-position="right"
          >
            <el-col :span="24">
              <el-form-item label="研判类型" prop="reviewType">
                <el-radio-group
                  v-model="suggestionForm.reviewType"
                  size="medium"
                  @change="judgmentClassChange"
                >
                  <el-radio v-for="v in judgmentClassOption" :key="v.Id" :label="v.Id">{{v.FullName}}</el-radio>
                </el-radio-group>
              </el-form-item>
            </el-col>
            <el-col :span="24" v-show="(!dataForm.areaId || dataForm.areaId == '580548871316383493') && showarea">
              <el-form-item label="所属区县" prop="area">
                <el-radio-group v-removeAriaHidden v-model="suggestionForm.area" placeholder="请选择所属区县" style="line-height: 22px" @change="suggestionFormAreaChange">
                  <el-radio v-for="v in areaOptions.filter(j => j.id != '580548871316383493')" :key="v.id" :label="v.id">{{ v.fullName }}</el-radio>
                </el-radio-group>
              </el-form-item>
            </el-col>
            <el-col :span="24" v-if="showSuggsetion">
              <el-form-item label="研判意见" prop="judgmentOpinions">
                <el-input
                  v-model="suggestionForm.judgmentOpinions"
                  placeholder="请输入研判意见"
                  show-word-limit
                  :style="{ width: '100%' }"
                  type="textarea"
                  :autosize="{ minRows: 4, maxRows: 4 }"
                  maxlength="200"
                >
                </el-input>
              </el-form-item>
            </el-col>
          </el-form>
        </el-row>
      </el-col>
    </el-row>
    <span slot="footer" class="dialog-footer">
      <el-button @click="visible = false">取 消</el-button>
      <el-button type="primary" @click="dataFormSubmit()" :loading="btnLoading">确 定</el-button>
    </span>
  </el-dialog>
</template>
<script>
import request from "@/utils/request";
import infoMixin from "@/mixins/info";
import { dynamicText } from "@/filters/index";
import { getDictionaryDataSelector } from "@/api/systemData/dictionary";
import { getDetail, disposalSuggestions } from "@/api/systemData/dataInterface";
export default {
  components: {},
  mixins: [infoMixin], 
  props: [],
  data() {
    return {
      loading: true,
      visible: false,
      isDetail: true,
      dataForm: {
        id: undefined,
        platformName: undefined,
        platformNameStr: undefined,
        platformTypeStr: undefined,
        platformType: undefined,
        questionType: undefined,
        questionClass: undefined,
        questionContent: undefined,
        link: undefined,
        obtainEvidence: [],
        annex: [],
      },
      sourceOptions: [],
      platformTypeOptions: [],
      questionTypeOptions: [],
      questionClassOptions: [
        { fullName: "选项一", id: "1" },
        { fullName: "选项二", id: "2" },
      ],
      stageOptions: [
        { fullName: "选项一", id: "1" },
        { fullName: "选项二", id: "2" },
      ],

      suggestionForm: {
        disposalSuggestions: "", //处置建议
        judgmentOpinions: "", //判断意见
        reviewType: "", //判断分类
        deadline: "",
        area: '',
      },
      rules: {
        reviewType: [
          { required: true, message: "请选择审核类型", trigger: "blur" },
        ],
        area: [
          { required: true, message: "请选择所属区域", trigger: "bulr" },
        ],
        judgmentOpinions: [
          { required: true, message: "请填写研判意见", trigger: "bulr" }
        ]
      },
      showSuggsetion: false,
      showarea: false,
      judgmentClassOption: [],
      areaOptions: [],
      btnLoading: false,
    };
  },
  computed: {
    isSHILevel() {
      // 判断角色是否为‘市级办公室’
      return this.$store.state.user.islader;
    },
  },
  watch: {},
  created() {
    
  },
  mounted() {},
  methods: {
    async getSourceOptions() {
      let { data } = await request({
        url: `/Extend/baseinspectionreport/GetReportSourceList`,
        method: "GET",
      });
      this.sourceOptions = data;
    },
    getplatformTypeOptions() {
      getDictionaryDataSelector("576279943168656645").then((res) => {
        this.platformTypeOptions = res.data.list;
      });
    },
    getquestionTypeOptions() {
      getDictionaryDataSelector("577006814432855301").then((res) => {
        this.questionTypeOptions = res.data.list;
      });
    },
    async getjudgmentClassOptions() {
      await request({
        url: `/Extend/BaseInspectionReport/GetReviewTypeList`,
        method: 'GET',
      }).then(res => {
        this.judgmentClassOption = res.data;
      })
    },
    goBack() {
      this.$emit("refresh");
    },
    async init(id, isDetail) {
      this.dataForm.id = id || 0;
      this.visible = true;
      this.showSuggsetion = false;
      this.showarea = false;
      this.loading = true;
      await this.getSourceOptions();
      await this.initAreaTypeList();
      await this.getjudgmentClassOptions();
      this.$nextTick(async () => {
        this.$refs["suggestionForm"].resetFields();
        if (this.dataForm.id) {
          let res = await getDetail(this.dataForm.id);
          this.dataForm = res.data;
          this.dataForm.areaName = dynamicText(res.data.areaId, this.areaOptions);
          this.suggestionFormAreaChange(res.data.areaId)
          this.sourceOptions.length && this.dataForm.reportSource && (this.dataForm.reportSourceName = this.sourceOptions.find(v => v.Id == this.dataForm.reportSource).FullName);
          if (!this.dataForm.obtainEvidence) this.dataForm.obtainEvidence = [];
          if (!this.dataForm.annex) this.dataForm.annex = [];
          this.loading = false;
        } else {
          this.loading = false;
        }
      });
    },
    suggestionFormAreaChange(val) {
      if(val == '580548871316383493') return;
      this.suggestionForm.area = val;
      this.$forceUpdate();
    },
    judgmentClassChange(v) {
      this.suggestionForm.judgmentOpinions = '';
      this.showSuggsetion = Boolean(v == "590769458901943557" || v == "590769521820697861"); // 进一步处置，不采纳
      this.showarea = Boolean(v == "590769199001896197" || v == "590769458901943557"); // 执法，进一步处置
    },
    dataFormSubmit() {
      this.$refs["suggestionForm"].validate(async (valid) => {
        if (valid) {
          let obj = {
            ...this.suggestionForm,
            id: this.dataForm.id,
          };
          this.btnLoading = true;
          let res = await disposalSuggestions(obj);
          if(res.code != 200) return this.btnLoading = false;
          this.$message({
            message: res.msg,
            type: "success",
            duration: 1000,
            onClose: () => {
              (this.visible = false), this.$emit("refresh", true);
            },
          });
        }
      });
    },
  },
};
</script>
<style lang="scss" scoped>
.form_title {
  line-height: 30px;
  padding-left: 40px;
  color: #409eff;
}
</style>