elizebeth/src/xt_pages/data/components/editProject.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 getDictionaryDataConfig('system','executive_section')"
                                :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="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>
            </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 { getProjectDetail,updatedProject } from "@/api/project/project"
export default {
    data(){
        return{
            visible:false,
            formTitle:'',
            activeName:'first',
            options: [
             {value: 1,label: '是'},
             {value: 2,label: '否'}
             ],
            value: '',
            radio:'1',
          
            form:{
              id:0,
              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:""
            },
            rules: {
                project_name: [{ required: true, message: '请填写项目名称', trigger: 'blur'  }],
                // pinyin: [{ required: true, message: '请填写拼音' , trigger: 'blur' }],
                // wubi: [{ 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:"加收项目"}
           ]
        }
    },
    methods:{
        _close: function(done) {
            done()
        },
        clear: function() {
            this.form.id = 0;
            this.form.name = "";
            this.form.intro = "";
        },
        show(id) {
          
           this.visible = true
           this.formTitle = '编辑'
           this.getProjectDetail(id)
        },
        hide() {
         this.visible = false
        },
       getDataConfig(module, filed_name){
         return getDataConfig(module, filed_name)
       },
        getDictionaryDataConfig(module, filed_name) {
          return getDictionaryDataConfig(module, filed_name)
       },
       getProjectDetail(id){
        
         getProjectDetail(id).then(response=>{
            if(response.data.state == 1){
              var projecDetail =  response.data.data.projecDetail
              console.log("projectdatail",projecDetail)
              this.form.id = projecDetail.id
              this.form.project_name = projecDetail.project_name
              this.form.pinyin = projecDetail.pinyin
              this.form.wubi = projecDetail.wubi
              this.form.price = projecDetail.price
              this.form.unit = projecDetail.unit
              this.form.cost_classify = projecDetail.cost_classify
              this.form.executive_section = projecDetail.executive_section
              this.form.medical_coverage = projecDetail.medical_coverage
              this.form.statistical_classification =projecDetail.statistical_classification
              this.form.disease_directory = projecDetail.disease_directory?projecDetail.disease_directory:""
              this.form.is_record = projecDetail.is_record?projecDetail.is_record:""
              this.form.medical_code = projecDetail.medical_code
              this.form.tube_color = projecDetail.tube_color?projecDetail.tube_color:""
              this.form.medical_status = projecDetail.medical_status
              this.form.remark = projecDetail.remark
              this.form.sign = projecDetail.sign
              this.form.default_number = projecDetail.default_number
              this.form.is_default = projecDetail.is_default
              this.form.is_charge = projecDetail.is_charge
              this.form.is_estimate = projecDetail.is_estimate
              this.form.is_workload = projecDetail.is_workload
              this.form.sort = projecDetail.sort
              this.form.is_advice = projecDetail.doctor_advice
              this.form.single_dose = projecDetail.single_dose
              this.form.delivery_way = projecDetail.delivery_way
              this.form.execution_frequency = projecDetail.execution_frequency
              this.form.number_days = projecDetail.number_days
              this.form.total = projecDetail.total
              this.form.category = projecDetail.category
            }
         })
       },
     
       
       submitAction(formName){
          this.$refs[formName].validate((valid)=>{
            if(valid){
                 var params = {
                    id:this.form.id,
                    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
               }
              
              updatedProject(params).then(response=>{
                 if(response.data.state == 1){
                   var hisProject = response.data.data.hisProject
                   this.$message.success('保存成功')
                   this.$parent.getlist()
                   this.visible = false
                   
                 }
              })
            }
          })
       }
    }
}
</script>