xiaoshi_system/src/views/report/InvalidResponse/components/dialog/addInvalidResponse.vue

<template>
  <div>
    <el-dialog  :title="title" :visible.sync="showDialog" width="600px" :close-on-click-modal="false"  :before-close="handleClose" append-to-body>
        <el-form :model="form" :rules="rules" ref="form" label-width="80px" label-position="left">
            <template v-if="type == 1">
                <div>
                    <el-form-item  label="无效理由" prop="name">
                        <el-select v-model="form.statutesId" placeholder="请选择" style="width:100%">
                            <el-option
                                v-for="item in provisions"
                                :key="item.value"
                                :label="item.label"
                                :value="item.value"
                            >
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item  label="权要" prop="name">
                        <el-select v-model="form.claimIds" multiple placeholder="请选择" style="width:100%">
                            <el-option
                                v-for="item in claims"
                                :key="item.sysOrder"
                                :label="`权要${Number(item.sysOrder)+1}`"
                                :value="item.sysOrder+''"
                            >
                            </el-option>
                        </el-select>
                    </el-form-item>
                </div>
            </template>
        </el-form>
        
        <span slot="footer" class="dialog-footer">
          <el-button @click="handleClose">取 消</el-button>
          <el-button type="primary" :loading="btnLoading" @click="submit" >确 定</el-button>
        </span>
    </el-dialog>
  </div>
</template>

<script>
export default {
  components: {},
  props: {
    projectId:{
        default:0
    }
  },
  data() {
    return {
        type:null,
        form:{},
        title:'',
        showDialog:false,
        claims:[],
        rules:{},
        btnLoading:false,
    };
  },
  watch: {},
  computed: {
    provisions(){
        return this.$store.state.dictMessage.dictMessage.STATUTE || []
    }
  },
  created() {},
  mounted() {
    this.getClaims()
  },
  methods: {
    //获取权要
    getClaims(){
        var params = {
            projectId:this.projectId
        }
        this.$api.queryClaim(params).then(response=>{
            if(response.code == 200){
                this.claims = response.data.data
            }
        }).catch(error=>{
            this.claims = []
        })
    },
    //打开弹窗
    open(type,title,data){
        this.type = type
        this.title = title
        this.form = data
        this.showDialog = true
    },
    //关闭弹窗
    handleClose(){
        this.showDialog = false
    },
    //提交
    submit(){
        this.btnLoading = true
        switch(this.type){
            case '1':
                this.addInvalidStatutes()
                break;
        }
    },
    //添加无效理由
    addInvalidStatutes(){
        this.form.projectId = this.projectId
        this.$api.addInvalidStatutes(this.form).then(response=>{
            if(response.code == 200){
                this.btnLoading = false
                this.handleClose()
                this.$emit('save',true)
            }
        }).catch(error=>{
            this.btnLoading = false
        })
    }
  },
};
</script>
<style lang="scss" scoped>
</style>