admin_home/src/views/complaint/complaintList.vue

<template>
  <div class="mainBox">
    <!--搜索功能 start------------------------------------------------------------>
    <div class="layerBox_search">
      <div class="layerBoxLine">
        <el-row>
          <el-col :span="8">
            <div class="searchBox">
              <div class="searchTitle">类型：</div>
              <el-select v-model="getApiData.nature" placeholder="请选择.." @change="getNatureChildren">
                <el-option
                  v-for="item in natureData"
                  :key="item.id"
                  :label="item.label"
                  :value="item.value">
                </el-option>
              </el-select>
            </div>
          </el-col>
          <el-col :span="8">
            <div class="searchBox">
              <div class="searchTitle">状态：</div>
              <el-select v-model="getApiData.status" placeholder="请选择..">
                <el-option
                  v-for="item in statusData"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
                </el-option>
              </el-select>
            </div>
          </el-col>
        </el-row>
      </div>
    </div>
    <div class="layerBoxNoBg">
      <div></div>
      <div>
        <el-button @click="clearSearchList">重置</el-button>
        <el-button type="primary" style="margin-right:20px" @click="getData()">搜索</el-button>
      </div>
    </div>
    <!--搜索功能 end------------------------------------------------------------>

    <!--表格内容 start------------------------------------------------------------>
    <div class="layerBox">
      <tableTitle :name="tableDivTitle"/>
      <el-row>
        <template>
          <el-table :data="tableData" style="width: 100%">
            <el-table-column fixed prop="id" label="编号" width="50"></el-table-column>
            <el-table-column prop="title" label="标题"></el-table-column>
            <el-table-column prop="nature_name" label="类型"></el-table-column>
            <!-- <el-table-column prop="nature_level_name" label="进度"></el-table-column>
            <el-table-column prop="type_name" label="类型"></el-table-column>
            <el-table-column prop="type_level_name" label="类型说明"></el-table-column> -->
            <el-table-column label="判决书">
              <template slot-scope="scope">
                {{ scope.row.judgment ? '有' : '无' }}
              </template>
            </el-table-column>
            <el-table-column label="录音录像">
              <template slot-scope="scope">
                {{ scope.row.audio_and_video ? '有' : '无' }}
              </template>
            </el-table-column>
            <el-table-column label="合同">
              <template slot-scope="scope">
                {{ scope.row.contract ? '有' : '无' }}
              </template>
            </el-table-column>
            <el-table-column label="资质">
              <template slot-scope="scope">
                {{ scope.row.qualifications ? '有' : '无' }}
              </template>
            </el-table-column>
            <!-- <el-table-column prop="judgment" label="判决书"></el-table-column>
            <el-table-column prop="audio_and_video" label="录音录像"></el-table-column>
            <el-table-column prop="contract" label="合同"></el-table-column>
            <el-table-column prop="qualifications" label="资质"></el-table-column> -->
            <el-table-column prop="money" label="涉案标的额"></el-table-column>
            <el-table-column prop="name" label="姓名"></el-table-column>
            <el-table-column prop="mobile" label="电话"></el-table-column>
            <el-table-column prop="status_name" label="状态"></el-table-column>
            <el-table-column prop="created_at" label="创建时间"></el-table-column>
            <el-table-column fixed="right" label="操作" width="120" header-align="center">
              <template slot-scope="scope">
                <div class="listBtnBox">
                  <div class="listEditBtn" @click="editRow(scope.row)"><i class="el-icon-edit-outline"></i>编辑</div>
                </div>
              </template>
            </el-table-column>
          </el-table>
        </template>
      </el-row>
    </div>

    <!--分页 start------------------------------------------------------------>
    <div class="alignBox">
      <el-row>
        <el-col :span="24">
          <el-pagination :current-page="getApiData.page" @size-change="handleSizeChange" @current-change="handleCurrentChange" :page-size="10" layout="total, prev, pager, next, jumper" :total="allCount"></el-pagination>
        </el-col>
      </el-row>
    </div>
    <!--分页 end------------------------------------------------------------>
    <!--表格内容 end------------------------------------------------------------>

    <!--弹出框start------------------------------------------------------------>
    <el-dialog title="编辑投诉" :visible.sync="windowStatus" :close-on-click-modal="false">
      <el-form :model="form" ref="form" :rules="formRules" autocomplete="off" label-position="left">
        <div class="formDiv">
          <el-form-item label="标题：" :label-width="formLabelWidth" prop="" class="custom-align-right">
            <el-input v-model="form.title" autocomplete="off" disabled></el-input>
          </el-form-item>
          <el-form-item label="类型：" :label-width="formLabelWidth" prop="" class="custom-align-right">
            <template>
              <div class="natureRadioBox">
                <div>
                  <el-radio-group v-model="form.nature">
                    <el-radio :label="item.id" v-for="item in windowNatureData" :key="item.id" @change="clearCheck">{{item.type_name}}</el-radio>
                  </el-radio-group>
                </div>
                <!--民事-->
                <div v-if="form.nature==1" class="natureRadioBoxItem">
                  <el-radio-group v-model="form.nature_level0">
                    <el-radio :label="item.id" v-for="item in windowNatureData[0].children[0].children" :key="item.id">{{item.type_name}}</el-radio>
                  </el-radio-group>
                </div>
                <div v-if="form.nature==1" class="natureRadioBoxItem">
                  <el-radio-group v-model="form.nature_level1">
                    <el-radio :label="item.id" v-for="item in windowNatureData[0].children[1].children" :key="item.id">{{item.type_name}}</el-radio>
                  </el-radio-group>
                </div>
                <div class="natureRadioBoxItemOther" v-if="form.nature==1&&form.nature_level1==24">
                  <el-input v-model="form.other" placeholder="请输入"></el-input>
                </div>
                <!--刑事-->
                <div v-if="form.nature==5" class="natureRadioBoxItem">
                  <el-radio-group v-model="form.nature_level0">
                    <el-radio :label="item.id" v-for="item in windowNatureData[1].children[0].children" :key="item.id">{{item.type_name}}</el-radio>
                  </el-radio-group>
                </div>
                <div v-if="form.nature==5" class="natureRadioBoxItem">
                  <el-radio-group v-model="form.nature_level1">
                    <el-radio :label="item.id" v-for="item in windowNatureData[1].children[1].children" :key="item.id">{{item.type_name}}</el-radio>
                  </el-radio-group>
                </div>
                <div class="natureRadioBoxItemOther" v-if="form.nature==5&&form.nature_level1==29">
                  <el-input v-model="form.other" placeholder="请输入"></el-input>
                </div>
                <div v-if="form.nature_level0==14&&form.nature==5" class="natureRadioBoxItem">
                  <el-radio-group v-model="form.nature_level3">
                    <el-radio :label="item.id" v-for="item in windowNatureData[1].children[0].children[2].children" :key="item.id">{{item.type_name}}</el-radio>
                  </el-radio-group>
                </div>
                <!--行政-->
                <div v-if="form.nature==104" class="natureRadioBoxItem">
                  <el-radio-group v-model="form.nature_level0">
                    <el-radio :label="item.id" v-for="item in windowNatureData[2].children[0].children" :key="item.id">{{item.type_name}}</el-radio>
                  </el-radio-group>
                </div>
                <div class="natureRadioBoxItemOther" v-if="form.nature==15&&form.nature_level0==122">
                  <el-input v-model="form.other" placeholder="请输入"></el-input>
                </div>
                <!--非讼-->
                <div v-if="form.nature==15" class="natureRadioBoxItem">
                  <el-radio-group v-model="form.nature_level0">
                    <el-radio :label="item.id" v-for="item in windowNatureData[3].children[0].children" :key="item.id">{{item.type_name}}</el-radio>
                  </el-radio-group>
                </div>
                <div class="natureRadioBoxItemOther" v-if="form.nature==104&&form.nature_level0==36">
                  <el-input v-model="form.other" placeholder="请输入"></el-input>
                </div>
              </div>
            </template>
          </el-form-item>
          <el-form-item label="详细说明：" :label-width="formLabelWidth" prop="" class="custom-align-right">
            <el-input type="textarea" v-model="form.describe" rows="8" class="custom-textarea" disabled placeholder="请输入详细说明"></el-input>
          </el-form-item>
          <el-form-item label="判决书：" :label-width="formLabelWidth" prop="" class="custom-align-right">
            <div v-if="form.judgment" @click="downloadFile(form.judgment,'判决书')" class="complaintListdownloadBtn">
              <i class="el-icon-download"></i>
              下载
            </div>
            <div v-else>暂无数据</div>
          </el-form-item>
          <el-form-item label="录音录像：" :label-width="formLabelWidth" prop="" class="custom-align-right">
            <div v-if="form.audio_and_video" @click="downloadFile(form.audio_and_video,'录音录像')" class="complaintListdownloadBtn">
              <i class="el-icon-download"></i>
              下载
            </div>
            <div v-else>暂无数据</div>
          </el-form-item>
          <el-form-item label="合同：" :label-width="formLabelWidth" prop="" class="custom-align-right">
            <div v-if="form.contract" @click="downloadFile(form.contract,'合同')" class="complaintListdownloadBtn">
              <i class="el-icon-download"></i>
              下载
            </div>
            <div v-else>暂无数据</div>
          </el-form-item>
          <el-form-item label="资质：" :label-width="formLabelWidth" prop="" class="custom-align-right">
            <div v-if="form.qualifications" @click="downloadFile(form.qualifications,'资质')" class="complaintListdownloadBtn">
              <i class="el-icon-download"></i>
              下载
            </div>
            <div v-else>暂无数据</div>
          </el-form-item>
          <el-form-item label="涉案标的金额：" :label-width="formLabelWidth" prop="" class="custom-align-right">
            <el-input v-model="form.money" autocomplete="off" disabled placeholder="请输入涉案标的金额"></el-input>
          </el-form-item>
          <el-form-item label="姓名：" :label-width="formLabelWidth" prop="" class="custom-align-right">
            <el-input v-model="form.name" autocomplete="off" disabled placeholder="请输入姓名"></el-input>
          </el-form-item>
          <el-form-item label="电话：" :label-width="formLabelWidth" prop="" class="custom-align-right">
            <el-input v-model="form.mobile" autocomplete="off" disabled placeholder="请输入电话"></el-input>
          </el-form-item>
          <el-form-item label="身份证号：" :label-width="formLabelWidth" prop="id_card" class="custom-align-right">
            <el-input v-model="form.id_card" autocomplete="off" disabled placeholder="请输入身份证号"></el-input>
          </el-form-item>
          <el-form-item label="期待学习法律：" :label-width="formLabelWidth" prop="" class="custom-align-right">
            <el-input v-model="form.like_remark" autocomplete="off" disabled placeholder="请输入期待学习法律"></el-input>
          </el-form-item>
          <el-form-item label="状态：" :label-width="formLabelWidth" prop="status" class="custom-align-right">
            <el-radio-group v-model="form.status">
              <!-- <el-radio label="100">待审核</el-radio> -->
              <el-radio label="101">已接案</el-radio>
              <el-radio label="102">已拒绝</el-radio>
              <el-radio label="103">已完结</el-radio>
            </el-radio-group>
          </el-form-item>
          <el-form-item label="备注信息：" :label-width="formLabelWidth" prop="" class="custom-align-right">
            <el-input type="textarea" v-model="form.reason" class="custom-textarea" placeholder="请输入备注信息"></el-input>
          </el-form-item>
        </div>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <div>
          <el-button @click="closeWindow">取 消</el-button>
          <el-button type="primary" @click="editData">提交</el-button>
        </div>
      </div>
    </el-dialog>
    <!--弹出框2：外部表单弹出框 end------------------------------------------------------------>


  </div>
</template>

<script>
//引入公用样式
import '@/styles/global.less';
//表格标题
import tableTitle from './components/tableTitle';

export default {
  components: {
    tableTitle,//表格标题
  },
  data() {
    //0.全局操作 start ------------------------------------------------------------>
    //表单验证
    const validateEmpty = (rule,value,callback) => {
      if (value == 0 || value == null) {
        callback(new Error('状态不能为空！'))
      } else {
        callback()
      }
    }
    const validateArray = (rule,value,callback) => {
      if (value.length == 0) {
        callback(new Error('该项不能为空！'))
      } else {
        callback()
      }
    }
    const validateNull = (rule,value,callback) => {
      callback()
    }
    let self = this;
    //0.全局操作 end ------------------------------------------------------------>

    return {
      //1.列表和分页相关 start ------------------------------------------------------------>
      tableDivTitle:"投诉举报",
      tableData: [],//列表
      allCount:0,//总条数
      editId:0,//要修改的网站id
      getApiData:{
        is_admin:1,//是否为管理员
        nature:"",//性质
        nature_level:"",//性质进度
        type:"",//类型
        type_level:"",//类型进度
        status:"",//状态 
        page:1,//当前是第几页
        pageSize:10,//一共多少条
      },
      natureData:[],//所有性质
      netureLevelData:[],//所有进度
      typeData:[],//所有类型
      typeLevelData:[],//所有类型进度
      statusData:[],//所有状态 

      //暂存所有进度
      allNetureLevelData:[],//性质
      allTypeLevelData:[],//类型
      //分页相关 end ------------------------------------------------------------>

      //2.弹出框设置 start ------------------------------------------------------------>
      //是否显示弹出窗口
      windowStatus:false,
      formLabelWidth: '120px',
      //弹出框设置 end ------------------------------------------------------------>

      //3.搜索相关 start ------------------------------------------------------------>
      //搜索相关 end ------------------------------------------------------------>

      //3.弹出框中的表单设置 start ------------------------------------------------------------>
      //3.1 表单收集的数据
      form: {
        title:"",//标题
        //nature:"",//性质
        //nature_level:"",//进度
        //type:"",//类型
        //type_level:"",//类型进度
        describe:"",//详细说明
        judgment:"",//判决书
        audio_and_video:"",//录音录像
        contract:"",//合同
        qualifications:"",//资质
        money:"",//涉案标的额
        name:"",//姓名
        id_card:"",//身份证
        status:"100",//状态
        like_remark:"",//你最想了解的法律知识
        reason:"",//备注信息
        //编辑性质和数字
        nature:0,//性质
        nature_level0:0,//进度
        nature_level1:0,//性质
        nature_level3:0,//类型进度
        //编辑类型和进度文字
        nature_name:"",//类型
        nature_name0:"",//进度
        nature_name1:"",//性质
        nature_name3:"",//类型进度
        other:""
      },
      windowNatureData:[],//所有性质与进度
      // windowNetureLevelData:[],//所有进度
      // windowTypeData:[],//所有类型
      // windowTypeLevelData:[],//所有类型进度
      windowStatusData:[],//所有状态 
      //3.2表单验证规则
      formRules: {
        //性质不能为空
        nature:[{required:true,trigger:'blur',validator:validateEmpty}],
        //进度不能为空
        nature_level:[{required:true,trigger:'blur',validator:validateEmpty}],
        //类型不能为空
        type:[{required:true,trigger:'blur',validator:validateEmpty}],
        //类型进度不能为空
        type_level:[{required:true,trigger:'blur',validator:validateEmpty}],
        //状态不能为空
        status:[{required:true,trigger:'blur',validator:validateEmpty}],
        //身份证不能为空
        id_card:[{required:true,trigger:'blur',validator:validateNull}],
      },
      //弹出框中的表单设置 end ------------------------------------------------------------>
    }
  },
  methods: {
    //1.列表和分页相关 start ------------------------------------------------------------>
    //1.1 获取内容
    getData(){
      this.$store.dispatch('complaint/getComplaint',this.getApiData).then(res=> {
        console.log(res)
        let data = [];
        for(let item of res.data.rows){
          // item.judgment = item.judgment.length > 0 ? "有" : "没有";
          // item.audio_and_video = item.audio_and_video.length > 0 ? "有" : "没有";
          // item.contract = item.contract.length > 0 ? "有" : "没有";
          // item.qualifications = item.qualifications.length > 0 ? "有" : "没有";

          // 判断 item.status 的状态
          switch (item.status) {
            case 100:
              item.status = "";
              break;
            case 101:
              item.status = "已接案";
              break;
            case 102:
              item.status = "已拒绝";
              break;
            case 103:
              item.status = "已完结";
              break;
            default:
              item.status = "";
              break;
          }
        }
        this.tableData = res.data.rows;//放入数据
        this.allCount = res.data.count;//放入总条数
      })
    },
    //获取所有父级状态
    getStatus(){
      //获取性质和进度
      let getNature = {
        type:1
      }
      this.$store.dispatch('complaint/getLetterType',getNature).then(res=> {
        //格式化性质
        for(let item of res.data){
          let data = {
            value: item.id,
            label: item.type_name
          }
          //搜索栏
          this.natureData.push(data)
          //弹窗框
          //this.windowNatureData.push(data)
        }
        //暂存所有性质进度
        this.allNetureLevelData = res.data;
        //再窗口里面也存一份
        this.windowNatureData = res.data;
      })
      //获取类型和类型说明
      // let getType = {
      //   type:2
      // }
      // this.$store.dispatch('complaint/getLetterType',getType).then(res=> {
      //   for(let item of res.data){
      //     let data = {
      //       value: item.id,
      //       label: item.type_name
      //     }
      //     //搜索栏
      //     this.typeData.push(data)
      //     //弹窗框
      //     this.windowTypeData.push(data)
      //   }
      //   //暂存所有类型进度
      //   this.allTypeLevelData = res.data;
      // })
      //获取状态
      let getStatus = {
        type:10
      }
      this.$store.dispatch('complaint/getLetterType',getStatus).then(res=> {
        for(let item of res.data){
          let data = {
            value: item.id,
            label: item.type_name
          }
          //搜索栏  
          this.statusData.push(data)
          //弹窗框
          this.windowStatusData.push(data)
        }
      })
    },

    // 获取子进度 可优化 start---------------------------------------->
    //获取进度性质对应的子级状态
    getNatureChildren(val) {
      this.getApiData.nature_level = "";
      this.netureLevelData = [];
      console.log(val);
      // 从 allNetureLevelData 中找到 id 与 val 相同的对象
      const selectedItem = this.allNetureLevelData.find(item => item.id === val);
      console.log(selectedItem)
      for(let item of selectedItem.children){
        let data = {
          value: item.id,
          label: item.type_name
        }
        //搜索栏  
        //this.netureLevelData.push(data)
      }
    },
    // getTypeChildren(val) {
    //   this.getApiData.type_level = "";
    //   this.typeLevelData = [];
    //   console.log(val);
    //   const selectedItem = this.allTypeLevelData.find(item => item.id === val);
    //   console.log(selectedItem)
    //   for(let item of selectedItem.children){
    //     let data = {
    //       value: item.id,
    //       label: item.type_name
    //     }
    //     //搜索栏  
    //     this.typeLevelData.push(data)
    //   }
    // },

    //弹出框中的
    // getWindowNatureChildren(val) {
    //   this.form.nature_level = "";
    //   this.windowNetureLevelData = [];
    //   console.log(val);
    //   // 从 allNetureLevelData 中找到 id 与 val 相同的对象
    //   const selectedItem = this.allNetureLevelData.find(item => item.id === val);
    //   console.log(selectedItem)
    //   for(let item of selectedItem.children){
    //     let data = {
    //       value: item.id,
    //       label: item.type_name
    //     } 
    //     this.windowNetureLevelData.push(data)
    //   }
    // },
    // getWindowTypeChildren(val) {
    //   this.form.type_level = "";
    //   this.windowTypeLevelData = [];
    //   console.log(val);
    //   const selectedItem = this.allTypeLevelData.find(item => item.id === val);
    //   console.log(selectedItem)
    //   for(let item of selectedItem.children){
    //     let data = {
    //       value: item.id,
    //       label: item.type_name
    //     }
    //     //搜索栏  
    //     this.windowTypeLevelData.push(data)
    //   }
    // },
    //回显数据
    // returnWindowNatureChildren(val) {
    //   console.log(val);
    //   const selectedItem = this.allNetureLevelData.find(item => item.id === val);
    //   console.log(selectedItem)
    //   for(let item of selectedItem.children){
    //     let data = {
    //       value: item.id,
    //       label: item.type_name
    //     } 
    //     this.windowNetureLevelData.push(data)
    //   }
    // },
    // returnWindowTypeChildren(val) {
    //   this.form.type_level = "";
    //   this.windowTypeLevelData = [];
    //   console.log(val);
    //   const selectedItem = this.allTypeLevelData.find(item => item.id === val);
    //   console.log(selectedItem)
    //   for(let item of selectedItem.children){
    //     let data = {
    //       value: item.id,
    //       label: item.type_name
    //     }
    //     //搜索栏  
    //     this.windowTypeLevelData.push(data)
    //   }
    // },
    // 获取子进度 可优化 end---------------------------------------->

    //1.2 列表内容分页
    //直接跳转
    handleSizeChange(val) {
      this.getApiData.page = val;
      this.getData();
    },
    //1.3 点击分页
    handleCurrentChange(val) {
      this.getApiData.page = val;
      this.getData();
    },
    //1.4 重置按钮
    clearSearchList(){
      this.getApiData.is_admin = 1;
      this.getApiData.nature = "";
      this.getApiData.nature_level = "";
      this.netureLevelData = [];
      this.getApiData.type = "";
      this.getApiData.type_level = "";
      this.typeLevelData = [];
      this.getApiData.status = "";
      this.getApiData.page = 1;
      this.getApiData.pageSize = 10;
      this.getData();
    },
    //列表和分页相关 end ------------------------------------------------------------>

    //2.弹出框设置 start ------------------------------------------------------------>
    //2.1 打开弹出框
    openWindow() {
      //this.clearToServe();
      this.windowStatus = true;
    },
    //2.2 关闭弹出框
    closeWindow(){
      this.windowStatus = false;
      this.clearToServe();
    },
    //2.3 清空提交窗口
    clearToServe(){
      //重置窗口
      this.editId = "";
      this.form.title = "";
      this.form.nature = "";
      this.form.nature_level = "";
      this.form.type = "";
      this.form.type_level = "";
      this.form.describe = "";
      this.form.judgment = "";
      this.form.audio_and_video = "";
      this.form.contract = "";
      this.form.qualifications = "";
      this.form.money = "";
      this.form.name = "";
      this.form.id_card = "";
      this.form.like_remark = "";
      this.form.reason = "";
    },
    //弹出框设置 end ------------------------------------------------------------>


    //4.编辑 start ------------------------------------------------------------>
    downloadFile(data,name){  
      let files = [];
      let fileName = name;
      if (!Array.isArray(data)) {
        data = [data];
      }
      console.log(data)
      for(let item of data){
        if(item.imgUrl){
          files.push(item.imgUrl);
        }else{
          files.push(item)
        }
      }
      //console.log(files)
      let getData = {
        files:files,
        fileName:fileName
      }

      this.$store.dispatch('complaint/downloadFile',getData).then(res=> {
        // console.log(res)
        // window.open(res.data.fileUrl, '_blank');
        const link = document.createElement('a');
        link.href = res.data.fileUrl;
        link.setAttribute('download', 'downloaded_file'); // You can set a default file name here
        document.body.appendChild(link);
        link.click();
        document.body.removeChild(link);
      })

    },
    //回显数据
    editRow(data){
      //先判断这条数据是否已经被其他人受理
      this.$store.dispatch('complaint/checkMeasure',{id:data.id}).then(res=> {
        if(res.code == 200){
          //列表里面已经有了，就不需要再请求了
          //开始回显数据
          this.openWindow();
          console.log(data)
          this.editId = data.id;
          this.form.title = data.title;

          //还原性质
          // this.form.nature = data.nature;
          // this.returnWindowNatureChildren(data.nature);
          // this.form.nature_level = data.nature_level;
          //还原类型
          // this.form.type = data.type;
          // this.returnWindowTypeChildren(data.type);
          // this.form.type_level = data.type_level;

          this.form.nature = data.nature;
          this.form.nature_level0 = data.nature_level0;
          this.form.nature_level1 = data.nature_level1;
          this.form.nature_level3 = data.nature_level3;
          //编辑类型和进度文字
          this.form.nature_name = data.nature_name;
          this.form.nature_name0 = data.nature_name0;
          this.form.nature_name1 = data.nature_name1;
          this.form.nature_name3 = data.nature_name3;
          this.form.other = data.other;

          //详细说明
          this.form.describe = data.describe;
          this.form.judgment = data.judgment;
          this.form.audio_and_video = data.audio_and_video;
          this.form.contract = data.contract;
          this.form.qualifications = data.qualifications;

          // if(data.judgment.length > 0){
          //   this.form.judgment = data.judgment[0].fileSrc;
          // }
          // if(data.audio_and_video.length > 0){
          //   this.form.audio_and_video = data.audio_and_video[0].fileSrc;
          // }
          // if(data.contract.length > 0){
          //   this.form.contract = data.contract[0].fileSrc;
          // }
          // if(data.qualifications.length > 0){
          //   this.form.qualifications = data.qualifications[0].fileSrc;
          // }
          this.form.money = data.money;
          this.form.id_card = data.id_card;
          this.form.like_remark = data.like_remark;
          this.form.reason = data.reason;
          switch (data.status) {
            case "待审核":
            this.form.status = "100";
              break;
            case "已接案":
            this.form.status = "101";
              break;
            case "已拒绝":
              this.form.status = "102";
              break;
            case "已完结":
              this.form.status = "103";
              break;
            default:
              this.form.status = "0"; // 可选：处理未定义的状态
              break;
          }
          console.log(this.form.status) //100
          this.form.name = data.name;
          this.form.mobile = data.mobile;
        }else{
          this.$message({
            type: 'warning',
            message: '该数据已经被其他人受理！'
          });
        }
      }).catch(() => {
        this.$message({
          type: 'warning',
          message: '网络错误，请重试！'
        });
      })

    },
    //清理单选状态
    clearCheck(){
      console.log("清理单选状态")
      this.form.nature_level1 = "";
      this.form.nature_level3 = "";
      this.form.nature_name = "";
      this.form.nature_name0 = "";
      this.form.nature_name1 = "";
      this.form.nature_name3 = "";
      this.form.other = "";
    },
    //提交编辑
    editData(){
      //判断什么时候需要需要提交other
      // if(this.form.nature_level1!=24||this.form.nature_level1!=29||this.form.nature_level0!=122||this.form.nature_level0!=36){
      //   this.form.other = "";
      // }


      let data = {
        id:this.editId,
        //提交编辑
        nature:this.form.nature,
        nature_level0:this.form.nature_level0,
        nature_level1:this.form.nature_level1,
        nature_level3:this.form.nature_level3,
        // nature_name:this.form.nature_name,
        // nature_name0:this.form.nature_name0,
        // nature_name1:this.form.nature_name1,
        // nature_name3:this.form.nature_name3,
        other:this.form.other,
        mobile:this.form.mobile,
        type:this.form.type,
        type_level:this.form.type_level,
        status:this.form.status,
        reason:this.form.reason,
        is_admin:1 //必须，否则无法修改
      }

      //console.log(data)
      this.$refs.form.validate(valid => {
        if (valid) {
          this.$store.dispatch('complaint/upComplaint',data).then(res=> {
            console.log(res)
            this.closeWindow();
            this.$message({
              type: 'success',
              message: '修改成功！'
            });
            this.getData();
          })
        }
      })
      
    }
    //编辑 end ------------------------------------------------------------>

  },
  mounted(){
    //获取页面列表
    this.getData();
    //查询状态
    this.getStatus();
  }
}
</script>

<style scoped lang="less">
  .natureRadioBox{
    .natureRadioBoxItem{
      border: 1px solid #dfe4ed;
      border-radius: 4px;
      padding: 10px 10px 0 10px;
      margin-bottom: 10px;
      background: #F5F7FA;
      label {
        margin-bottom: 10px;
      }
    }
    .natureRadioBoxItemOther{
      border: 1px solid #dfe4ed;
      border-radius: 4px;
      padding: 10px;
      margin-bottom: 10px;
      background: #F5F7FA;
    }
  }


  //表单微调 start------------------------------------------------------------>*/
  ::v-deep .natureRadioBoxItem .el-radio {
    margin-bottom: 10px !important;
  }
  ::v-deep .custom-form-item > .el-form-item__label {
    line-height: 140px !important;
  }
  ::v-deep .custom-textarea .el-textarea__inner {
    resize: none; /* 禁止用拖拽调整大小 */
  }
  ::v-deep .custom-align-right .el-form-item__label {
    text-align: right; /* 设置标签文字右对齐 */
  }
  ::v-deep .el-select-group__title {
    color: #909399;
  }
  ::v-deep .el-select {
    width: 100% !important;
  }
</style>