nsgk_mobile/src/views/sunVillage_info/threeEdit.vue

 <template>
     <div class="home_wrapper">
         <div class="header_main">
             资产修改
             <div class="return_btn" @click="onClickLeft"></div>
         </div>
       <van-form @submit="onSubmit">
         <div class="list_main">
           <div class="titBox">
             <img src="../../assets/images/sunVillage_info/add_icon_1.png" style="width:22PX;height:22PX;margin-right: 10px;"/>
             <p class="tit">基本信息</p>
           </div>
           <van-field required :rules="[{ required: true }]" v-model="form.zcdm" label="资产编码" placeholder="资产编码" input-align="right" :border="false" :maxlength="20"/>
           <van-field required :rules="[{ required: true }]" v-model="form.zcmc" label="资产名称" placeholder="资产名称" input-align="right" :border="false" :maxlength="100"/>

           <van-field
             readonly
             clickable
             label="三清类型"
             placeholder="请选择"
             v-model="threeAssetType"
             @click="showThreeAssetType = true"
             input-align="right"
             right-icon="arrow-down"
             label-width="auto"
             required
             :border="false"
             :rules="[{ required: true  }]"
           />
           <van-popup v-model="showThreeAssetType" position="bottom">
             <van-picker
               show-toolbar
               :columns="threeAssetTypeOptions"
               @confirm="onConfirmThreeAssetType"
               @cancel="showThreeAssetType = false"
             />
           </van-popup>

           <van-field
             readonly
             clickable
             label="资产类型"
             placeholder="请选择"
             v-model="threeDetailType"
             @click="showThreeDetailType = true"
             input-align="right"
             right-icon="arrow-down"
             label-width="auto"
             required
             :border="false"
             :rules="[{ required: true  }]"
           />
           <van-popup v-model="showThreeDetailType" position="bottom">
             <van-picker
               show-toolbar
               :columns="farmingResourceTypeOptions"
               @confirm="onConfirmThreeDetailType"
               @cancel="showThreeDetailType = false"
             />
           </van-popup>
           <van-field v-model="form.ydmj" label="用地面积（亩）" placeholder="用地面积（亩）" required :rules="[{ required: true }]" type="number" input-align="right" :border="false" :maxlength="15"/>
           <van-field v-model="form.jzmj" label="建筑面积（㎡）" placeholder="建筑面积（㎡）" input-align="right" type="number" :border="false" :maxlength="15"/>
           <van-field v-model="form.szz" label="所在组" placeholder="所在组" input-align="right" :border="false" :maxlength="100"/>
           <van-field
             readonly
             clickable
             label="权属性质"
             placeholder="请选择"
             v-model="natureOwnership"
             @click="showNatureOwnership = true"
             input-align="right"
             right-icon="arrow-down"
             label-width="auto"
             :border="false"
           />
           <van-popup v-model="showNatureOwnership" position="bottom">
             <van-picker
               show-toolbar
               :columns="natureOwnershipOptions"
               @confirm="onConfirmNatureOwnership"
               @cancel="showNatureOwnership = false"
             />
           </van-popup>
           <van-field
             readonly
             clickable
             label="权属是否存在争议"
             placeholder="请选择"
             v-model="qssfczzy"
             @click="showQssfczzy = true"
             input-align="right"
             right-icon="arrow-down"
             label-width="auto"
             :border="false"
           />
           <van-popup v-model="showQssfczzy" position="bottom">
             <van-picker
               show-toolbar
               :columns="sysYesNoOptions"
               @confirm="onConfirmQssfczzy"
               @cancel="showQssfczzy = false"
             />
           </van-popup>
           <van-field v-model="form.qszt" label="权属主体" placeholder="权属主体" input-align="right" :border="false" :maxlength="100"/>
           <van-field
             readonly
             clickable
             label="是否委托代管"
             placeholder="请选择"
             v-model="sfwtdg"
             @click="showSfwtdg = true"
             input-align="right"
             right-icon="arrow-down"
             label-width="auto"
             :border="false"
           />
           <van-popup v-model="showSfwtdg" position="bottom">
             <van-picker
               show-toolbar
               :columns="sysYesNoOptions"
               @confirm="onConfirmSfwtdg"
               @cancel="showSfwtdg = false"
             />
           </van-popup>
           <van-field v-model="form.lxdh" label="联系电话" placeholder="联系电话" input-align="right" :border="false" :maxlength="100"/>
           <van-field v-model="form.phfs23" label="23年盘活方式" placeholder="23年盘活方式" input-align="right" :border="false" :maxlength="150"/>
           <van-field v-model="form.xy23" label="23年效益(万元)" placeholder="23年效益（万元)" input-align="right" type="number" :border="false" :maxlength="15"/>
           <van-field v-model="form.phfs24" label="24年盘活方式" placeholder="24年盘活方式" input-align="right" :border="false" :maxlength="150"/>
           <van-field v-model="form.xy24" label="24年效益(万元)" placeholder="24年效益（万元)" input-align="right" type="number" :border="false" :maxlength="15"/>
           <van-field v-model="form.phqk" label="盘活情况" placeholder="盘活情况" input-align="right" :border="false" :maxlength="50"/>
           <van-field v-model="form.xzyy" label="资产闲置原因" placeholder="资产闲置原因" input-align="right" :border="false" :maxlength="100"/>
            <van-field
             readonly
             clickable
             label="是否能正常使用"
             placeholder="请选择"
             v-model="sfnzcsy"
             @click="showSfnzcsy = true"
             input-align="right"
             right-icon="arrow-down"
             label-width="auto"
             :border="false"
           />
           <van-popup v-model="showSfnzcsy" position="bottom">
             <van-picker
               show-toolbar
               :columns="sysYesNoOptions"
               @confirm="onConfirmSfnzcsy"
               @cancel="showSfnzcsy = false"
             />
           </van-popup>
           <van-field v-model="form.wshsy" label="完善后使用" placeholder="完善后使用" input-align="right" :border="false" :maxlength="100"/>
           <van-field v-model="form.bnsy" label="不能使用" placeholder="不能使用" input-align="right" :border="false" :maxlength="100"/>
           <van-field v-model="form.phcs" label="盘活措施" placeholder="盘活措施" input-align="right" :border="false" :maxlength="200"/>
           <van-field v-model="form.phsx" label="盘活时限" placeholder="盘活时限" input-align="right" :border="false" :maxlength="100"/>
           <van-field v-model="form.zctjnd" label="资产统计年度" placeholder="资产统计年度" input-align="right" :border="false" :maxlength="100"/>
           <van-field v-model="form.bz" label="备注" placeholder="备注" input-align="right" :border="false" :maxlength="500"/>

         </div>
         <div style="margin: 16px auto;width: 50%;">
           <van-button round block type="primary" native-type="submit">
             保存
           </van-button>
         </div>
       </van-form>
     </div>
 </template>
 <script>
   import { updateThree,getThree } from "@/api/sunVillage_info/three";
   export default {
     name: "certificateList",
     data() {
       return {
         // 资产分类字典
         threeAssetTypeOptions: [],
         farmingResourceTypeOptions: [],
         threeJtzyzcTypeOptions: [],
         threeNysssbTypeOptions: [],
         threeNhTypeOptions: [],
         natureOwnershipOptions:[],
         sysYesNoOptions:[],
         threeAssetTypeSelect: [],
         threeJtzyzcTypeSelect: [],
         threeNysssbTypeSelect: [],
         threeNhTypeSelect: [],
         natureOwnershipSelect:[],
         sysYesNoSelect:[],
         showStartTime:false,
         showEndTime:false,
         showThreeAssetType:false,
         threeAssetType:'',
         showThreeDetailType:false,
         threeDetailType:'',
         form:{
            id: null,
            bookId: null,
            deptId: null,
            zcdm: null,
            zcmc: null,
            threeAssetType: null,
            threeDetailType: null,
            ydmj: null,
            jzmj: null,
            szz: null,
            natureOwnership: null,
            qssfczzy: null,
            qszt: null,
            sfwtdg: null,
            lxdh: null,
            phfs23: null,
            xy23: null,
            phfs24: null,
            xy24: null,
            phqk: null,
            xzyy: null,
            sfnzcsy: null,
            wshsy: null,
            bnsy: null,
            phcs: null,
            phsx: null,
            zctjnd: null,
            bz: null,
            theGeom: null,
            createBy: null,
            createTime: null,
            updateBy: null,
            updateTime: null
         },
         showNatureOwnership:false,
         natureOwnership:'',
         showQssfczzy:false,
         qssfczzy:'',
         showSfwtdg:false,
         sfwtdg:'',
         showSfnzcsy:false,
         sfnzcsy:'',
         showBuildTime:false,
         auditStatus:[],
         loading: false,
         finished: false,
         listLength:'0',
         searchInput:'',
         queryParams:{
           pageNum:1,
           pageSize:10,
           orderByColumn:'createTime',
           isAsc:'desc',
           name:'',
         },
         buildTime:new Date()
       };
     },
     created() {
       this.houseGetDicts("nature_ownership").then((response) => {
         this.natureOwnershipSelect = response.data;
         for(var i = 0 ; i < response.data.length ; i++){
           this.natureOwnershipOptions.push({text:response.data[i].dictLabel,value:response.data[i].dictValue});
         }
       });
       this.houseGetDicts("sys_yes_no").then((response) => {
         this.sysYesNoSelect = response.data;
         for(var i = 0 ; i < response.data.length ; i++){
           this.sysYesNoOptions.push({text:response.data[i].dictLabel,value:response.data[i].dictValue});
         }
       });
       this.houseGetDicts("three_asset_type").then((response) => {
         this.threeAssetTypeSelect = response.data;
         for(var i = 0 ; i < response.data.length ; i++){
           this.threeAssetTypeOptions.push({text:response.data[i].dictLabel,value:response.data[i].dictValue});
         }
       });
      this.houseGetDicts("three_jtzyzc_type").then((response) => {
         this.threeJtzyzcTypeSelect = response.data;
        for(var i = 0 ; i < response.data.length ; i++){
          this.threeJtzyzcTypeOptions.push({text:response.data[i].dictLabel,value:response.data[i].dictValue});
        }
      });
      this.houseGetDicts("three_nysssb_type").then((response) => {
         this.threeNysssbTypeSelect = response.data;
        for(var i = 0 ; i < response.data.length ; i++){
          this.threeNysssbTypeOptions.push({text:response.data[i].dictLabel,value:response.data[i].dictValue});
        }
      });
      this.houseGetDicts("three_nh_type").then((response) => {
         this.threeNhTypeSelect = response.data;
        for(var i = 0 ; i < response.data.length ; i++){
          this.threeNhTypeOptions.push({text:response.data[i].dictLabel,value:response.data[i].dictValue});
        }
      });
       this.getDetail();
     },
     methods: {
       getDetail(){
         getThree(this.$route.query.id).then(response => {
           this.form = response.data;
           this.threeAssetType = this.selectDictLabel(this.threeAssetTypeSelect, response.data.threeAssetType);
           this.natureOwnership = this.selectDictLabel(this.natureOwnershipSelect, response.data.natureOwnership);
           this.qssfczzy = this.selectDictLabel(this.sysYesNoSelect, response.data.qssfczzy);
           this.sfwtdg = this.selectDictLabel(this.sysYesNoSelect, response.data.sfwtdg);
           this.sfnzcsy = this.selectDictLabel(this.sysYesNoSelect, response.data.sfnzcsy);
           if (response.data.threeAssetType == '1'){//集体资源资产
            this.threeDetailType = this.selectDictLabel(this.threeJtzyzcTypeSelect, response.data.threeDetailType);
            this.farmingResourceTypeOptions = this.threeJtzyzcTypeOptions;
           }
           if (response.data.threeAssetType == '2'){//农业设施设备
            this.threeDetailType = this.selectDictLabel(this.threeNysssbTypeSelect, response.data.threeDetailType);
            this.farmingResourceTypeOptions = this.threeNysssbTypeOptions;
           }
           if (response.data.threeAssetType == '3'){//农户资产
            this.threeDetailType = this.selectDictLabel(this.threeNhTypeSelect, response.data.threeDetailType);
            this.farmingResourceTypeOptions = this.threeNhTypeOptions;
          }
         });
       },
       onConfirmThreeAssetType(data){
         this.threeAssetType = data.text;
         this.form.threeAssetType = data.value;
         this.showThreeAssetType = false;
         this.threeDetailType = '';
         this.form.threeDetailType = '';
         this.farmingResourceTypeOptions = []
         if (data.value == '1'){//集体资源资产
           this.houseGetDicts("three_jtzyzc_type").then((response) => {
             for(var i = 0 ; i < response.data.length ; i++){
               this.farmingResourceTypeOptions.push({text:response.data[i].dictLabel,value:response.data[i].dictValue});
             }
           });
         }
         if (data.value == '2'){//农业设施设备
           this.houseGetDicts("three_nysssb_type").then((response) => {
             for(var i = 0 ; i < response.data.length ; i++){
               this.farmingResourceTypeOptions.push({text:response.data[i].dictLabel,value:response.data[i].dictValue});
             }
           });
         }
         if (data.value == '3'){//农户资产
           this.houseGetDicts("three_nh_type").then((response) => {
             for(var i = 0 ; i < response.data.length ; i++){
               this.farmingResourceTypeOptions.push({text:response.data[i].dictLabel,value:response.data[i].dictValue});
             }
           });
         }

       },
       onConfirmThreeDetailType(data){
         this.threeDetailType = data.text;
         this.form.threeDetailType = data.value;
         this.showThreeDetailType = false;
       },
       onConfirmQssfczzy(data){
         this.qssfczzy = data.text;
         this.form.qssfczzy = data.value;
         this.showQssfczzy = false;
       },
       onConfirmNatureOwnership(data){
         this.natureOwnership = data.text;
         this.form.natureOwnership = data.value;
         this.showNatureOwnership = false;
       },
       onConfirmSfwtdg(data){
         this.sfwtdg = data.text;
         this.form.sfwtdg = data.value;
         this.showSfwtdg = false;
       },
       onConfirmSfnzcsy(data){
         this.sfnzcsy = data.text;
         this.form.sfnzcsy = data.value;
         this.showSfnzcsy = false;
       },
       onSubmit(){
         updateThree(this.form).then(response => {
           if (response.code == 200){
             this.$notify({ type: 'success', message: '修改成功' });
             setTimeout(function(){
               history.back(-1);
             },2000)
           }
         });
       }
     },
   }
 </script>
 <style scoped lang="scss">
   /deep/ .van-button--primary{
     background: url("../../assets/images/sunVillage_info/btn_bg.png") no-repeat;
     background-size: 100% 100%;
     border: none;
   }
  .home_wrapper{
    background: #e9e9e9;
    min-height: 100vh;
    width: 100vw;
    .header_main {
        height: 116px;
        background: url('../../assets/images/sunVillage_info/list_head.png') no-repeat;
        background-size: 100% 100%;
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        font-size: 36px;
        line-height: 116px;
        text-align: center;
        color: #fff;
        position: relative;

        .return_btn {
            width: 24px;
            height: 43.2px;
            background: url('../../assets/images/sunVillage_info/list_icon_5.png') center center no-repeat;
            background-size: 20px 36px;
            position: absolute;
            left: 38px;
            top: 36px;
        }

        .add_btn {
            width: 56.4px;
            height: 40.8px;
            background: url('../../assets/images/sunVillage_info/list_icon_9.png') center center no-repeat;
            background-size: 47px 34px;
            position: absolute;
            right: 38px;
            top: 36px;
        }
    }
    .list_main{
      padding:25px;
      background: #ffffff;
      width: 94%;
      margin: 25px auto 0;
      border-radius: 15PX;
      box-shadow: 4px 6px 5px rgba(63, 68, 75, 0.1);
    }
    .titBox{
      display: flex;
      align-items: center;
    }
    .tit{
      font-size: 36px;
      font-weight: bold;
    }
    /deep/ .van-cell{
      padding-left: 0!important;
      padding-right: 0!important;
      padding-bottom: 0!important;
    }
    /deep/ .van-field__label{
      padding-left: 10PX;
      width: 8.2em;
    }
    /deep/ .van-cell--required::before{
      left: 0;
    }

}







 </style>