cuiqian2004
2024-07-12 effc285be3229af6b77edafcb5ec71b96a35f53a
pages/modal/3018_2.vue
@@ -1,128 +1,122 @@
<template>
   <view class="uni-page-modal-3018-2">
      <!-- 表头样式 -->
      <view class="v-headStyle" v-for="(item,index) in head_styledef.form.items">
         <!-- 普通布局 -->
         <view v-if="item.name!='Layout' && item.show==true">
            <text class="txt_title" :style="{'width':item.labelWidth+'px'}">{{item.label}}:</text>
            <span class="form-item-span" v-if="item.disabled"
               :style="'width: calc(100% - '+item.labelWidth+'px);'">{{item.value}}</span>
            <!-- 下拉框-单选 item.useDict?item.dict:item.selections-->
            <uni-data-select id="dv_select" v-if="item.name=='Select' && !item.disabled"
               :style="'width: calc(100% - '+item.labelWidth-10+'px);'" :class="item.disabled?'input-disabled':''"
               v-model="item.value" :localdata="item.dict" @change="onchange(item)" :disabled="item.disabled"
               :clear="false"></uni-data-select>
            <!-- 下拉框-多选 -->
            <!-- <select-cy v-else-if="attr.select==true"  :value="item.value"
           :name="item.fieldId"
           :options="item.dict"
           showClearIcon="true"
           @change="onchange2"
           :data-index="index"
           :disabled="item.disabled"
         ></select-cy> -->
            <!-- 文本框/数字框 -->
            <view class="input-wrapper" v-if="(item.name=='Input' || item.name=='InputNumber') && !item.disabled">
               <text v-if="item.setting.prefix" class="uni-icon" :class="[item.setting.prefix]"
                  @change="classAttr_extButton(item)">&#xe568;</text>
               <input class="uni-input" :class="item.disabled?'input-disabled':''"
                  :type="item.name=='Input'?'text':item.name=='InputNumber'?'number':'text'" v-model="item.value"
                  :disabled="item.disabled" :placeholder="item.placeholder"
                  :style="{'width':item.setting.prefix && item.setting.suffix?'78%':item.setting.prefix || item.setting.suffix?'87%':'96%'}"
                  :focus="focusFieldId == item.fieldId" @focus="ontap(item)" @click="onClick(item)"
                  @blur="onevent(item)" />
               <text v-if="item.setting.suffix" class="uni-icon" :class="[item.setting.suffix]"
                  @click="classAttr_extButton(item)">&#xe568;</text>
            </view>
            <!-- 多行文本 -->
            <view class="input-wrapper" v-if="item.name=='Textarea' && !item.disabled">
               <textarea class="uni-input" :class="item.disabled?'input-disabled':''" :value="item.value"
                  :focus="focusFieldId == item.fieldId" :placeholder="item.placeholder" @blur="onModelValue(item)"
                  @click="onClick(item)" :data-index="index" style="height:60px;" :style="{'width':'96%'}"
                  :disabled="item.disabled"></textarea>
            </view>
            <!-- 复选框 -->
            <checkbox-group class="check_rememberPwd" v-if="item.name=='Checkbox'"
               :class="item.disabled?'input-disabled':''" @change="onModelValue(item)" :disabled="item.disabled"
               :data-ischeck="item.value">
               <label>
                  <checkbox :value="item.value" :checked="item.value" />
                  <text>{{item.label}}</text>
               </label>
            </checkbox-group>
            <!-- Switch开关 -->
            <switch class="input-switch" v-if="item.name=='Switch'" :class="item.disabled?'input-disabled':''"
               :disabled="item.disabled" v-model="item.value" @change="onModelValue(item)" />
            <!-- 日期时间 -->
            <view class="input-wrapper"
               v-if="(item.name=='TimePicker' || item.name=='DatePicker') && !item.disabled">
               <picker mode="date" class="date_iput" :class="item.disabled?'input-disabled':''"
                  :disabled="item.disabled" :value="item.value" @change="onModelValue(item)">
                  <view class="picker">{{item.value}}</view>
               </picker>
            </view>
         </view>
         <!-- 栅格布局 -->
         <uni-row class="demo-uni-row" v-if="item.name=='Layout' && item.show==true">
            <uni-col v-for="(cols,key) in item.setting.colList"
               :span="item.setting.spanList?item.setting.spanList[key]:24 / item.setting.col">
               <view v-if="cols!=null">
                  <text class="txt_title" :style="{'width':cols.labelWidth+'px'}">{{cols.label}}:</text>
                  <span class="form-item-span" v-if="cols.disabled">{{cols.value}}</span>
                  <view class="input-wrapper"
                     v-if="(cols.name=='Input' || cols.name=='InputNumber') && !cols.disabled">
                     <text v-if="cols.setting.prefix" class="uni-icon" :class="[cols.setting.prefix]"
                        @change="onchange(cols)">&#xe568;</text>
                     <input class="uni-input" :class="cols.disabled?'input-disabled':''"
                        :type="cols.name=='Input'?'text':cols.name=='InputNumber'?'number':'text'"
                        v-model="cols.value" :disabled="cols.disabled" :placeholder="cols.placeholder"
                        :style="{'width':cols.setting.prefix && cols.setting.suffix?'78%':cols.setting.prefix || cols.setting.suffix?'87%':'96%'}"
                        :focus="focusFieldId == cols.fieldId" @focus="ontap(cols)" @click="onClick(cols)"
                        @blur="onevent(cols)" />
                     <text v-if="cols.setting.suffix" class="uni-icon" :class="[cols.setting.suffix]"
                        @click="onchange(cols)">&#xe568;</text>
                  </view>
                  <!-- 下拉框-单选 cols.useDict?cols.dict:cols.selections-->
                  <uni-data-select id="dv_select" v-if="cols.name=='Select' && !cols.disabled"
                     :class="cols.disabled?'input-disabled':''" v-model="cols.value" :localdata="cols.dict"
                     @change="onchange(cols)" :disabled="cols.disabled" :clear="false"></uni-data-select>
                  <!-- 多行文本 -->
                  <view class="input-wrapper" v-if="cols.name=='Textarea' && !cols.disabled">
                     <textarea class="uni-input" :value="cols.value" :class="cols.disabled?'input-disabled':''"
                        :placeholder="cols.placeholder" :focus="focusFieldId == cols.fieldId"
                        @blur="onModelValue(cols)" @click="onClick(cols)" style="height:60px;"
                        :style="{'width':'96%'}" :disabled="cols.disabled"></textarea>
                  </view>
                  <!-- 复选框 -->
                  <checkbox-group class="check_rememberPwd" v-if="cols.name=='Checkbox'"
                     :class="cols.disabled?'input-disabled':''" :disabled="item.disabled"
                     @change="onModelValue(cols)" :data-ischeck="cols.value" :style="{'margin-left':'10rpx'}">
                     <label>
                        <checkbox :value="cols.value" :checked="cols.value" />
                        <text>{{cols.label}}</text>
                     </label>
                  </checkbox-group>
                  <!-- Switch开关 -->
                  <switch v-if="cols.name=='Switch'" :class="cols.disabled?'input-disabled':''"
                     :disabled="item.disabled" v-model="cols.value" @change="onModelValue(cols)"
                     :style="{'margin-left':'10rpx'}" />
                  <!-- 日期时间 -->
                  <view class="input-wrapper"
                     v-if="(cols.name=='TimePicker' || cols.name=='DatePicker') && !cols.disabled">
                     <picker mode="date" class="date_iput" :class="cols.disabled?'input-disabled':''"
                        :disabled="item.disabled" :value="cols.value" @change="onModelValue(cols)">
                        <view class="picker">{{cols.value}}</view>
                     </picker>
                  </view>
      <uni-forms ref="baseForm" label-align="right">
         <view class="v-headStyle" v-for="(item,index) in head_styledef.form.items">
            <!-- 普通布局 -->
            <uni-forms-item v-if="item.name != 'Layout'&& item.show==true" :label="item.label +':' "
               :label-width="item.labelWidth+'px'">
               <!-- <text class="txt_title" :style="{'width':item.labelWidth+'px'}">{{item.label}}:</text> -->
               <span class="form-item-span" v-if="item.disabled"
                  :style="'width: calc(100% - '+item.labelWidth+'px);'">{{item.value}}</span>
               <!-- 下拉框-单选 item.useDict?item.dict:item.selections-->
               <uni-data-select id="dv_select" v-if="item.name=='Select' && !item.disabled"
                  :style="'width: calc(100% - '+item.labelWidth-10+'px);'"
                  :class="item.disabled?'input-disabled':''" v-model="item.value" :localdata="item.dict"
                  @change="onchange(item)" :disabled="item.disabled" :clear="false"></uni-data-select>
               <!-- 文本框/数字框 -->
               <view class="input-wrapper"
                  v-if="(item.name=='Input' || item.name=='InputNumber') && !item.disabled">
                  <text v-if="item.setting.prefix" class="uni-icon" :class="[item.setting.prefix]"
                     @change="classAttr_extButton(item)">&#xe568;</text>
                  <input class="uni-input" :class="item.disabled?'input-disabled':''"
                     :type="item.name=='Input'?'text':item.name=='InputNumber'?'number':'text'"
                     v-model="item.value" :disabled="item.disabled" :placeholder="item.placeholder"
                     :style="{'width':item.setting.prefix && item.setting.suffix?'78%':item.setting.prefix || item.setting.suffix?'87%':'96%'}"
                     :focus="focusFieldId == item.fieldId" @focus="ontap(item)" @click="onClick(item)"
                     @blur="onevent(item)" />
                  <text v-if="item.setting.suffix" class="uni-icon" :class="[item.setting.suffix]"
                     @click="classAttr_extButton(item)">&#xe568;</text>
               </view>
               <!-- 多行文本 -->
               <view class="input-wrapper" v-if="item.name=='Textarea' && !item.disabled">
                  <textarea class="uni-input" :class="item.disabled?'input-disabled':''" :value="item.value"
                     :focus="focusFieldId == item.fieldId" :placeholder="item.placeholder"
                     @blur="onModelValue(item)" @click="onClick(item)" :data-index="index" style="height:60px;"
                     :style="{'width':'96%'}" :disabled="item.disabled"></textarea>
               </view>
            </uni-col>
         </uni-row>
               <!-- 复选框 -->
               <checkbox-group class="check_rememberPwd" v-if="item.name=='Checkbox'"
                  :class="item.disabled?'input-disabled':''" @change="onModelValue(item)"
                  :disabled="item.disabled" :data-ischeck="item.value">
                  <label>
                     <checkbox :value="item.value" :checked="item.value" />
                     <text>{{item.label}}</text>
                  </label>
               </checkbox-group>
               <!-- Switch开关 -->
               <switch class="input-switch" v-if="item.name=='Switch'" :class="item.disabled?'input-disabled':''"
                  :disabled="item.disabled" v-model="item.value" @change="onModelValue(item)" />
               <!-- 日期时间 -->
               <view class="input-wrapper"
                  v-if="(item.name=='TimePicker' || item.name=='DatePicker') && !item.disabled">
                  <picker mode="date" class="date_iput" :class="item.disabled?'input-disabled':''"
                     :disabled="item.disabled" :value="item.value" @change="onModelValue(item)">
                     <view class="picker">{{item.value}}</view>
                  </picker>
               </view>
            </uni-forms-item>
            <!-- 栅格布局 -->
            <uni-row class="demo-uni-row" v-if="item.name=='Layout' && item.show==true">
               <uni-col v-for="(cols,key) in item.setting.colList"
                  :span="item.setting.spanList?item.setting.spanList[key]:24 / item.setting.col">
                  <uni-forms-item v-if="cols!=null" :label="col.label +':'" :label-width="col.labelWidth+'px'">
                     <!-- <text class="txt_title" :style="{'width':cols.labelWidth+'px'}">{{cols.label}}:</text> -->
                     <span class="form-item-span" v-if="cols.disabled">{{cols.value}}</span>
                     <view class="input-wrapper"
                        v-if="(cols.name=='Input' || cols.name=='InputNumber') && !cols.disabled">
                        <text v-if="cols.setting.prefix" class="uni-icon" :class="[cols.setting.prefix]"
                           @change="onchange(cols)">&#xe568;</text>
                        <input class="uni-input" :class="cols.disabled?'input-disabled':''"
                           :type="cols.name=='Input'?'text':cols.name=='InputNumber'?'number':'text'"
                           v-model="cols.value" :disabled="cols.disabled" :placeholder="cols.placeholder"
                           :style="{'width':cols.setting.prefix && cols.setting.suffix?'78%':cols.setting.prefix || cols.setting.suffix?'87%':'96%'}"
                           :focus="focusFieldId == cols.fieldId" @focus="ontap(cols)" @click="onClick(cols)"
                           @blur="onevent(cols)" />
                        <text v-if="cols.setting.suffix" class="uni-icon" :class="[cols.setting.suffix]"
                           @click="onchange(cols)">&#xe568;</text>
                     </view>
                     <!-- 下拉框-单选 cols.useDict?cols.dict:cols.selections-->
                     <uni-data-select id="dv_select" v-if="cols.name=='Select' && !cols.disabled"
                        :class="cols.disabled?'input-disabled':''" v-model="cols.value" :localdata="cols.dict"
                        @change="onchange(cols)" :disabled="cols.disabled" :clear="false"></uni-data-select>
                     <!-- 多行文本 -->
                     <view class="input-wrapper" v-if="cols.name=='Textarea' && !cols.disabled">
                        <textarea class="uni-input" :value="cols.value"
                           :class="cols.disabled?'input-disabled':''" :placeholder="cols.placeholder"
                           :focus="focusFieldId == cols.fieldId" @blur="onModelValue(cols)"
                           @click="onClick(cols)" style="height:60px;" :style="{'width':'96%'}"
                           :disabled="cols.disabled"></textarea>
                     </view>
                     <!-- 复选框 -->
                     <checkbox-group class="check_rememberPwd" v-if="cols.name=='Checkbox'"
                        :class="cols.disabled?'input-disabled':''" :disabled="item.disabled"
                        @change="onModelValue(cols)" :data-ischeck="cols.value"
                        :style="{'margin-left':'10rpx'}">
                        <label>
                           <checkbox :value="cols.value" :checked="cols.value" />
                           <text>{{cols.label}}</text>
                        </label>
                     </checkbox-group>
                     <!-- Switch开关 -->
                     <switch v-if="cols.name=='Switch'" :class="cols.disabled?'input-disabled':''"
                        :disabled="item.disabled" v-model="cols.value" @change="onModelValue(cols)"
                        :style="{'margin-left':'10rpx'}" />
                     <!-- 日期时间 -->
                     <view class="input-wrapper"
                        v-if="(cols.name=='TimePicker' || cols.name=='DatePicker') && !cols.disabled">
                        <picker mode="date" class="date_iput" :class="cols.disabled?'input-disabled':''"
                           :disabled="item.disabled" :value="cols.value" @change="onModelValue(cols)">
                           <view class="picker">{{cols.value}}</view>
                        </picker>
                     </view>
      </view>
                  </uni-forms-item>
               </uni-col>
            </uni-row>
         </view>
      </uni-forms>
      <view class="view-floor">
         <button type="default" @tap="sava" class="btn_add">{{title}}</button>
         <button type="default" @tap="cancel" class="btn_cancel">{{translateSys('cancel')}}</button>
@@ -194,36 +188,47 @@
         };
      },
      onNavigationBarButtonTap(e) {
         if (e.index == 0) {
            const $this = this
            uni.scanCode({
               scanType: ["qrCode"],
               success: function(res) {
         const $this = this
         uni.scanCode({
            scanType: ["qrCode"],
            success: function(res) {
               if ($this.focusFieldId) {
                  const items = $this.head_styledef.form.items || []
                  for (let i in items) {
                     const ele = items[i]
                     if (ele.name == 'Input' || ele.name == 'InputNumber' || ele.name == 'Textarea') {
                        if ($this.focusFieldId == ele.fieldId) {
                           $this.onScanValue(ele, res.result)
                           break;
                        }
                     } else if (ele.name == "Layot") {
                        let curIndex = (ele.setting.colList || []).findIndex((col, index2, arr) => {
                           return (col.name == 'Input' || col.name == 'InputNumber' || col
                                 .name == 'Textarea') && $this
                              .focusFieldId == col.fieldId;
                        })
                        if (curIndex > -1) {
                           let col = ele.setting.colList[curIndex]
                           $this.onScanValue(col, res.result)
                           break
                  if ($this.focusFieldId) {
                     const items = $this.head_styledef.form.items || []
                     for (let i in items) {
                        const ele = items[i]
                        if (ele.name == 'Input' || ele.name == 'InputNumber' || ele.name ==
                           'Textarea') {
                           if ($this.focusFieldId == ele.fieldId) {
                              $this.onScanValue(ele, res.result)
                              break;
                           }
                        } else if (ele.name == "Layot") {
                           let curIndex = (ele.setting.colList || []).findIndex((col, index2,
                              arr) => {
                              return (col.name == 'Input' || col.name == 'InputNumber' || col
                                    .name == 'Textarea') && $this
                                 .focusFieldId == col.fieldId;
                           })
                           if (curIndex > -1) {
                              let col = ele.setting.colList[curIndex]
                              $this.onScanValue(col, res.result)
                              break
                           }
                        }
                     }
                  }
               }
            }
         })
            })
         } else if (e.index == 1) {
            //刷新
            uni.redirectTo({
               url: '../modal/3018_2?param=' + JSON.stringify(this.$data.param) +
                  "&titlename=" + this.$data.title
            });
         }
      },
      onLoad(options) {
         // console.log(options);
@@ -233,12 +238,7 @@
         this.$data.param = JSON.parse(options.param);
         this.$data.title = this.$data.param.Add_BtnName ? this.$data.param.Add_BtnName : options
            .titlename; //设置按钮文字
         console.log(this.$data.param);
         //获取数据类的自定义表单参数
         this.Head_UIStyleGetInfo(this.param.DataCls?.id, this.param.UI_Style?.ID);
         //页面初始化获取焦点
         // this.focusMateria=true;
         this.loadData(options.paramValue)
      },
      methods: {
@@ -262,6 +262,38 @@
                  data = data[key2];
               });
            });
         },
         async loadData(paramValue) {
            //获取数据类的自定义表单参数
            await this.Head_UIStyleGetInfo(this.param.DataCls?.id, this.param.UI_Style?.ID);
            //传入参数值
            if (paramValue) {
               const attrs = paramValue.attrs || [];
               (this.$data.head_styledef?.form?.items || []).forEach(async (ele, index) => {
                  if (ele.name != "Layout") {
                     attrs.forEach(async (ele2, index2) => {
                        if (ele.fieldId == ele2.name) {
                           ele.value = ele2.value;
                        }
                     });
                  } else {
                     ele.setting.colList.forEach(async (col) => {
                        if (col) {
                           attrs.forEach(async (ele2,
                              index2) => {
                              if (col.fieldId == ele2.name) {
                                 col.value = ele2.value;
                              }
                           });
                        }
                     });
                  }
               })
            }
            console.log(this.$data.param);
         },
         async Head_UIStyleGetInfo(class_id, style_id) { //获取自定义表单样式
            var $this = this;
@@ -414,8 +446,7 @@
                           showCancel: false,
                           confirmText: this.translateSys("cancel")
                        });
                     }
                     else uni.showModal({
                     } else uni.showModal({
                        title: this.translateSys("tip"),
                        content: tip + ',' + this.translateSys('tip') + ':' + data.ret,
                        showCancel: false,
@@ -1024,8 +1055,7 @@
                           showCancel: false,
                           confirmText: this.translateSys("cancel")
                        });
                     }
                     else uni.showModal({
                     } else uni.showModal({
                        title: this.translateSys("tip"),
                        content: tip + ',' + this.translateSys('tip') + ':' + data.ret,
                        showCancel: false,
@@ -1350,7 +1380,7 @@
                     var tip = data.err_info ? typeof data.err_info == 'string' ? data.err_info :
                        data
                        .err_info.join('<br/>') : '';
                     if (data.ret == 801){
                     if (data.ret == 801) {
                        if (this.param.Only_Script_Error) {
                           let pos = tip.indexOf(":");
                           if (pos > -1) tip = tip.substring(pos + 1);
@@ -1361,8 +1391,7 @@
                           showCancel: false,
                           confirmText: this.translateSys("cancel")
                        });
                     }
                     else uni.showModal({
                     } else uni.showModal({
                        title: this.translateSys("tip"),
                        content: tip + ',' + this.translateSys('tip') + ':' + data.ret,
                        showCancel: false,
@@ -1653,9 +1682,8 @@
                           uni.showModal({
                              title: this.translateSys("tip"),
                              content: this.translate('execute_script_failed') + this
                                 .translateSys('comma') + this.translate('result') +
                                 this
                                 .translateSys('colon') + action.info,
                                 .translateSys('comma') +
                                 this.translateSys('colon') + action.info,
                              showCancel: false,
                              confirmText: this.translateSys("cancel")
                           });
@@ -1677,7 +1705,7 @@
                        icon: "success",
                        duration: 3000
                     });
                  if (this.$data.param.After_Btn_Refresh) {
                  if (!this.$data.param.After_Btn_Not_Refresh) {
                     //刷新
                     uni.redirectTo({
                        url: '../modal/3018_2?param=' + JSON.stringify(this.$data.param) +
@@ -1823,10 +1851,17 @@
</style>
<style lang="scss">
   .uni-page-modal-3018-2 {
      display: flex;
      height: calc(100vh - 30rpx);
      width: 720rpx;
      flex-direction: column !important;
      padding: 15rpx;
      .v-headStyle {
         /* border: 0.1rpx solid red; */
         /* line-height: 30rpx; */
         padding: 5rpx 0;
         // padding: 5rpx 0;
         width: 98%;
      }
      .v-headStyle:first-child {
@@ -1878,7 +1913,7 @@
      .input-wrapper {
         border: 1px solid #d5d5d5;
         display: inline-block;
         width: 65%;
         width: 100%;
         line-height: 22rpx;
         vertical-align: middle;
      }