app-form-view 0.1.0 → 0.1.1

package/dist/css/style.css

@@ -215,6 +215,9 @@ button[disabled] {
   height: 100%;
   overflow: hidden;
 }
+.app-page .app-page-wrap {
+  padding: 15px;
+}
 .app-page .bottom-btns {
   gap: 15px;
   padding-left: 10px;
@@ -279,7 +282,7 @@ button[disabled] {
   border-bottom: none;
 }
 .app-page .sub-item-title .title {
-  font-size: 16px;
+  font-size: 1rem;
   font-weight: 600;
   color: var(--title-text-color);
 }
@@ -292,7 +295,7 @@ button[disabled] {
 .last-cell-child {
   border-bottom-left-radius: 10px;
   border-bottom-right-radius: 10px;
-  margin-bottom: 10px;
+  margin-bottom: 15px;
 }
 .last-cell-child.van-cell {
   padding-bottom: 10px;
@@ -304,12 +307,21 @@ button[disabled] {
 .first-cell-child {
   border-top-left-radius: 10px;
   border-top-right-radius: 10px;
-  margin-top: 10px;
+  margin-top: 15px;
 }
 
 .van-nav-bar .van-icon {
   color: var(--nav-bar-icon-color);
 }
+
+.sub-item-title {
+  padding: 15px 5px;
+}
+.sub-item-title .title {
+  font-size: 1rem;
+  font-weight: 600;
+  color: var(--title-text-color);
+}
 .gray-bg {
   height: 100%;
   overflow: hidden;

package/dist/index.js

@@ -1,5 +1,5 @@
 /*!
- * app-form-view.js v0.0.9
+ * app-form-view.js v0.1.0
  * Released under the MIT License.
  */
 !function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("vue"),require("vuex"),require("vant")):"function"==typeof define&&define.amd?define(["exports","vue","vuex","vant"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).AppFormView={},e.Vue,e.Vuex,e.vant)}(this,function(e,t,n,i){"use strict";function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var r=a(t);function o(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,i=Array(t);n<t;n++)i[n]=e[n];return i}function s(e,t,n,i,a,r,o){try{var s=e[r](o),l=s.value}catch(e){return void n(e)}s.done?t(l):Promise.resolve(l).then(i,a)}function l(e){return function(){var t=this,n=arguments;return new Promise(function(i,a){var r=e.apply(t,n);function o(e){s(r,i,a,o,l,"next",e)}function l(e){s(r,i,a,o,l,"throw",e)}o(void 0)})}}function c(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function u(e,t){for(var n=0;n<t.length;n++){var i=t[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(e,k(i.key),i)}}function d(e,t,n){return t&&u(e.prototype,t),n&&u(e,n),Object.defineProperty(e,"prototype",{writable:!1}),e}function p(e,t){var n="undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(!n){if(Array.isArray(e)||(n=V(e))||t&&e&&"number"==typeof e.length){n&&(e=n);var i=0,a=function(){};return{s:a,n:function(){return i>=e.length?{done:!0}:{done:!1,value:e[i++]}},e:function(e){throw e},f:a}}throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}var r,o=!0,s=!1;return{s:function(){n=n.call(e)},n:function(){var e=n.next();return o=e.done,e},e:function(e){s=!0,r=e},f:function(){try{o||null==n.return||n.return()}finally{if(s)throw r}}}}function f(e,t,n){return(t=k(t))in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function h(){return h=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var i in n)({}).hasOwnProperty.call(n,i)&&(e[i]=n[i])}return e},h.apply(null,arguments)}function m(e){if(null==e)throw new TypeError("Cannot destructure "+e)}function v(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);t&&(i=i.filter(function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable})),n.push.apply(n,i)}return n}function g(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?v(Object(n),!0).forEach(function(t){f(e,t,n[t])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):v(Object(n)).forEach(function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))})}return e}function y(e,t){if(null==e)return{};var n,i,a=function(e,t){if(null==e)return{};var n={};for(var i in e)if({}.hasOwnProperty.call(e,i)){if(-1!==t.indexOf(i))continue;n[i]=e[i]}return n}(e,t);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);for(i=0;i<r.length;i++)n=r[i],-1===t.indexOf(n)&&{}.propertyIsEnumerable.call(e,n)&&(a[n]=e[n])}return a}function b(){
@@ -53,7 +53,7 @@ disabled:t.disabled||l&&"view"==o});
 // 合并只读状态到element（供render组件使用）
 return null==t.name?e(D,{attrs:{conf:c,mode:o,terminal:"mobile"},key:t.renderKey,on:{updateItem:r},class:s}):e("c-app-form-item",{attrs:{conf:t,mode:o,formConf:a},on:{updateItem:r},class:s,scopedSlots:{default:function(n){return e(D,{key:t.renderKey,attrs:{conf:t,value:n.value,mode:o,terminal:"mobile"},on:{input:n.onUpdate,updateItem:r}})}}})},rowFormItem:function(e,t,n,i,a){var r=this.$listeners.updateItem,o=(null==a?void 0:a.mode)||"add";
 // 关键改动3：布局组件（行/块/子行）也需要判断显隐
-if(!I(t,o))return null;var s="widget-"+t.widget,l=F.apply(this,arguments);return"subRow"==t.widget?e("div",{class:s},[e("c-sub-row",{attrs:{conf:t,formConf:a,mode:o},on:{updateItem:r}},[l])]):"block"==t.widget?e("div",{class:s},[e("c-block",{attrs:{conf:t,formConf:a,mode:o},on:{updateItem:r}},[l])]):e("div",{class:s+(void 0!==t.border&&t.border.length>0?t.border.join(" "):"")},[l])}};function F(e,t,n,i,a){var r=this;return Array.isArray(t.children)?t.children.map(function(n,i){var o=L[n.layout];return o?o.call(r,e,n,i,t.children,a):O()}):null}function O(){throw new Error("没有与".concat(this.element.layout,"匹配的layout"))}var R="sjyy/sjczgl/form/bdgl/config/",P={scene:R+"getFromConfigScene",addSave:R+"formConfigAdd",editSave:R+"formConfigEdit",view:R+"formConfigView",getData:"sjyy/sjczgl/form/bdgl/formBdglView",getSjyyFields:"sjyy/sjcxgl/sjxgl/getYsjSjxList",getDict:R+"getFormDictData",getFormInitData:"sjyy/sjczgl/sjcjh/getFormInitData",getViewData:"sjyy/sjczgl/sjcjh/getDataViewById"};function E(e,t,n){return e({url:t,method:"post",data:n})}var N=["class"],z={render:function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"app-page",class:e.mode},[n("c-app-form",{ref:"cform",staticClass:"app-form",attrs:{conf:e.formConf,model:e.formConf.model||{},openType:e.openType,singleUploadList:e.singleUploadList,multiplySingleUploadList:e.multiplySingleUploadList},on:{updateItem:e.updateItem}},[n("div",{staticClass:"app-wrap scroll-wrap"},[n("div",{staticStyle:{padding:"15px"}},[e._l(e.hiddenList,function(t){return n("app-form-item",{key:t.renderKey,attrs:{element:t,"form-conf":e.formConf},on:{updateItem:e.updateItem}})}),e._v(" "),e._l(e.filterDrawingList,function(t){return n("app-form-item",{key:t.renderKey,attrs:{element:t,"form-conf":e.formConf},on:{updateItem:e.updateItem}})})],2)]),e._v(" "),e.formConf.buttons?n("van-goods-action",{ref:"detailBtns",staticClass:"bottom-btns"},e._l(e.formConf.buttons,function(t){return n("app-form-item",{key:t.renderKey,attrs:{element:t,"form-conf":e.formConf},on:{updateItem:e.updateItem}})}),1):e._e()],1)],1)},staticRenderFns:[],name:"AppFormView",components:{AppFormItem:{components:{render:D},props:["element","index","drawingList","formConf"],render:function(e){var t=L[this.element.layout||"colFormItem"];return t?t.call(this,e,this.element,this.index,this.drawingList,this.formConf):O()}}},props:{formId:{type:String},buttonCode:{type:String},ywid:{type:String},formData:{type:Object,default:function(){}},mode:{}},data:function(){return{formConf:{},drawingList:[],openType:"",paddingBottom:"0px",baseWidget:_.map(function(e){return e.widget})}},computed:{hiddenList:function(){return this.drawingList.filter(function(e){return e.noDrag})},filterDrawingList:function(){return this.getDrawingList(this.drawingList.filter(function(e){return!e.noDrag}))},filterList:function(){return this.flattenDrawingList(this.drawingList)},singleUploadList:function(){return this.filterList.filter(function(e){return"inputUpload"==e.widget&&"mainTable"==e.source})},tableList:function(){return this.filterList.filter(function(e){return"table"==e.widget})},multiplyUploadList:function(){var e={};return this.filterList.filter(function(e){return"inputUpload"==e.widget&&"attachedTable"==e.source}).forEach(function(t){if(t.name.split("@").length>1){var n=C(t.name.split("@"),2),i=n[0];n[1],e[i]||(e[i]=t.keyMap)}}),e},multiplySingleUploadList:function(){var e={};return this.filterList.filter(function(e){return"inputUpload"==e.widget&&"attachedTable"==e.source}).forEach(function(t){1==t.name.split("@").length&&(e[t.name]=t.keyMap)}),e},sceneName:function(){return{add:"新增",edit:"修改",view:"查看"}[this.formConf.mode]||"新增"}},watch:{formData:{handler:function(e){e&&(this.formConf=e,this.drawingList=e.fields)},deep:!0},formId:function(){this.initData(this.formId,this.buttonCode,this.ywid)},buttonCode:function(){this.initData(this.formId,this.buttonCode,this.ywid)},ywid:function(){this.initData(this.formId,this.buttonCode,this.ywid)}},created:function(){this.formData&&(this.formConf=this.formData,this.drawingList=this.formData.fields);
+if(!I(t,o))return null;var s="widget-"+t.widget,l=F.apply(this,arguments);return"subRow"==t.widget?e("div",{class:s},[e("c-sub-row",{attrs:{conf:t,formConf:a,mode:o},on:{updateItem:r}},[l])]):"block"==t.widget?e("div",{class:s},[e("c-block",{attrs:{conf:t,formConf:a,mode:o},on:{updateItem:r}},[l])]):e("div",{class:s+(void 0!==t.border&&t.border.length>0?t.border.join(" "):"")},[l])}};function F(e,t,n,i,a){var r=this;return Array.isArray(t.children)?t.children.map(function(n,i){var o=L[n.layout];return o?o.call(r,e,n,i,t.children,a):O()}):null}function O(){throw new Error("没有与".concat(this.element.layout,"匹配的layout"))}var R="sjyy/sjczgl/form/bdgl/config/",P={scene:R+"getFromConfigScene",addSave:R+"formConfigAdd",editSave:R+"formConfigEdit",view:R+"formConfigView",getData:"sjyy/sjczgl/form/bdgl/formBdglView",getSjyyFields:"sjyy/sjcxgl/sjxgl/getYsjSjxList",getDict:R+"getFormDictData",getFormInitData:"sjyy/sjczgl/sjcjh/getFormInitData",getViewData:"sjyy/sjczgl/sjcjh/getDataViewById"};function E(e,t,n){return e({url:t,method:"post",data:n})}var N=["class"],z={render:function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"app-page",class:e.mode},[n("c-app-form",{ref:"cform",staticClass:"app-form",attrs:{conf:e.formConf,model:e.formConf.model||{},openType:e.openType,singleUploadList:e.singleUploadList,multiplySingleUploadList:e.multiplySingleUploadList},on:{updateItem:e.updateItem}},[n("div",{staticClass:"app-page-wrap scroll-wrap"},[e._l(e.hiddenList,function(t){return n("app-form-item",{key:t.renderKey,attrs:{element:t,"form-conf":e.formConf},on:{updateItem:e.updateItem}})}),e._v(" "),e._l(e.filterDrawingList,function(t){return n("app-form-item",{key:t.renderKey,attrs:{element:t,"form-conf":e.formConf},on:{updateItem:e.updateItem}})})],2),e._v(" "),e.formConf.buttons?n("van-goods-action",{ref:"detailBtns",staticClass:"bottom-btns"},e._l(e.formConf.buttons,function(t){return n("app-form-item",{key:t.renderKey,attrs:{element:t,"form-conf":e.formConf},on:{updateItem:e.updateItem}})}),1):e._e()],1)],1)},staticRenderFns:[],name:"AppFormView",components:{AppFormItem:{components:{render:D},props:["element","index","drawingList","formConf"],render:function(e){var t=L[this.element.layout||"colFormItem"];return t?t.call(this,e,this.element,this.index,this.drawingList,this.formConf):O()}}},props:{formId:{type:String},buttonCode:{type:String},ywid:{type:String},formData:{type:Object,default:function(){}},mode:{}},data:function(){return{formConf:{},drawingList:[],openType:"",paddingBottom:"0px",baseWidget:_.map(function(e){return e.widget})}},computed:{hiddenList:function(){return this.drawingList.filter(function(e){return e.noDrag})},filterDrawingList:function(){return this.getDrawingList(this.drawingList.filter(function(e){return!e.noDrag}))},filterList:function(){return this.flattenDrawingList(this.drawingList)},singleUploadList:function(){return this.filterList.filter(function(e){return"inputUpload"==e.widget&&"mainTable"==e.source})},tableList:function(){return this.filterList.filter(function(e){return"table"==e.widget})},multiplyUploadList:function(){var e={};return this.filterList.filter(function(e){return"inputUpload"==e.widget&&"attachedTable"==e.source}).forEach(function(t){if(t.name.split("@").length>1){var n=C(t.name.split("@"),2),i=n[0];n[1],e[i]||(e[i]=t.keyMap)}}),e},multiplySingleUploadList:function(){var e={};return this.filterList.filter(function(e){return"inputUpload"==e.widget&&"attachedTable"==e.source}).forEach(function(t){1==t.name.split("@").length&&(e[t.name]=t.keyMap)}),e},sceneName:function(){return{add:"新增",edit:"修改",view:"查看"}[this.formConf.mode]||"新增"}},watch:{formData:{handler:function(e){e&&(this.formConf=e,this.drawingList=e.fields)},deep:!0},formId:function(){this.initData(this.formId,this.buttonCode,this.ywid)},buttonCode:function(){this.initData(this.formId,this.buttonCode,this.ywid)},ywid:function(){this.initData(this.formId,this.buttonCode,this.ywid)}},created:function(){this.formData&&(this.formConf=this.formData,this.drawingList=this.formData.fields);
 // 调用修改后的方法，获取formId
 var e=this.getFormParamsFromUrl(),t=e.formId,n=e.buttonCode,i=e.ywid;t&&this.initData(t,n,i),this.formId&&this.initData(this.formId,this.buttonCode,this.ywid),t&&this.formId||console.warn("未从URL中获取到表单ID")},mounted:function(){},methods:{initData:function(e,t,n){var i,a,r=this;
 // 原有接口请求逻辑不变

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "app-form-view",
-  "version": "0.1.0",
+  "version": "0.1.1",
   "description": "vue表单组件库",
   "main": "dist/index.js",
   "publishConfig": {

package/src/assets/scss/app-form.scss

@@ -258,6 +258,9 @@ button[disabled]{
 .app-page{
     height:100%;
     overflow:hidden;
+    .app-page-wrap{
+        padding:15px;
+    }
     .bottom-btns{
         gap:15px;
         padding-left: 10px;
@@ -315,7 +318,7 @@ button[disabled]{
     }
     .sub-item-title{ background: #fff;border-bottom:none}
     .sub-item-title .title{
-        font-size: 16px;
+        font-size: 1rem;
                 font-weight: 600;
                 color: var(--title-text-color);
     }
@@ -324,7 +327,7 @@ button[disabled]{
 .last-cell-child{
     border-bottom-left-radius:10px;
     border-bottom-right-radius:10px;
-    margin-bottom: 10px;
+    margin-bottom: 15px;
     &.van-cell{
         padding-bottom: 10px;
         &:after{
@@ -335,8 +338,17 @@ button[disabled]{
 .first-cell-child{
     border-top-left-radius:10px;
     border-top-right-radius:10px;
-    margin-top: 10px;
+    margin-top: 15px;
 }
 .van-nav-bar .van-icon {
   color: var(--nav-bar-icon-color);
 }
+
+.sub-item-title {
+  padding: 15px 5px;
+  .title{
+     font-size: 1rem;
+                font-weight: 600;
+                color: var(--title-text-color);
+  }
+}

package/src/views/build/viewAppForm.vue

@@ -4,13 +4,12 @@
         <c-app-form :conf="formConf" ref="cform" :model="formConf.model || {}" :openType="openType"
             :singleUploadList="singleUploadList" :multiplySingleUploadList="multiplySingleUploadList"
             @updateItem="updateItem" class="app-form">
-            <div class="app-wrap scroll-wrap">
-                <div style="padding:15px">
-                    <app-form-item v-for="element in hiddenList" :key="element.renderKey" :element="element"
-                        :form-conf="formConf" @updateItem="updateItem" />
-                    <app-form-item v-for="element in filterDrawingList" :key="element.renderKey" :element="element"
-                        :form-conf="formConf" @updateItem="updateItem" />
-                </div>
+            <div class="app-page-wrap scroll-wrap">
+                <app-form-item v-for="element in hiddenList" :key="element.renderKey" :element="element"
+                    :form-conf="formConf" @updateItem="updateItem" />
+                <app-form-item v-for="element in filterDrawingList" :key="element.renderKey" :element="element"
+                    :form-conf="formConf" @updateItem="updateItem" />
+
             </div>
             <van-goods-action ref="detailBtns" v-if="formConf.buttons" class="bottom-btns">
                 <app-form-item v-for="element in formConf.buttons" :key="element.renderKey" :element="element"