ocpview-plus 1.0.13 → 1.0.14

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ocpview-plus",
-  "version": "1.0.13",
+  "version": "1.0.14",
   "title": "ocpviewPlus",
   "description": "A high quality Service UI components Library with Vue.js",
   "homepage": "",

package/src/components/grid/editgridbase.vue

@@ -21,6 +21,7 @@ export default {
                 labelWidth: 100,
                 showAddBtn: true,
                 showDelBatchBtn: true,
+                showZoom:false,
                 delBatchBtnName: '删除',
                 addBtnName: '新增',
                 editBtnName: '编辑',
@@ -30,6 +31,7 @@ export default {
             showAddBtn: true,
             showDelBatchBtn: true,
             showDelBtn: true,
+            showZoom:false,
             delBatchBtnName: '删除',
             addBtnName: '新增',
             showEditRowForm: false,
@@ -81,6 +83,9 @@ export default {
             if (this.myConfig.showDelBatchBtn !== undefined) {
                 this.showDelBatchBtn = this.myConfig.showDelBatchBtn;
             }
+            if (this.myConfig.showZoom !== undefined) {
+                this.showZoom = this.myConfig.showZoom;
+            }
 
             if (this.myConfig.showPage) {
                 this.myConfig.indexMethod = this.customIndexMethod;

package/src/components/masterplate/editgridcard.vue

@@ -14,11 +14,11 @@
                 <span class="efuture-title-verticalline"/><span style="font-size: 14px;font-weight:bold" v-text="myConfig.title" />
             </div>
         </template>
-        <div :style="divStyle">
+        <div class="table-wrapper" :class="{'is--maximize':showZoom && isFull}" :style="divStyle">
             <div v-if="$slots.header">
                 <slot name="header"></slot>
             </div>
-            <Row v-else v-show="showGrid" type="flex" justify="start"  align="middle" :gutter="0"  style="margin-bottom: 10px;">
+            <Row class-name="row-box" v-else v-show="showGrid" type="flex" justify="start"  align="middle" :gutter="0"  style="margin-bottom: 10px;">
                 <Col v-if="showAddBtn">
                     <Button  :style="btnStyle" customIcon="iconfont icon-custom-rowadd3"  type="text"  :disabled="myConfig.readOnly" @click="addRow" >添加</Button>
                 </Col>
@@ -26,7 +26,10 @@
                     <Divider  type="vertical"  style="margin: 0 6px 0 6px;"/>
                 </Col>
                 <Col v-if="showDelBatchBtn">
-                    <Button  :style="btnStyle" customIcon="iconfont icon-custom-rowdel3"  type="text" :disabled="myConfig.readOnly" @click="delBatchRow">删除</Button>
+                    <Button :style="btnStyle" customIcon="iconfont icon-custom-rowdel3"  type="text" :disabled="myConfig.readOnly" @click="delBatchRow">删除</Button>
+                </Col>
+                <Col class="col-align" v-if="showZoom">
+                    <Button type="ghost" shape="circle" :title="isFull ? '还原' : '全屏'" :customIcon="[isFull ? 'iconfont icon-custom-minimize' : 'iconfont icon-custom-fullscreen']" @click="setZoom"></Button>
                 </Col>
             </Row>
             <Row v-show="showGrid" >
@@ -84,6 +87,8 @@ export default {
             btnStyle:'padding-left:0px;padding-right:0px',
             divStyle:'padding-left:24px',
             showAddBtn:true,
+            showZoom: false,
+            isFull: false,
             showDelBatchBtn:true,
             showGrid:true,
             showTitle:true,
@@ -146,6 +151,12 @@ export default {
         setShowGrid(value) {
             this.showGrid = value;
         },
+        setShowZoom(value) {
+            this.showZoom = value;
+        },
+        setZoom() {
+            this.isFull = !this.isFull;
+        },
         rowClick(e) {
             if (this.showEffectValue) {
                 this.curlEffectData = [];
@@ -220,3 +231,25 @@ export default {
     }
 };
 </script>
+<style lang="less" scoped>
+    .table-wrapper{
+        transition: all .2s;
+        .row-box{
+            display: flex;
+        }
+        .col-align{
+            flex:1;
+            text-align: right;
+        }
+    }
+    .is--maximize{
+        padding:0.5em 1.5em;
+        position: fixed;
+        left: 0;
+        top: 0;
+        z-index: 999;
+        width: 100%;
+        height: 100%;
+        background-color: #fff;
+    }
+</style>

package/src/components/masterplate/formdetailtwo.vue

@@ -34,7 +34,7 @@
             <Divider v-show="showChildrenGrid" style="margin-bottom:10px;margin-top: 10px;"/>
             <EditGridCard v-show="showChildrenGrid" ref="grid"  :config="gridConfig" :dictData="dictData" >
                 <template #header>
-                <Row  type="flex" justify="start"  align="middle" :gutter="0"  style="margin-bottom: 10px;">
+                <Row type="flex" justify="start"  align="middle" :gutter="0"  style="margin-bottom: 10px;display: flex;">
                     <Col v-if="showAddBtn">
                         <Button customIcon="iconfont icon-custom-rowadd"  type="text" size="small" :disabled="btnReadOnly" @click="addRow" >添加</Button>
                     </Col>
@@ -44,6 +44,9 @@
                     <Col v-if="showDelBatchBtn">
                         <Button customIcon="iconfont icon-custom-rowdel" size="small" type="text" :disabled="btnReadOnly" @click="delRow">删除</Button>
                     </Col>
+                    <Col class="col-align" v-if="showZoom" style="flex:1;text-align: right;">
+                        <Button type="ghost" shape="circle" :customIcon="[isFull ? 'iconfont icon-custom-minimize' : 'iconfont icon-custom-fullscreen']" @click="setZoom"></Button>
+                    </Col>
                 </Row>
                 </template>
             </EditGridCard>
@@ -75,7 +78,9 @@ export default {
             btnReadOnly:false,
             showAddBtn:true,
             showDelBatchBtn:true,
-            showForm:true
+            showForm:true,
+            showZoom: false,
+            isFull: false,
         };
     },
     props:{
@@ -142,9 +147,12 @@ export default {
                 if (this.gridConfig.showAddBtn !== undefined) {
                     this.showAddBtn = this.gridConfig.showAddBtn;
                 }
-                 if (this.gridConfig.showDelBatchBtn !== undefined) {
+                if (this.gridConfig.showDelBatchBtn !== undefined) {
                     this.showDelBatchBtn = this.gridConfig.showDelBatchBtn;
                 }
+                if (this.gridConfig.showZoom !== undefined) {
+                    this.showZoom = this.gridConfig.showZoom;
+                }
                 this.gridConfig.addRowBefore = this.addRowBefore;
                 this.gridConfig.delRowBefore = this.delRowBefore;
                 this.showChildrenGrid = true;
@@ -333,6 +341,9 @@ export default {
         delRow() {
             this.$refs.grid.delBatchRow();
         },
+        setShowZoom() {
+           this.isFull = !this.isFull;
+        },
         delBatchRow() {
             let obj = {};
             obj.name = 'delRowData'

package/src/styles/common.less

@@ -72,4 +72,10 @@
     background:  #ccc;
 }
 
-
+.ivu-btn-ghost .iconfont{
+    font-size: 1.1em;
+    color: @text-color ;
+}
+.ivu-btn-ghost:hover .iconfont{
+    color: @primary-color;
+}

package/src/styles/components/iconfont/fonts/iconfont.less

@@ -1,9 +1,9 @@
 @font-face {
   font-family: "iconfont"; /* Project id 4464454 */
-  src: url('iconfont.woff2?t=1732177892909') format('woff2'),
-       url('iconfont.woff?t=1732177892909') format('woff'),
-       url('iconfont.ttf?t=1732177892909') format('truetype'),
-       url('iconfont.svg?t=1732177892909#iconfont') format('svg');
+  src: url('iconfont.woff2?t=1754970817331') format('woff2'),
+       url('iconfont.woff?t=1754970817331') format('woff'),
+       url('iconfont.ttf?t=1754970817331') format('truetype'),
+       url('iconfont.svg?t=1754970817331#iconfont') format('svg');
 }
 
 .iconfont {
@@ -14,6 +14,14 @@
   -moz-osx-font-smoothing: grayscale;
 }
 
+.icon-custom-fullscreen:before {
+  content: "\e670";
+}
+
+.icon-custom-minimize:before {
+  content: "\e671";
+}
+
 .icon-custom-qushitu:before {
   content: "\e7fa";
 }

package/src/styles/components/iconfont/fonts/iconfont.svg

@@ -14,6 +14,10 @@
     />
       <missing-glyph />
       
+      <glyph glyph-name="fullscreen" unicode="&#58992;" d="M852.48 782.222222h-144.725333a28.842667 28.842667 0 0 1-28.899556-28.928 28.842667 28.842667 0 0 1 28.899556-28.928h103.708444l-239.928889-239.928889a28.928 28.928 0 1 1 40.903111-40.903111l239.928889 239.928889v-103.822222a28.842667 28.842667 0 0 1 28.928-28.899556A28.842667 28.842667 0 0 1 910.222222 579.697778V724.366222A57.713778 57.713778 0 0 1 852.48 782.222222z m28.814222-565.077333a28.842667 28.842667 0 0 1-28.928-28.899556v-103.708444l-239.928889 239.928889a28.928 28.928 0 1 1-40.903111-40.903111l239.928889-239.928889h-103.822222a28.842667 28.842667 0 0 1-28.899556-28.928A28.842667 28.842667 0 0 1 707.697778-14.222222h144.696889C884.337778-14.222222 910.222222 11.662222 910.222222 43.633778v144.611555a28.842667 28.842667 0 0 1-28.928 28.899556z m-469.816889 107.349333l-239.872-239.900444V188.302222a28.814222 28.814222 0 0 1-28.899555 28.928A28.814222 28.814222 0 0 1 113.777778 188.273778v-144.668445C113.777778 11.662222 139.662222-14.222222 171.605333-14.222222h144.668445a28.814222 28.814222 0 0 1 28.928 28.928 28.814222 28.814222 0 0 1-28.928 28.899555H212.593778l239.872 239.900445a28.899556 28.899556 0 0 1 0 40.874666c-11.292444 11.377778-29.696 11.377778-40.96 0.113778zM212.622222 724.394667h103.708445a28.842667 28.842667 0 0 1 28.928 28.899555A28.814222 28.814222 0 0 1 316.302222 782.222222H171.633778C139.662222 782.222222 113.777778 756.337778 113.777778 724.394667v-144.668445a28.814222 28.814222 0 0 1 28.928-28.928 28.842667 28.842667 0 0 1 28.928 28.928V683.406222l239.928889-239.872a28.928 28.928 0 0 1 40.903111 40.874667L212.622222 724.394667z"  horiz-adv-x="1024" />
+      
+      <glyph glyph-name="minimize" unicode="&#58993;" d="M625.664 440.888889h142.279111a28.359111 28.359111 0 0 1 28.444445 28.444444 28.359111 28.359111 0 0 1-28.444445 28.444445h-101.973333l235.918222 235.889778a28.444444 28.444444 0 1 1-40.220444 40.220444L625.777778 537.969778V640.028444a28.359111 28.359111 0 0 1-28.444445 28.444445 28.359111 28.359111 0 0 1-28.416-28.444445V497.777778c-0.085333-31.402667 25.372444-56.860444 56.775111-56.860445zM597.333333 99.612444a28.359111 28.359111 0 0 1 28.444445 28.444445v101.973333l235.889778-235.918222a28.444444 28.444444 0 1 1 40.220444 40.220444L665.969778 270.222222h102.058666a28.359111 28.359111 0 0 1 28.444445 28.444445 28.359111 28.359111 0 0 1-28.444445 28.416H625.777778A56.888889 56.888889 0 0 1 568.888889 270.222222v-142.165333a28.359111 28.359111 0 0 1 28.444444-28.444445z m-434.915555-105.528888L398.222222 229.944889V128a28.330667 28.330667 0 0 1 28.444445-28.444444A28.330667 28.330667 0 0 1 455.111111 128v142.250667A56.888889 56.888889 0 0 1 398.250667 327.111111h-142.222223a28.330667 28.330667 0 0 1-28.444444-28.444444 28.330667 28.330667 0 0 1 28.444444-28.416h101.916445L122.112 34.417778a28.444444 28.444444 0 0 1 0-40.192 28.444444 28.444444 0 0 1 40.277333-0.113778zM357.888 497.777778H256a28.359111 28.359111 0 0 1-28.444444-28.444445 28.330667 28.330667 0 0 1 28.444444-28.416H398.222222A56.888889 56.888889 0 0 1 455.111111 497.749333v142.222223a28.330667 28.330667 0 0 1-28.444444 28.444444 28.359111 28.359111 0 0 1-28.444445-28.444444v-101.916445L162.360889 773.888a28.444444 28.444444 0 0 1-40.220445-40.192l235.804445-235.946667z"  horiz-adv-x="1024" />
+      
       <glyph glyph-name="qushitu" unicode="&#59386;" d="M45 852c24.852 0 45-20.147 45-45v-801H979.09c24.853 0 45-20.147 45-45s-20.147-45-45-45H45c-24.853 0-45 20.147-45 45V807c0 24.853 20.147 45 45 45z m887.199-232.556c18.47-16.629 19.963-45.082 3.335-63.553L683.22 275.631c-17.235-19.145-46.993-19.942-65.228-1.747L466.877 424.67 267.625 201.993c-16.407-18.336-44.454-20.067-62.983-4.02l-0.56 0.492c-18.52 16.573-20.1 45.021-3.527 63.542l230.937 258.086c17.214 19.237 47.047 20.08 65.32 1.848l151.216-150.887 220.618 245.055c16.629 18.47 45.082 19.963 63.553 3.335z"  horiz-adv-x="1024" />
       
       <glyph glyph-name="shu-biaoji" unicode="&#59385;" d="M18.962963 896h991.049357L765.321232 528.218324l244.692086-367.781677H138.729045v-288.436647H18.962963V896z m264.483431-113.777778H138.729045v-496.031189h144.717349V782.222222z m503.031516 0H418.183236v-496.031189h368.294674l-165.007719 248.015595L786.47791 782.222222z"  horiz-adv-x="1024" />