elizebeth/src/xt_pages/data/components/addProject.vue

<template>
    <el-dialog
        :title="formTitle"
        width="900px"
        :visible.sync="visible"
        :before-close="_close"
    >
        <el-tabs v-model="activeName">
            <el-tab-pane label="基础数据" name="first">
                <div>
                    <el-form :model="form" :rules="rules" ref="form" label-width="100px" style="display: flex;flex-wrap: wrap;justify-content: space-between;">
                        <el-form-item label="项目名称 : "  prop="project_name" style="width:100%" >
                            <el-input v-model="form.project_name" placeholder="" maxlength="30"></el-input>
                        </el-form-item>
                        <el-form-item label="拼音 : " prop="pinyin" style="width:100%">
                            <el-input v-model="form.pinyin" placeholder="" maxlength="30"></el-input>
                        </el-form-item>
                        <el-form-item label="五笔 : " prop="wubi" style="width:100%">
                            <el-input v-model="form.wubi" placeholder="" maxlength="30"></el-input>
                        </el-form-item>
                        <el-form-item label="价格(元) : " prop="price">
                            <el-input v-model="form.price" placeholder="" maxlength="30"></el-input>
                        </el-form-item>
                        <el-form-item label="单位 : " prop="unit">
                            <el-select v-model="form.unit" style="width:160px;" placeholder="请选择">
                              <el-option
                                v-for="(item,index) in getDataConfig('hemodialysis','units')"
                                :key="index"
                                :label="item.name"
                                :value="item.name">
                             </el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item label="费用类别 : " prop="cost_classify">
                            <el-select v-model="form.cost_classify" style="width:160px;" placeholder="请选择">
                                <el-option
                                v-for="(item,index) in getDictionaryDataConfig('system','cost_classify')"
                                :key="index"
                                :label="item.name"
                                :value="item.id">
                                </el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item label="执行科室 : " prop="executive_section">
                            <el-select v-model="form.executive_section" style="width:160px;" placeholder="请选择">
                                <el-option
                                v-for="(item,index) in departMentList"
                                :key="index"
                                :label="item.name"
                                :value="item.id">
                                </el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item label="医保等级 : " prop="medical_coverage">
                            <el-select v-model="form.medical_coverage" style="width:160px;" placeholder="请选择">
                               <el-option
                                 v-for="(item,index) in getDictionaryDataConfig('system','medical_insurance_level')"
                                 :key="index"
                                 :label="item.name"
                                 :value="item.id">
                               </el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item label="统计分类 : " prop="statistical_classification">
                            <el-select v-model="form.statistical_classification" style="width:160px;" placeholder="请选择">
                                <el-option
                                v-for="(item,index) in getDictionaryDataConfig('system','statistics_category')"
                                :key="index"
                                :label="item.name"
                                :value="item.id">
                                </el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item label="是否特病目录:" prop="disease_directory">
                            <el-select v-model="form.disease_directory" style="width:160px;" placeholder="请选择">
                                <el-option
                                v-for="item in options"
                                :key="item.value"
                                :label="item.label"
                                :value="item.value">
                                </el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item label="是否备案 : " prop="is_record">
                            <el-select v-model="form.is_record" style="width:160px;" placeholder="请选择">
                                <el-option
                                v-for="item in options"
                                :key="item.value"
                                :label="item.label"
                                :value="item.value">
                                </el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item label="国家编码 : " prop="medical_code">
                            <el-input v-model="form.medical_code" style="width:160px;" placeholder="" maxlength="30"></el-input>
                        </el-form-item>
                        <el-form-item label="试管颜色 : " prop="tube_color">
                            <el-select v-model="form.tube_color" style="width:160px;" placeholder="请选择">
                              <el-option
                                v-for="(item,index) in getDictionaryDataConfig('system','tube_color')"
                                :key="index"
                                :label="item.name"
                                :value="item.id">
                                </el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item label="单次用量 : " prop="medical_code">
                            <el-input v-model="form.single_dose" style="width:160px;" placeholder="" maxlength="30"></el-input>
                        </el-form-item>
                          <el-form-item label="用法 : " prop="medical_code">
                            <el-input v-model="form.delivery_way" style="width:160px;" placeholder="" maxlength="30"></el-input>
                        </el-form-item>
                          <el-form-item label="频率 : " prop="medical_code">
                            <el-input v-model="form.execution_frequency" style="width:160px;" placeholder="" maxlength="30"></el-input>
                        </el-form-item>
                          <el-form-item label="天数 : " prop="medical_code">
                            <el-input v-model="form.number_days" style="width:160px;" placeholder="" maxlength="30"></el-input>
                        </el-form-item>
                          <el-form-item label="总量 : " prop="medical_code">
                            <el-input v-model="form.total" style="width:160px;" placeholder="" maxlength="30"></el-input>
                        </el-form-item>
                        <el-form-item label="状态 : " prop="medical_status">
                            <el-radio-group v-model="form.medical_status">
                                <el-radio :label="1">停用</el-radio>
                                <el-radio :label="2">收费</el-radio>
                            </el-radio-group>
                        </el-form-item>
                        <el-form-item label="类别:" prop="">
                           <el-select v-model="form.category" style="width:160px;" placeholder="请选择">
                              <el-option
                                v-for="(item,index) in categoryList"
                                :key="index"
                                :label="item.name"
                                :value="item.id">
                                </el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item label="特检项目:" prop="">
                           <el-select v-model="form.specail_project" style="width:160px;" placeholder="请选择">
                              <el-option
                                v-for="(item,index) in specailProject"
                                :key="index"
                                :label="item.name"
                                :value="item.id">
                                </el-option>
                            </el-select>
                        </el-form-item>
                         <el-form-item label="社保目录编码" >
                            <el-input v-model="form.social_security_directory_code" style="width:180px"></el-input>
                         </el-form-item>

                        <el-form-item label="备案日期:" >
                            <el-date-picker
                                value-format="yyyy-MM-dd"
                                v-model="form.record_date"
                                type="date"
                                placeholder="选择日期时间">
                            </el-date-picker>
                        </el-form-item>
                        <el-form-item label="备注 : " prop="remark" style="width:100%;">
                            <el-input type="textarea" :rows="2" placeholder="请输入内容" v-model="form.remark"></el-input>
                        </el-form-item>
                    </el-form>
                </div>
            </el-tab-pane>
            <el-tab-pane label="扩展数据" name="second">
                <el-form :model="form"  label-width="120px" style="display: flex;flex-wrap: wrap;justify-content: space-between;">
                    <el-form-item label="标签 : " prop="sign">
                        <el-select v-model="form.sign" style="width:160px;" placeholder="请选择">
                            <el-option
                            v-for="(item,index) in getDictionaryDataConfig('system','sign')"
                            :key="index"
                            :label="item.name"
                            :value="item.id">
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="默认使用数量:" prop="default_number">
                        <el-input v-model="form.default_number" style="width:160px;" placeholder="" maxlength="30"></el-input>
                    </el-form-item>
                    <el-form-item label="是否默认:" prop="is_default">
                        <el-select v-model="form.is_default" style="width:160px;" placeholder="请选择">
                            <el-option
                            v-for="item in options"
                            :key="item.value"
                            :label="item.label"
                            :value="item.value">
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="是否收费常用项:" prop="is_charge">
                        <el-select v-model="form.is_charge" style="width:160px;" placeholder="请选择">
                            <el-option
                            v-for="item in options"
                            :key="item.value"
                            :label="item.label"
                            :value="item.value">
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="是否收费预估项:" prop="is_estimate">
                        <el-select v-model="form.is_estimate" style="width:160px;" placeholder="请选择">
                            <el-option
                            v-for="item in options"
                            :key="item.value"
                            :label="item.label"
                            :value="item.value">
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="是否统计工作量:" prop="is_workload">
                        <el-select v-model="form.is_workload" style="width:160px;" placeholder="请选择">
                            <el-option
                            v-for="item in options"
                            :key="item.value"
                            :label="item.label"
                            :value="item.value">
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="收费项目排序:" prop="sort">
                        <el-input v-model="form.sort" style="width:160px;" placeholder="" maxlength="30"></el-input>
                    </el-form-item>
                    <el-form-item label="是否常用医嘱:" prop="is_advice">
                        <el-select v-model="form.is_advice" style="width:160px;" placeholder="请选择">
                            <el-option
                            v-for="item in options"
                            :key="item.value"
                            :label="item.label"
                            :value="item.value">
                            </el-option>
                        </el-select>
                    </el-form-item>

                    <el-form-item label="是否打印显示:" prop="is_advice">
                        <el-select v-model="form.is_print" style="width:160px;" placeholder="请选择">
                            <el-option
                            v-for="item in printOptions"
                            :key="item.value"
                            :label="item.label"
                            :value="item.value">
                            </el-option>
                        </el-select>
                    </el-form-item>
                </el-form>
            </el-tab-pane>
        </el-tabs>
        <div slot="footer" class="dialog-footer">
            <el-button @click="hide">取 消</el-button>
            <el-button type="primary" @click="submitAction('form')">保 存</el-button>
        </div>
  </el-dialog>
</template>

<script>
import { getDictionaryDataConfig,getDataConfig } from "@/utils/data";
import { saveProject,getDePartmentList } from "@/api/project/project"
export default {
    data(){
        return{
            visible:false,
            formTitle:'',
            activeName:'first',
            options: [
             {value: 1,label: '是'},
             {value: 2,label: '否'}
             ],
             printOptions: [
             {value: 1,label: '是'},
             {value: 2,label: '否'}
             ],
            value: '',
            radio:'1',
            form:{
              project_name:"",
              pinyin:"",
              wubi:"",
              price:"",
              unit:"",
              cost_classify:"",
              executive_section:"",
              medical_coverage:"",
              statistical_classification:"",
              disease_directory:"",
              is_record:"",
              medical_code:"",
              tube_color:"",
              medical_status:"",
              remark:"",
              sign:"",
              default_number:"",
              is_default:"",
              is_charge:"",
              is_estimate:"",
              is_workload:"",
              sort:"",
              is_advice:"",
              single_dose:"",
              delivery_way:"",
              execution_frequency:"",
              number_days:"",
              total:"",
              category:"",
              specail_project:"",
              social_security_directory_code:"",
              record_date:"",
              is_print:"",
            },
            rules: {
                project_name: [{ required: true, message: '请填写项目名称', trigger: 'blur'  }],
                price: [{ required: true, message: '请填写价格', trigger: 'change' }],
                unit: [{ required: true, message: '请填写单位',trigger: 'blur' }],
                cost_classify: [{ required: true, message: '请填写费用类别',trigger: 'blur' }],
                executive_section: [{ required: true, message: '请填写执行科室',trigger: 'blur'  }],
                medical_coverage: [{ required: true, message: '请填写医保等级',trigger: 'blur' }],
           },
           categoryList:[
             {id:1,name:"常规诊疗项目"},
             {id:4,name:"辅助器具项目"},
             {id:5,name:"加收项目"}
           ],
           specailProject:[
             {id:1,name:"是"},
             {id:2,name:"否"}
           ],
           limit:100,
           page:1,
           departMentList:[]
        }
    },
    methods:{
        _close: function(done) {
            // this.clear()
            // done()
            this.$confirm('是否保存')
            .then(_ => {
                this.submitAction('form')
                // done();
            })
            .catch(_ => {
                done()
            });
        },
        clear: function() {
            this.form.id = 0;
            this.form.name = "";
            this.form.intro = "";
        },
        show(id) {
            // this.clear()
            this.visible = true
            if(id == 0){
                this.formTitle = '新增'
            }else{
                this.formTitle = '编辑'
            }
        },
        hide() {
         this.visible = false
        },
       getDataConfig(module, filed_name){
         return getDataConfig(module, filed_name)
       },
        getDictionaryDataConfig(module, filed_name) {
          return getDictionaryDataConfig(module, filed_name)
       },
       submitAction(formName){
          this.$refs[formName].validate((valid)=>{
            if(valid){
                 var params = {
                    project_name:this.form.project_name,
                    pinyin:this.form.pinyin,
                    wubi:this.form.wubi,
                    price:this.form.price,
                    unit:this.form.unit,
                    cost_classify:this.form.cost_classify,
                    executive_section:this.form.executive_section,
                    medical_coverage:this.form.medical_coverage,
                    statistical_classification:this.form.statistical_classification,
                    disease_directory:this.form.disease_directory,
                    is_record:this.form.is_record,
                    medical_code:this.form.medical_code,
                    tube_color:this.form.tube_color,
                    medical_status:this.form.medical_status,
                    remark:this.form.remark,
                    sign:this.form.sign,
                    default_number:this.form.default_number,
                    is_charge:this.form.is_charge,
                    is_estimate:this.form.is_estimate,
                    is_workload:this.form.is_workload,
                    sort:this.form.sort,
                    is_advice:this.form.is_advice,
                    is_default:this.form.is_default,
                    single_dose:this.form.single_dose,
                    delivery_way:this.form.delivery_way,
                    execution_frequency:this.form.execution_frequency,
                    number_days:this.form.number_days,
                    total:this.form.total,
                    category:this.form.category,
                    specail_project:this.form.specail_project,
                    social_security_directory_code:this.form.social_security_directory_code,
                    record_date:this.form.record_date,
                    is_print:parseInt(this.form.is_print) 
               }
             console.log("params222222",params)
              saveProject(params).then(response=>{
                 if(response.data.state == 1){
                   var hisProject = response.data.data.hisProject
                   this.$parent.getlist()
                   this.$message.success('保存成功')
                   this.visible = false
                   this.form.project_name = ""
                   this.form.pinyin = ""
                   this.form.wubi = ""
                   this.form.price = ""
                   this.form.unit = ""
                   this.form.cost_classify = ""
                   this.form.executive_section = ""
                   this.form.medical_coverage = ""
                   this.form.statistical_classification = ""
                   this.form.disease_directory = ""
                   this.form.is_record = ""
                   this.form.medical_code = ""
                   this.form.tube_color = ""
                   this.form.medical_status = ""
                   this.form.remark = ""
                   this.form.sign = ""
                   this.form.default_number = ""
                   this.form.is_charge = ""
                   this.form.is_estimate = ""
                   this.form.is_workload = ""
                   this.form.sort = ""
                   this.form.is_advice = ""
                   this.form.is_default = ""
                   this.form.single_dose = ""
                   this.form.delivery_way = ""
                   this.form.execution_frequency = ""
                   this.form.number_days = ""
                   this.form.total = "",
                   this.form.social_security_directory_code = ""
                   this.form.record_date = ""
                   this.form.specail_project = ""
                 }else {
                    this.$message.error("项目名称已存在!")
                 }
              })
            }
          })
       },
        getlist(){
        var params = {
            limit:this.limit,
            page:this.page,
        }
        getDePartmentList(params).then(response=>{
            if(response.data.state == 1){
            var department =   response.data.data.departMentList
            console.log("科室列表",department)
            this.departMentList = department
            }
        })
        },
    },
    created(){
       this.getlist()
    }
}
</script>