nsgk_mobile/src/views/sunVillage_info/resourceAdd.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 v-model="form.code" label="资源编码" placeholder="不输入时系统自动分配" input-align="right" :border="false" />
           <van-field required :rules="[{ required: true }]" v-model="form.name" label="资源名称" placeholder="资源名称" input-align="right" :border="false" />

           <van-field
             readonly
             clickable
             label="资源分类"
             placeholder="请选择"
             v-model="resourceType"
             @click="showResourceType = true"
             input-align="right"
             right-icon="arrow-down"
             label-width="auto"
             required
             :border="false"
             :rules="[{ required: true  }]"
           />
           <van-popup v-model="showResourceType" position="bottom">
             <van-picker
               show-toolbar
               :columns="resourceTypeOptions"
               @confirm="onConfirmResourceType"
               @cancel="showResourceType = false"
             />
           </van-popup>

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

           <van-field v-model="form.location" label="坐落位置" placeholder="坐落位置" input-align="right" :border="false" />
           <van-field v-model="form.east" label="东至" placeholder="东至" input-align="right" :border="false" />
           <van-field v-model="form.west" label="西至" placeholder="西至" input-align="right" :border="false" />
           <van-field v-model="form.south" label="南至" placeholder="南至" input-align="right" :border="false" />
           <van-field v-model="form.north" label="北至" placeholder="北至" input-align="right" :border="false" />
           <van-field v-model="form.totalArea" label="总面积(亩)" placeholder="总面积(亩)" required :rules="[{ required: true }]" input-align="right" :border="false" />

           <field-select
             v-model="form.operationType"
             label="经营属性"
             value-key="dictLabel"
             data-key="dictValue"
             placeholder="请选择"
             :rulesx="[{ required: true }]"
             requiredx
             remote-url="/open/zdzh/list/operation_type"
             :on-remote-response="'data'"/>

           <van-field
             readonly
             clickable
             label="使用情况"
             placeholder="请选择"
             v-model="useType"
             @click="showUseType = true"
             input-align="right"
             right-icon="arrow-down"
             label-width="auto"
             required
             :border="false"
             :rules="[{ required: true }]"
           />
           <van-popup v-model="showUseType" position="bottom">
             <van-picker
               show-toolbar
               :columns="useTypeOptions"
               @confirm="onConfirmUseType"
               @cancel="showUseType = false"
             />
           </van-popup>

           <van-field
             readonly
             clickable
             label="资产状态"
             placeholder="请选择"
             v-model="assetStatus"
             @click="showAssetStatus = true"
             input-align="right"
             right-icon="arrow-down"
             label-width="auto"
             required
             :border="false"
             :rules="[{ required: true }]"
           />
           <van-popup v-model="showAssetStatus" position="bottom">
             <van-picker
               show-toolbar
               :columns="assetStatusOptions"
               @confirm="onConfirmAssetStatus"
               @cancel="showAssetStatus = false"
             />
           </van-popup>

           <van-field v-model="form.remark" label="备注" placeholder="备注" input-align="right" :border="false" />

         </div>

<!--         <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 v-model="form.sumArea" label="总面积(亩)" placeholder="总面积(亩)" input-align="right" :border="false" />-->

<!--           <van-divider>集体经营</van-divider>-->

<!--           <van-field v-model="form.groupArea" label="面积(亩)" placeholder="面积(亩)" input-align="right" :border="false" />-->
<!--           <van-field v-model="form.groupValue" label="年收益(元)" placeholder="年收益(元)" input-align="right" :border="false" />-->

<!--           <van-divider>出租经营</van-divider>-->

<!--           <van-field v-model="form.rentArea" label="面积(亩)" placeholder="面积(亩)" input-align="right" :border="false" />-->
<!--           <van-field v-model="form.rentValue" label="年租金(元)" placeholder="年租金(元)" input-align="right" :border="false" />-->
<!--           <van-field v-model="form.rentLessee" label="承租人" placeholder="承租人" input-align="right" :border="false" />-->

<!--           <van-field-->
<!--             autocomplete="off"-->
<!--             input-align="right"-->
<!--             v-model="form.rentStartTime"-->
<!--             name="开始时间"-->
<!--             label="开始时间"-->
<!--             placeholder="开始时间"-->
<!--             readonly-->
<!--             @click="showStartTime = true"-->
<!--             :border="false"-->
<!--           />-->
<!--           <van-popup v-model:show="showStartTime" position="bottom">-->
<!--             <van-datetime-picker-->
<!--               type="date"-->
<!--               v-model="buildTime"-->
<!--               @confirm="onConfirStartTime"-->
<!--               @cancel="showStartTime = false"-->
<!--               :min-date="minDate"-->
<!--             />-->
<!--           </van-popup>-->

<!--           <van-field-->
<!--             autocomplete="off"-->
<!--             input-align="right"-->
<!--             v-model="form.rentEndTime"-->
<!--             name="到期时间"-->
<!--             label="到期时间"-->
<!--             placeholder="到期时间"-->
<!--             readonly-->
<!--             @click="showEndTime = true"-->
<!--             :border="false"-->
<!--           />-->
<!--           <van-popup v-model:show="showEndTime" position="bottom">-->
<!--             <van-datetime-picker-->
<!--               type="date"-->
<!--               v-model="buildTime"-->
<!--               @confirm="onConfirEndTime"-->
<!--               @cancel="showEndTime = false"-->
<!--               :min-date="minDate"-->
<!--             />-->
<!--           </van-popup>-->

<!--&lt;!&ndash;           <van-field v-model="form.rentStartTime" label="开始时间" placeholder="开始时间" input-align="right" :border="false" />&ndash;&gt;-->
<!--&lt;!&ndash;           <van-field v-model="form.rentEndTime" label="到期时间" placeholder="到期时间" input-align="right" :border="false" />&ndash;&gt;-->


<!--           <van-divider>其他经营</van-divider>-->

<!--           <van-field v-model="form.otherArea" label="面积(亩)" placeholder="面积(亩)" input-align="right" :border="false" />-->
<!--           <van-field v-model="form.otherValue" label="年收益(元)" placeholder="年收益(元)" input-align="right" :border="false" />-->

<!--         </div>-->

<!--         <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 v-model="form.farmerArea" label="总面积(亩)" placeholder="总面积(亩)" input-align="right" :border="false" />-->

<!--           <van-divider>流转入集体统一经营</van-divider>-->

<!--           <van-field v-model="form.circulationArea" label="面积(亩)" placeholder="面积(亩)" input-align="right" :border="false" />-->
<!--           <van-field v-model="form.circulationValue" label="年收益(元)" placeholder="年收益(元)" input-align="right" :border="false" />-->

<!--         </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 { addResource } from "@/api/sunVillage_info/fixedAssets";
   import FieldSelect from "@/components/form/FieldSelect.vue";
   export default {
     name: "certificateList",
     components: {FieldSelect},
     data() {
       return {
         // 资源分类字典
         resourceTypeOptions: [],
         //农用地资源类型字典
         farmingResourceTypeOptions: [],
         //建设用地资源类型字典
         buildResourceTypeOptions: [],
         //未利用地、林木用地资源类型字典
         unusedResourceTypeOptions: [],
         showStartTime:false,
         showEndTime:false,
         showResourceType:false,
         resourceType:'',
         showResourceSort:false,
         resourceSort:'',
         minDate:new Date(1900,1,1),
         applicationList:[],
         applicationListSecond:[],
         form:{
           assetType:'151001',
           operationType:'1',
           addType:'1',
           buildTime:this.format(new Date(),'yyyy-MM-dd'),
           useType:'1',
           assetStatus:'1',
           isMin:'Y',
           isFormAsset:'N',
           quantity:1.00,
           depreciationSubject:"152:累计折旧",
           fixedSubject:"153:固定资产清理",
           depreciationFeeSubject:"541005:管理费用-折旧及修理费",
           depreciationType:'3',
           expectedYears:1,
           depreciationYears:0,
           netValue:0.00,
           originalValue:0.00,
           residualsRate:1,
           netSalvage:0.00,
           fixedValue:null,
           perYearDepreciationValue:null,
           depreciationValue:0
         },
         //资产类别
         assetType:'房屋及建筑物',
         showAssetType:false,
         resourceSortOptions:[],
         //经营属性
         showOperationType:false,
         operationTypeOptions:[],
         //增加方式
         addTypeOptions:[],
         showAddType:false,
         addType:'购入',
         //使用情况
         useTypeOptions:[],
         showUseType:false,
         useType:'自用',
         //资产状态
         assetStatusOptions:[],
         showAssetStatus:false,
         assetStatus:'正常',
         //资产状态
         depreciationTypeOptions:[],
         showDepreciationType:false,
         depreciationType:'不折旧',

         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("resource_sort").then((response) => {
         for(var i = 0 ; i < response.data.length ; i++){
           this.resourceSortOptions.push({text:response.data[i].dictLabel,value:response.data[i].dictValue});
         }
       });
       this.houseGetDicts("operation_type").then((response) => {
         for(var i = 0 ; i < response.data.length ; i++){
           this.operationTypeOptions.push({text:response.data[i].dictLabel,value:response.data[i].dictValue});
         }
       });
       this.houseGetDicts("add_type").then((response) => {
         for(var i = 0 ; i < response.data.length ; i++){
           this.addTypeOptions.push({text:response.data[i].dictLabel,value:response.data[i].dictValue});
         }
       });
       this.houseGetDicts("use_type").then((response) => {
         for(var i = 0 ; i < response.data.length ; i++){
           this.useTypeOptions.push({text:response.data[i].dictLabel,value:response.data[i].dictValue});
         }
       });
       this.houseGetDicts("sys_normal_disable").then((response) => {
         for(var i = 0 ; i < response.data.length ; i++){
           this.assetStatusOptions.push({text:response.data[i].dictLabel,value:response.data[i].dictValue});
         }
       });
       this.houseGetDicts("depreciation_type").then((response) => {
         for(var i = 0 ; i < response.data.length ; i++){
           this.depreciationTypeOptions.push({text:response.data[i].dictLabel,value:response.data[i].dictValue});
         }
       });
       // this.houseGetDicts("resource_farming_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});
       //   }
       // });
       // this.houseGetDicts("resources_build_type").then((response) => {
       //   for(var i = 0 ; i < response.data.length ; i++){
       //     this.buildResourceTypeOptions.push({text:response.data[i].dictLabel,value:response.data[i].dictValue});
       //   }
       // });
       // this.houseGetDicts("resources_unused_type").then((response) => {
       //   for(var i = 0 ; i < response.data.length ; i++){
       //     this.unusedResourceTypeOptions.push({text:response.data[i].dictLabel,value:response.data[i].dictValue});
       //   }
       // });
       this.houseGetDicts("resource_type").then((response) => {
         for(var i = 0 ; i < response.data.length ; i++){
           this.resourceTypeOptions.push({text:response.data[i].dictLabel,value:response.data[i].dictValue});
         }
       });
     },
     methods: {
       onConfirStartTime(val){
         let year = val.getFullYear()
         let month = val.getMonth() + 1
         let day = val.getDate()
         if (month >= 1 && month <= 9) { month = `0${month}` }
         if (day >= 1 && day <= 9) { day = `0${day}` }
         this.form.rentStartTime = year+"-"+month+"-"+day
         this.showStartTime= false
       },
       onConfirEndTime(val){
         let year = val.getFullYear()
         let month = val.getMonth() + 1
         let day = val.getDate()
         if (month >= 1 && month <= 9) { month = `0${month}` }
         if (day >= 1 && day <= 9) { day = `0${day}` }
         this.form.rentEndTime = year+"-"+month+"-"+day
         this.showEndTime= false
       },
       onConfirmResourceType(data){
         this.resourceType = data.text;
         this.form.resourceType = data.value;
         this.showResourceType = false;
         this.farmingResourceTypeOptions = [];
         this.resourceSort = '';
         this.form.resourceSort = '';
         if (data.value == '1'){//农用地
           this.houseGetDicts("resource_farming_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("resources_build_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("resources_unused_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});
             }
           });
         }

       },
       onConfirmResourceSort(data){
         this.resourceSort = data.text;
         this.form.resourceSort = data.value;
         this.showResourceSort = false;
       },
       onConfirmUseType(data){
         this.useType = data.text;
         this.form.useType = data.value;
         this.showUseType = false;
       },
       onConfirmAssetStatus(data){
         this.assetStatus = data.text;
         this.form.status = data.value;
         this.showAssetStatus = false;
       },

       onSubmit(){
         addResource(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>