峰峰执法平台简易案件程序板块 pad端
yang
2022-10-31 cbec633fda4ecf0f77288f25067a8512915b565a
src/views/padSunmaryProcedure/padFrom.vue
@@ -1,115 +1,209 @@
<template>
<el-main style="width: 100%;margin: 0 auto">
  <el-form ref="form" :model="form" label-width="110px" size="medium">
  <el-main style="width: 100%;margin: 0 auto">
    <el-form ref="form" :rules="dataRules" :model="form" label-width="120px" size="medium">
      <el-form-item label="案由" prop="casePoint">
        <el-input v-model="form.casePoint" placeholder="请填写案由"></el-input>
      </el-form-item>
    <el-form-item label="案由">
      <el-input v-model="form.casePoint" placeholder="请填写案由"></el-input>
    </el-form-item>
      <el-row>
        <el-col :span="12">
          <el-form-item label="当事人姓名" prop="litigant">
            <el-select v-model="form.litigant" placeholder="请选择当事人"
                       style="width: 100%;" @change="marketChange">
              <el-option
                v-for="item in marketList"
                :key="item.subjectName"
                :label="item.subjectName"
                :value="item">
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="法人" prop="legalPerson">
            <el-input v-model="form.legalPerson" placeholder="请填写法人姓名"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
    <el-row>
      <el-col :span="12">
        <el-form-item label="当事人姓名">
          <el-select v-model="form.litigant" placeholder="请选择当事人"
                      style="width: 100%;" @change="marketChange">
            <el-option
              v-for="item in marketList"
              :key="item.subjectName"
              :label="item.subjectName"
              :value="item">
            </el-option>
          </el-select>
        </el-form-item>
      </el-col>
      <el-col :span="12">
        <el-form-item label="法人">
          <el-input v-model="form.legalPerson" placeholder="请填写法人姓名"></el-input>
        </el-form-item>
      </el-col>
    </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="证件号/信用码" prop="certNo">
            <el-input v-model="form.certNo" placeholder="请填写证件号/信用码"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="联系电话" prop="phone">
            <el-input v-model="form.phone" placeholder="请填写当事人电话"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
    <el-row>
      <el-col :span="12">
        <el-form-item label="证件号/信用码">
          <el-input v-model="form.certNo" placeholder="请填写证件号/信用码" ></el-input>
        </el-form-item>
      </el-col>
      <el-col :span="12">
        <el-form-item label="联系电话">
          <el-input v-model="form.phone" placeholder="请填写当事人电话"></el-input>
        </el-form-item>
      </el-col>
    </el-row>
      <el-form-item label="住址" prop="address">
        <el-input v-model="form.address" placeholder="请填写当事人住址"></el-input>
      </el-form-item>
    <el-form-item label="住址">
      <el-input v-model="form.address" placeholder="请填写当事人住址"></el-input>
    </el-form-item>
    <el-form-item label="办案人员" prop="hanlderIds">
      <el-select v-model="form.hanlderIds" clearable filterable multiple :multiple-limit="2"
                 placeholder="请选择" style="width: 100%;" @change="setPersonname($event)">
        <el-option
          v-for="item in organPersons"
          :key="item.userId"
          :label="item.realName"
          :value="item.userId">
          <span style="float: left">{{ item.realName }}</span>
          <span style="float: right; color: #8492a6; font-size: 13px">执法证号:{{ item.lawCert }}</span>
        </el-option>
      </el-select>
    </el-form-item>
    <el-form-item>
      <el-button type="primary" @click="onSubmit">立即创建</el-button>
      <el-button @click="backAll">取消</el-button>
    </el-form-item>
  </el-form>
</el-main>
      <el-form-item label="办案人员" prop="hanlderIds">
        <el-select v-model="form.hanlderIds" clearable filterable multiple :multiple-limit="2"
                   placeholder="请选择" style="width: 100%;" @change="setPersonname($event)">
          <el-option
            v-for="item in organPersons"
            :key="item.userId"
            :label="item.realName"
            :value="item.userId">
            <span style="float: left">{{ item.realName }}</span>
            <span style="float: right; color: #8492a6; font-size: 13px">执法证号:{{ item.lawCert }}</span>
          </el-option>
        </el-select>
      </el-form-item>
      <el-row>
        <el-col :span="12">
          <el-form-item label="所属城镇" prop="city">
            <el-select v-model="form.city" filterable placeholder="请选择所属城镇" style="width: 100%;">
              <el-option
                v-for="item in areaList"
                :label="item.label"
                :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="所属领域" prop="category">
            <el-select v-model="form.category" placeholder="请选择所属领域" style="width: 100%;">
              <el-option
                v-for="item in categoryList"
                :label="item.label"
                :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
      <el-form-item label="经纬度" style="display:none;">
        <el-input v-model="form.latitude" placeholder="请填写经纬度"></el-input>
      </el-form-item>
      <el-form-item label="违法地点" prop="place">
        <el-input v-model="form.place" placeholder="请填写违法地点"></el-input>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="onSubmit">立即创建</el-button>
        <el-button @click="backAll">取消</el-button>
      </el-form-item>
    </el-form>
  </el-main>
</template>
<script>
import {easycase,getMarketList,getIdByToken} from '../../api/News/pad'
import {easycase, getMarketList, getIdByToken} from '../../api/News/pad'
import {getfindAll} from "../../api/News/useres";
import {remote} from "@/api/admin/dict"
export default {
  name: "padFrom",
  data(){
    return{
      form:{
        casePoint:'',
        litigant:"",
        legalPerson:"",
        certNo:"",
        phone:"",
        address:"",
        hanlderIds:[],
  data() {
    var validatePerson = (rule, value, callback) => {
      if (value.length != 2) {
        callback(new Error('办案人员必须选择两位'));
      } else {
        callback();
      }
    };
    return {
      form: {
        casePoint: '',
        litigant: "",
        legalPerson: "",
        certNo: "",
        phone: "",
        address: "",
        hanlderIds: [],
        place: "",
        category: "",
        city: "",
        latitude:"",
      },
      //办案人员数据
      organPersons:[],
      organPersons: [],
      //当事人数据
      marketList:[],
      marketList: [],
      //所属领域
      categoryList: [],
      // 违法城镇
      areaList: [],
      // 填写验证
      dataRules: {
        casePoint: [
          {required: true, message: "案件文号不能为空", trigger: "blur"},
        ],
        litigant: [
          {required: true, message: "当事人姓名不能为空", trigger: "blur"},
        ],
        legalPerson: [
          {required: true, message: "法定代表人姓名不能为空", trigger: "blur"},
        ],
        certNo: [
          {required: true, message: "当事人证件号码不能为空", trigger: "blur"},
        ],
        address: [
          {required: true, message: "当事人住址不能为空", trigger: "blur"},
        ],
        phone: [
          {required: true, message: "手机号格式不正确", trigger: "blur"},
          {min: 11, message: "手机号格式不正确", trigger: "blur"},
        ],
        hanlderIds: [
          {required: true, message: "办案人员不能为空", trigger: "blur"},
          {validator: validatePerson, trigger: "blue"}
        ],
        category: [
          {required: true, message: "该案件的所属领域不能为空", trigger: ["blur", "change"]},
        ],
        city: [
          {required: true, message: "所属城镇不能为空", trigger: ["blur", "change"]},
        ],
        place: [
          {required: true, message: "违法地址不能为空", trigger: ["blur", "change"]}
        ]
      },
    }
  },
  created() {
    this.init()
  },
  methods:{
    init(){
  methods: {
    tiaoZhuan() {
      this.$router.push({
        path: '/padWord'
      })
    },
    init() {
      // this.$nextTick(()=>{
      getIdByToken().then(res =>{
        console.log(res,'getIdByToken')
      getIdByToken().then(res => {
        console.log(res, 'getIdByToken')
        let a = res.data.data;
        this.form.hanlderIds.push(a)
        let b = parseInt(a)
        this.form.hanlderIds.push(b)
      })
      //查询当事人
      getMarketList().then((res) => {
        this.marketList = res.data.data;
      })
        //查询办案人员信息
        getfindAll().then((res) => {
          this.organPersons = res.data.data;
        })
      //查询办案人员信息
      getfindAll().then((res) => {
        this.organPersons = res.data.data;
      })
      //所属领域
      remote('before_dept').then(res => {
        this.categoryList = res.data.data;
      })
      //所属城市
      remote('area_address').then(res => {
        this.areaList = res.data.data;
      })
      // })
    },
    marketChange(item){
    marketChange(item) {
      this.form.litigant = "";
      this.form.legalPerson = "";
      this.form.litigantCert = "";
@@ -138,7 +232,7 @@
        this.form.phone = item.phone;
      }
    },
    backAll(){
    backAll() {
      this.$router.push({
        path: '/pad',
      })
@@ -154,13 +248,13 @@
        this.form.hanlders = names.substring(0, names.length - 1);
      }
    },
    onSubmit(){
      console.log(this.form.hanlderIds,'this.form.hanlderIds')
      this.form.hanlderIds=this.form.hanlderIds.toString()
    onSubmit() {
      console.log(this.form.hanlderIds, 'this.form.hanlderIds')
      this.form.hanlderIds = this.form.hanlderIds.toString()
      if (this.form.hanlderIds.length < 1) {
        this.form.hanlders = '';
      }
      easycase(this.form).then(res =>{
      easycase(this.form).then(res => {
        this.backAll()
      })
    },