5601列表页面中的内容变化处理，自定义表单的set_dlg_attr_show

cuiqian2004

10 天以前 90e4076a8adf5dac4384f10d9ce22398580eaf34

 pages/modal/form/index.vue

@@ -1,13 +1,13 @@
<template>
   <view class="uni-page-modal-form">
   <view class="uni-page-modal-form" :class="largeMode?'large-mode':''">
      <view class="view-content">
         <!-- 表头样式 -->
         <OIForm ref="refBaseForm" class="v-head-style" :form="head_styledef.form" :focusId="focusFieldId"
         <OIForm ref="refBaseForm" class="v-head-style" :form="head_styledef.form" :hiddenIds="head_styledef.hiddenIds ?head_styledef.hiddenIds :[] " :focusId="focusFieldId"
            @on-click="onClick" @on-focus="ontap" @on-change="onEnterChange" @on-click-prefix="classAttr_extButton"
            @on-click-suffix="classAttr_extButton"></OIForm>
      </view>
      <view class="view-bottom">
         <button type="primary" @tap="onClickOk" class="btn_add" :class="okLoading?'btn_disabled':''"
         <button type="primary" @tap="ok" class="btn_add" :class="okLoading?'btn_disabled':''"
            :disabled="okLoading">{{translateSys('ok')}}</button>
         <button type="default" @tap="cancel" class="btn_cancel">{{translateSys('cancel')}}</button>

@@ -43,7 +43,7 @@
<script>
   import {
      Base64
   } from  '@/js/Base64.js';
   } from '@/js/Base64.js';
   import {
      dictGetInfo
   } from "@/api/mobox.js"
@@ -56,16 +56,15 @@
   } from "@/api/data.js"
   import dayjs from "dayjs";
   import OIForm from '@/components/oi-form/index.vue'
   import buttonClickMixin from '@/mixins/button-click.js';

   export default {
      name: "PageModalForm",
      mixins: [buttonClickMixin],
      components: {
         OIForm
      },
      data() {
         return {
            largeMode: getApp().globalData.largeMode || false,
            okLoading: false,
            title: this.translateSys('add2'),
            type: '',
@@ -295,6 +294,25 @@
                        }
                     }
                  }
                  const app = getApp()
                  if (app.globalData.bindClasses) {
                     styledefHead.form.items.push({
                        name: "Input",
                        label: this.translate("classes"),
                        labelWidth: 100,
                        disabled: true,
                        value: app.globalData.classes,
                        setting: {
                           width: 100,
                           height: 50,
                        },
                        bind: {
                           attr: "",
                        },
                        fieldId: "S_CLASSES",
                     })
                     styledefHead.form.model["S_CLASSES"] = app.globalData.classes
                  }

               }
               this.setData({
@@ -491,6 +509,10 @@
                              // value = {"attr":"xxx", "value":"xxx"}
                              var data = item.value;
                              $this.setFormValues(data)
                           } else if (action.action_type == 'set_dlg_attr_show') {
                              var data = action.value;

                              $this.setFormItemVisible(data)
                           }
                        });
                     } else {
@@ -531,8 +553,8 @@
            //console.log(e.target)
            this.focusOldFieldId = item.fieldId
            getApp().onScan((result) => {
               console.log(result.decodedata);
               item.value = result.decodedata;
               console.log(result);
               item.value = result;
               var $this = this;
               let newVal = item.value.trim()
               if (newVal) {
@@ -797,6 +819,11 @@
                                 var data = item.value;
                                 $this.setFormValues(data)
                              }
                              else if (action.action_type == 'set_dlg_attr_show') {
                                 var data = action.value;
										
                                 $this.setFormItemVisible(data)
                              }
                           });
                        } else {

@@ -902,11 +929,32 @@

               //判断表单里是否有返回字段，没有就装载到model里，点击确定提交的时候带上这些数据
            })
            console.log(head_styledef)
            this.setData({
               head_styledef: head_styledef
            })
         },
         setFormItemVisible(attrs) {
            if (!Array.isArray(attrs)) {
               return
            }
            const head_styledef = this.head_styledef
            if (!head_styledef.hiddenIds) {
               head_styledef.hiddenIds = []
            }
            attrs.forEach((attr) => {
               let index = head_styledef.hiddenIds.findIndex((id) => id == attr.attr);
               if (attr.show) {
                  if (index > -1) head_styledef.hiddenIds.splice(index, 1);
               } else {
                  if (index == -1) head_styledef.hiddenIds.push(attr.attr);
               }
            });
            this.setData({
               head_styledef: head_styledef
            })

         },

         popupChange(e) {
            console.log('当前模式：' + e.type + ',状态：' + e.show);
         },
@@ -1089,43 +1137,8 @@
                           $this.setFormValues(result)
                        } else if (action.action_type == 'set_dlg_attr_show') {
                           var result = action.value;
                           result.forEach(async (attr, key) => {
                              $this.head_styledef.form.items
                                 .forEach(
                                    async (ele,
                                       index) => {
                                       //判断是否是栅格表单
                                       if (ele.name != 'Layout') {
                                          if (ele.fieldId == attr
                                             .attr) {
                                             ele.show = attr
                                                .show;
                                          }
                                       } else if (ele.name ==
                                          'Layout') {
                                          ele.setting.colList
                                             .forEach(
                                                col => {
                                                   if (col) {
                                                      if (col
                                                         .fieldId ==
                                                         attr
                                                         .attr
                                                      ) {
                                                         col.show =
                                                            attr
                                                            .show;
                                                      }
                                                   }
                                                });
                                       }
                                    });
                           });
                           var head_styledef = JSON.parse(JSON.stringify($this.$data
                              .head_styledef));
                           $this.head_styledef = [];
                           $this.head_styledef = head_styledef;
                           // console.log($this.head_styledef);

                           $this.setFormItemVisible(result)
                        } else if (action.action_type == 'set_global_attr') {
                           $this.global_attr = action.value || [];
                        } else {
@@ -1461,12 +1474,6 @@
               });
            });
         },
         onClickOK() {
            this.handleButtonClick(async (done) => {
               await this.ok()
               done(); // 重置状态
            });
         },
         //确定
         async ok() {
            try {
@@ -1475,6 +1482,7 @@
                  mask: true
               });
               this.okLoading = true
               console.log(obj_attr)
               var obj_attr = this.head_styledef.form.model || {};
               console.log(obj_attr)
               let ret = await this.sava();
@@ -1490,6 +1498,7 @@

               uni.navigateBack()
            } catch (ex) {
               this.okLoading = true
               return false;
            }
         },
@@ -1844,39 +1853,6 @@
         flex-direction: column;
      }

      .v-head-style {
         width: 98%;

         .uni-forms-item {
            margin-bottom: 11rpx;
         }

         .input-wrapper {
            border: 1px solid #d5d5d5;
            width: 100%;
            display: flex;
            flex-direction: row;

            .uni-input {
               flex: 1;
               padding: 12rpx 8rpx;
               color: #2d8cf0;
               // height: 40rpx;
               // line-height: 40rpx;
            }

            .uni-icon {

               padding: 10rpx 5rpx;
               font-size: 32rpx;
               color: rgb(192, 196, 204);
            }
         }

         .input-wrapper:hover {
            border: 1px solid rgb(41, 121, 255);
         }
      }

      .view-content {
         display: flex;