Merge branch 'feature_1.0'

quanyawei

2024-09-06 60e16bd5406c4cbdf61bf20a50e8e1b49a45b2aa

 src/views/list/Unit.vue

@@ -5,7 +5,7 @@
        <a-form-item label="名称:">
          <a-input v-model="serch.name" style="width: 200px" />
        </a-form-item>
        <a-form-item label="上级区域:">
        <!-- <a-form-item label="上级区域:">
          <a-cascader
            placeholder="请选择"
            labelInValue
@@ -14,9 +14,19 @@
            :options="parentListOptions"
            @change="positionLevel"
          />
        </a-form-item>
        </a-form-item> -->

        <a-form-item label="所属区域:">
          <a-select
          <a-cascader
            placeholder="请选择"
            v-model="serch.areaCode"
            labelInValue
            multiple
            style="width: 200px"
            :options="parentListOptions"
            @change="belongToRegion"
          />
          <!-- <a-select
            ref="select"
            v-model="serch.areaCode"
            style="width: 200px"
@@ -29,7 +39,7 @@
            >
              {{ item.areaName }}
            </a-select-option>
          </a-select>
          </a-select> -->
        </a-form-item>
        <a-form-item>
          <a-button type="primary" html-type="submit" @click="handleSearch">
@@ -80,6 +90,7 @@
          <a-cascader
            v-model="editForm.parentCode"
            placeholder="请选择"
            change-on-select
            :options="newParentListOptions"
            @change="positionLevel"
            :disabled="pageState === 'view'"
@@ -158,383 +169,417 @@
</template>

<script lang="tsx">
import {
    Component,
    Prop,
    Vue,
    Model,
    Watch,
} from 'vue-property-decorator';
import moment from 'moment';
import { Component, Prop, Vue, Model, Watch } from "vue-property-decorator";
import moment from "moment";
import { get, post } from "@/util/request";
import * as _ from 'lodash';
import * as _ from "lodash";
@Component({
  components: {
  },
  components: {},
})
export default class QueryList extends Vue {
 //规则定义
  //规则定义
  private rules: any = {
    unitName:[
      { required: true, message: '名称不能为空', trigger: 'blur' },
      { message: '名称字数不能超过20个！', max: 19 },
    unitName: [
      { required: true, message: "名称不能为空", trigger: "blur" },
      { message: "名称字数不能超过20个！", max: 19 },
    ],
    parentCode:[{ required: true, message: '请选择！' }],
    areaCode:[{ required: true, message: '请选择！' }],
    state:[{ required: true, message: '请选择！' }]
  }
    private formLayout = {
      labelCol: {
        span: 5,
      },
      wrapperCol: {
        span: 15,
      },
    };
    private serch:any = {
        name:'',
        parentCode: [],
        areaCode:''
    }
    private editForm: any = {
        unitName:'',
        parentCode: [],
        areaCode:'',
        state:Number,
    }

  private pagination:any={
    total:0,
    current:1,
    pageSize:5,
    showSizeChanger: false,
    showQuickJumper: false,
    parentCode: [{ required: true, message: "请选择！" }],
    areaCode: [{ required: true, message: "请选择！" }],
    state: [{ required: true, message: "请选择！" }],
  };
  private formLayout = {
    labelCol: {
      span: 5,
    },
    wrapperCol: {
      span: 15,
    },
  };
  private serch: any = {
    name: "",
    parentCode: [],
    areaCode: "",
  };
  private editForm: any = {
    unitName: "",
    parentCode: [],
    areaCode: "",
    state: "0",
  };

    @Watch('serch.name')
    private watchsearchInform(newVal:string,oldval:string){
      if (newVal !== '' && oldval === '') {
        this.pagination.current = 1
      }
        this.handleSearch()
  private pagination: any = {
    total: 0,
    current: 1,
    pageSize: 10,
    showSizeChanger: true,
    showQuickJumper: true,
    pageSizeOptions: ["10", "30", "60", "100"],
    showTotal: (total: number) => `共有 ${this.pagination.total} 条数据`, //分页中显示总的数据
  };

  @Watch("serch.name")
  private watchsearchInform(newVal: string, oldval: string) {
    if (newVal !== "" && oldval === "") {
      this.pagination.current = 1;
    }
    this.handleSearch();
  }

    private expandForm: boolean = false;
  private expandForm: boolean = false;

    private selectedRows: any[] = [];
    
    private parentListOptions: any[] = [];
    private newParentListOptions: any[] = [];
  private selectedRows: any[] = [];

    private tableLoading: boolean = false;
    private visibleInvalidityModal: boolean = false;
  private parentListOptions: any[] = [];
  private newParentListOptions: any[] = [];

    private moment: any = moment;
    private pageState: String = 'add';
  private tableLoading: boolean = false;
  private visibleInvalidityModal: boolean = false;

    private dataSource: any[] = [];
    
    private areaCodeList: any[] = [];
    
    private newAreaCodeList: any[] = [];
  private moment: any = moment;
  private pageState: String = "add";

    private visibleCreateModal: boolean = false;
  private dataSource: any[] = [];

  private areaCodeList: any[] = [];

  private newAreaCodeList: any[] = [];

  private visibleCreateModal: boolean = false;

  private createForm: any = null;
    
    private title: any = null;

    private columns: any[] = [{
            title: '名称',
            dataIndex: 'unitName',
        },
        {
            title: '上级区域',
            dataIndex: 'parentName',
        },
        {
            title: '所属区域',
            dataIndex: 'areaName',
        },
        {
            title: '操作时间',
            dataIndex: 'updateTime',
        },
        {
            title: '操作人',
            dataIndex: 'createName',
        },
        {
            title: '状态',
            dataIndex: 'state',
            customRender: this.progressStateRender,
        },
        {
            title: '操作',
            customRender: this.opRender,
        },
    ];
  private title: any = null;

  private columns: any[] = [
    {
      title: "序号",
      dataIndex: "key",
      key: "key",
      align: "center",
      customRender: (text, record, index) => `${index + 1}`,
      width: 60,
    },
    {
      title: "名称",
      align: "center",
      dataIndex: "unitName",
    },
    {
      title: "上级区域",
      align: "center",
      dataIndex: "parentName",
    },
    {
      title: "所属区域",
      align: "center",
      dataIndex: "areaName",
    },
    {
      title: "操作时间",
      dataIndex: "updateTime",
    },
    {
      title: "操作人",
      align: "center",
      dataIndex: "createName",
    },
    {
      title: "状态",
      dataIndex: "state",
      align: "center",
      customRender: this.progressStateRender,
    },
    {
      title: "是否作废",
      dataIndex: "isInvalid",
      align: "center",
      customRender: this.progressIsInvalidRender,
    },
    {
      title: "操作",
      align: "center",
      customRender: this.opRender,
    },
  ];

    private handleModalVisible(isVisible: boolean): void {
      this.visibleCreateModal = isVisible;
      this.pageState='add'
      this.title='新建责任单位'
    }
  private handleModalVisible(isVisible: boolean): void {
    this.visibleCreateModal = isVisible;
    this.pageState = "add";
    this.title = "新建责任单位";
  }

  private handleSearch(): void {
    console.log(this.serch)
       const data = this.serch.parentCode
        let code =data[data.length-1]
        get("unit/selectUint",{
            name:this.serch.name,
            parentCode:code,
            parentCodeList:this.serch.parentCode,
            areaCode:this.serch.areaCode,
            current: this.pagination.current,
            page:1,
            size: 20
        }).then(res=>{
          this.dataSource =res.data.data.item
        })
        .catch(err=>{
            console.log(err);
        })
    }
    console.log(this.serch);
    const data = this.serch.areaCode;
    let code = data[data.length - 2];

    private handlerTableChange(pagination: any, filter: any, sorter: any): void {
      this.pagination.current = pagination.current
      this.pagination.total = pagination.total
      this.handleSearch()
    }
    get("unit/selectUint", {
      name: this.serch.name,
      unitId: data[data.length - 1],
      page: this.pagination.current,
      size: this.pagination.pageSize,
    })
      .then((res) => {
        this.dataSource = res.data.data.item;
        this.pagination.total = res.data.data.total;
      })
      .catch((err) => {
        console.log(err);
      });
  }
  belongToRegion(val: any) {
    console.log("123", val);
    console.log("123", this.serch.parentCode);
  }
  private handlerTableChange(pagination: any, filter: any, sorter: any): void {
    console.log("pagination", pagination);
    this.pagination.current = pagination.current;
    this.pagination.pageSize = pagination.pageSize;
    this.pagination.total = pagination.total;
    this.handleSearch();
  }

  private handleCreateModalOk() {
    let api ='unit/insert'
    if (this.pageState === 'edit') {
      api='unit/update'
    let api = "unit/insert";
    if (this.pageState === "edit") {
      api = "unit/update";
    }
    this.$refs.ruleForm.validate((valid: any) => {
      console.log(valid);
      if (valid) {
        const data = this.editForm.parentCode
        let code =data[data.length-1]
        const data = this.editForm.parentCode;
        let code = data[data.length - 1];
        console.log(this.editForm);
        // 插入角色
        post(api, {
            unitId: this.editForm.unitId,
            unitName:this.editForm.unitName,
            parentCode: code,
            parentCodeList:this.editForm.parentCode,
            areaCode: this.editForm.areaCode,
            state:this.editForm.state
        }).then((res: any) => {
           this.handleSearch()
          this.visibleCreateModal = false
          this.editForm = {
            unitName:'',
            parentCode: [],
            areaCode:'',
            state: Number,
            parentCodeList:[]
          }
        }).catch((err)=>{
            console.log(err);
          unitId: this.editForm.unitId,
          unitName: this.editForm.unitName,
          parentCode: code,
          parentCodeList: this.editForm.parentCode,
          areaCode: this.editForm.areaCode,
          state: parseInt(this.editForm.state),
        })
          .then((res: any) => {
            this.handleSearch();
            this.visibleCreateModal = false;
            this.editForm = {
              unitName: "",
              parentCode: [],
              areaCode: "",
              state: "0",
              parentCodeList: [],
            };
          })
          .catch((err) => {
            console.log(err);
          });
      } else {
        console.log('error submit!!');
        console.log("error submit!!");
        return false;
      }
    });

      console.log('editForm',this.editForm)
    }
    console.log("editForm", this.editForm);
  }

    private handleCreateModalCancel(): any {
        this.visibleCreateModal = false;
    }
    private handleInvalidityModalCancel(): any {
        this.visibleInvalidityModal = false;
    }
  private handleCreateModalCancel(): any {
    this.visibleCreateModal = false;
    this.editForm = {
      unitName: "",
      parentCode: [],
      areaCode: "",
      state: "0",
      parentCodeList: [],
    };
  }
  private handleInvalidityModalCancel(): any {
    this.editForm = {
      unitName: "",
      parentCode: [],
      areaCode: "",
      state: "0",
      parentCodeList: [],
    };
    this.visibleInvalidityModal = false;
  }

    private cityData() {
        get("system/area/queryCity",{
          
        }).then(res => {
          console.log('00000000000000', res);
          let org = res.data.data;
          let lists = JSON.stringify(org);
  private cityData() {
    get("system/area/queryCity", {})
      .then((res) => {
        console.log("00000000000000", res);
        let org = res.data.data;
        let lists = JSON.stringify(org);

          lists = lists.replace(/"areaCode"/g, '"value"');
        lists = lists.replace(/"areaCode"/g, '"value"');

          lists = lists.replace(/"areaName"/g, '"label"');
        lists = lists.replace(/"areaName"/g, '"label"');

          const treeLists = JSON.parse(lists)
          this.parentListOptions = JSON.parse(JSON.stringify(treeLists))
          this.newParentListOptions = JSON.parse(JSON.stringify(treeLists))
        })
        .catch(err=>{
            console.log(err);
        })
    }
        const treeLists = JSON.parse(lists);
        this.newParentListOptions = JSON.parse(JSON.stringify(treeLists));
      })
      .catch((err) => {
        console.log(err);
      });
  }
  queryUnit() {
    get("/unit/query", {})
      .then((res) => {
        console.log("00000000000000", res);
        let org = res.data.data;
        let lists = JSON.stringify(org);

        lists = lists.replace(/"unitId"/g, '"value"');

        lists = lists.replace(/"unitName"/g, '"label"');

        const treeLists = JSON.parse(lists);
        this.parentListOptions = JSON.parse(JSON.stringify(treeLists));
      })
      .catch((err) => {
        console.log(err);
      });
  }
  private positionLevel(val: any) {
    this.serch.areaCode = ''
    this.editForm.areaCode = ''
     let code =val[val.length-1]
        get("system/area/code",{
          code:code
        }).then(res => {
          console.log('00000000000000', res);
          this.areaCodeList= res.data.data;
          this.newAreaCodeList= res.data.data;
        })
        .catch(err=>{
            console.log(err);
        })
    }
    this.serch.areaCode = "";
    this.editForm.areaCode = "";
    let code = val[val.length - 1];
    get("system/area/code", {
      code: code,
    })
      .then((res) => {
        console.log("00000000000000", res);
        this.areaCodeList = res.data.data;
        this.newAreaCodeList = res.data.data;
      })
      .catch((err) => {
        console.log(err);
      });
  }

    private mounted() {
  private mounted() {
    this.handleSearch();
    this.cityData();
    this.queryUnit();
  }

  private updatedAtRender(text: string) {
    return <span> {moment(text).format("YYYY-MM-DD HH:mm:ss")} </span>;
  }

  private handleAssert(record: any) {
    get("unit/state", {
      unitId: record.unitId,
    })
      .then((res) => {
        this.handleSearch();
        this.cityData()
    }
        this.$message.success("操作成功");
      })
      .catch((err) => {
        console.log(err);
      });
  }
  private recordTableData: any = null;
  private handleInvalidity(record: any) {
    this.visibleInvalidityModal = true;
    this.recordTableData = record;
  }

    private updatedAtRender(text: string) {
        return <span> {
            moment(text).format('YYYY-MM-DD HH:mm:ss')
        } </span>;
    }

    private handleAssert(record: any){
       get("unit/state",{
         unitId: record.unitId,
          
       }).then(res => {
           this.handleSearch()
           this.$message.success('操作成功')
        })
        .catch(err=>{
            console.log(err);
        })
    }
    private recordTableData: any = null;
    private handleInvalidity(record: any) {
      this.visibleInvalidityModal = true
       this.recordTableData=record
    }
  
  private handleInvalidityModalOk(record: any) {
       this.createForm.validateFields((err: any, fieldsValue: any) => {
            if (err) {
                return;
            }
            get("unit/invalid",{
              unitId: this.recordTableData.unitId,
              invalidReason:this.createForm.getFieldValue('code')
            }).then(res => { 
              this.$message.success('操作成功')
              this.visibleInvalidityModal = false
              this.handleSearch()
            })
            .catch(err=>{
                console.log(err);
            })
    this.createForm.validateFields((err: any, fieldsValue: any) => {
      if (err) {
        return;
      }
      get("unit/invalid", {
        unitId: this.recordTableData.unitId,
        invalidReason: this.createForm.getFieldValue("code"),
      })
        .then((res) => {
          this.$message.success("操作成功");
          this.visibleInvalidityModal = false;
          this.handleSearch();
        })
        .catch((err) => {
          console.log(err);
        });
    });
  }
    
    private progressStateRender(text: string) {
        if (text === '0') {
            return <a-badge status = 'success' text = '生效' />;
        }
        return <a-badge status = 'processing' text = '未生效' />;

  private progressIsInvalidRender(text: Number) {
    if (text === 0) {
      return <a-badge status="success" text="未作废" />;
    }
    return <a-badge status="error" text="已作废" />;
  }
    
    private handleUpdateModalVisible(visible: boolean, record: any): void {
      this.visibleCreateModal = true;
      this.positionLevel(record.parentCodeList)
      this.title = '编辑责任单位'
      let params = _.cloneDeep(record)
      console.log(params)
      params.parentCode=record.parentCodeList
      this.editForm = params 
      this.pageState='edit'
      console.log('editForm',record)

  private progressStateRender(text: string) {
    if (text === "0") {
      return <a-badge status="success" text="生效" />;
    }
    private handleDetailModalVisible(visible: boolean, record: any): void {
      this.visibleCreateModal = true;
      this.title = '责任单位详情'
      this.editForm = record 
      this.pageState='view'
    }
    return <a-badge status="processing" text="未生效" />;
  }
  private async handleUpdateModalVisible(visible: boolean, record: any): void {
    this.visibleCreateModal = true;
    await this.positionLevel(record.parentCodeList);
    this.title = "编辑责任单位";
    let params = _.cloneDeep(record);
    console.log(params);
    params.parentCode = record.parentCodeList;
    this.editForm = params;
    this.pageState = "edit";
    console.log("editForm", record);
  }
  private async handleDetailModalVisible(visible: boolean, record: any): void {
    this.visibleCreateModal = true;
    await this.positionLevel(record.parentCodeList);
    this.title = "责任单位详情";
    let params = _.cloneDeep(record);
    console.log(params);
    params.parentCode = record.parentCodeList;
    this.editForm = params;
    this.pageState = "view";
  }
  private opRender(text: string, record: any, index: number) {
    // 生效console
    console.log('1111',text)
    console.log('2222',record)
    console.log('333', index)
      if (record.state==='1') { 
        if (record.isInvalid ===0) {
       return   <div>
            <a onClick = {
                () => this.handleUpdateModalVisible(true, record)
            } > 编辑 </a>
          <a-divider type='vertical' />
              <a onClick = {
                () => this.handleDetailModalVisible(true, record)
            } > 详情 </a>
            <a-divider type = 'vertical'  / >
            <a v-show="record.state !=='1'" onClick={ () => this.handleAssert(record)
              } >生效</a>
            <a-divider type = 'vertical' />
            <a v-show="record.isInvalid !=='0'" onClick = {
                () => this.handleInvalidity(record)
            } >作废</a>
            </div>
        } else {
           return   <div>
            <a onClick = {
                () => this.handleUpdateModalVisible(true, record)
            } > 编辑 </a>
          <a-divider type='vertical' />
              <a onClick = {
                () => this.handleDetailModalVisible(true, record)
            } > 详情 </a>
            <a-divider type = 'vertical'  / >
            <a v-show="record.state !=='1'" onClick={ () => this.handleAssert(record)
              } >生效</a>
           
            </div>
        }
    console.log("record", record);
    if (record.state === "0") {
      if (Number(record.isInvalid) === 0) {
        return (
          <div>
            <a onClick={() => this.handleDetailModalVisible(true, record)}>
              {" "}
              详情{" "}
            </a>
            <a-divider type="vertical" />
            <a onClick={() => this.handleInvalidity(record)}>作废</a>
          </div>
        );
      } else {
          if (record.isInvalid ===0) {
       return   <div>
            <a onClick = {
                () => this.handleUpdateModalVisible(true, record)
            } > 编辑 </a>
          <a-divider type='vertical' />
              <a onClick = {
                () => this.handleDetailModalVisible(true, record)
            } > 详情 </a>
            <a-divider type = 'vertical' />
            <a v-show="record.isInvalid !=='0'" onClick = {
                () => this.handleInvalidity(record)
            } >作废</a>
            </div>
        } else {
           return   <div>
            <a onClick = {
                () => this.handleUpdateModalVisible(true, record)
            } > 编辑 </a>
          <a-divider type='vertical' />
              <a onClick = {
                () => this.handleDetailModalVisible(true, record)
            } > 详情 </a>
            </div>
        }
        return (
          <div>
            <a onClick={() => this.handleDetailModalVisible(true, record)}>
              {" "}
              详情{" "}
            </a>
          </div>
        );
      }
    } else {
      return (
        <div>
          <a onClick={() => this.handleDetailModalVisible(true, record)}>
            {" "}
            详情{" "}
          </a>
          <a-divider type="vertical" />
          <a onClick={() => this.handleUpdateModalVisible(true, record)}>
            {" "}
            编辑{" "}
          </a>
        </div>
      );
    }
      this.handleSearch();
    }

  }
}
</script>

<style lang="less" scoped>
</style>
<style lang="less" scoped></style>