ocpview-plus 1.3.15 → 1.3.16

package/src/components/grid/editgridcard.vue

@@ -1,193 +1,193 @@
-<template>
-<Card ref="card" :padding="0"  :bordered="myConfig.bordered" :dis-hover="myConfig.disHover" :headClass="headClass" :extraClass="extraClass" >
-    <template v-if="showTitle" #title>
-    <p  :style="pStyle" @click="toggle" >
-        <span :class="titleClass" v-text="myConfig.title" /><Icon v-if="myConfig.hide" class="efuture-title-icon" :style="iconStyle" type='ios-arrow-forward'/>
-    </p>
-    </template>
-    <template #extra>
-    <a   v-if="showBtn && myConfig.readOnly && myConfig.addBtnType === '3' && !btnReadOnly"  href="#" @click.prevent="editGrid">{{myConfig.editBtnName}} </a>
-    <span   v-if="showBtn && myConfig.readOnly && myConfig.addBtnType === '3' && btnReadOnly">{{myConfig.editBtnName}} </span>
-    <a   v-if="showBtn && !myConfig.readOnly && myConfig.addBtnType === '3'"  href="#" @click.prevent="cancelGrid">{{myConfig.cancelBtnName}} </a>
-    <a   v-if="showBtn && myConfig.addBtnType === '3' && !btnReadOnly" style="margin-left: 10px;"  href="#" @click.prevent="addRow">{{myConfig.addBtnName}} </a>
-    <span  v-if="showBtn && myConfig.addBtnType === '3' && btnReadOnly" style="margin-left: 10px;" >{{myConfig.addBtnName}}</span>
-    <a   v-if="showBtn && !myConfig.readOnly && myConfig.addBtnType === '1'"  href="#" @click.prevent="addRow">{{myConfig.addBtnName}} </a>
-     </template>
-    <div  v-show="showGrid" :style="cardStyle" >
-    <Row>
-    <Table ref="table" :loading="loading" :size="myConfig.tableSize"   :row-class-name="rowClassName" :stripe="myConfig.showStripe" :border="myConfig.showBorder" :height="tableHeight" :maxHeight="tableMaxHeight" :show-header="myConfig.showHeader" :columns="tableColumns" @on-selection-change="OnSelectionChange" :data="data" @on-column-width-resize="onColumnWidthResize" :show-summary="myConfig.showSummary"  :summary-method="handleSummary">
-         <template  v-for="config in soltTableColumns" v-slot:[config.key]="{ index }" :key="'show_' + config.key">
-            <div @click="EditCell(index,config)" class="ivu-table-cell">
-                <ControlBox v-if="editIndex === index && editKey=== config.key"  :config="getCellConfig(index,config)" :autofocus="true" :valueData="getCurRow(index)" @inputValue="input" :editIndex="index" @doAction="doAction"></ControlBox>
-                <ShowText v-else style="display:inline-block;" :label="formatValue(index,config)"  :contentAlign="config.contentAlign"  :class="IsCellError(index,config)" ></ShowText>
-            </div>
-         </template>
-    </Table>
-    <div  ref="page" v-if="myConfig.showPage" style="background:#eee;padding-top:5px;width:100%" >
-        <Card :bordered="false" :padding="0" :dis-hover="true" style="border-radius:0px">
-            <Row  type="flex" justify="end" style="padding:5px;padding-right:10px">
-                <Page  :total="myConfig.pageConfig.total_results"  :size="myConfig.pageSize"  :current="myConfig.pageConfig.page_no" :page-size="myConfig.pageConfig.page_size" :page-size-opts="myConfig.pageConfig.pageSizeList"  @on-page-size-change="changePageSize" @on-change="changePage"  :show-total="myConfig.pageShowTotal" :show-elevator="myConfig.pageShowElevator" :show-sizer="myConfig.pageShowSizer"></Page>
-            </Row>
-        </Card>
-    </div>
-    </Row>
-    <Row v-if="showBtn && !myConfig.readOnly && myConfig.addBtnType === '2'"  type="flex" justify="center" style="margin-top: 10px;margin-bottom:10px;" >
-      <Button type="default" style="background-color:#f8f8f9"  @click="addRow" long>{{myConfig.addBtnName}}</Button>
-    </Row>
-</div>
-</Card>
-</template>
-<script>
-import Base from './editgridbase.vue';
-export default {
-    name: 'editgridcard',
-    extends: Base,
-    data () {
-        return {
-            myConfig:{
-                addBtnType:'2',
-                hide:true,
-                titleType:1,
-                bordered:true,   
-                disHover:false,
-                operFixedFlag:false
-            },
-            btnReadOnly:false,
-            showBtn:true,
-            cardPadding:0,
-            cardStyle:'',
-            showGrid:true,
-            showTitle:true,
-            editFlag:false,
-            pStyle:'',
-            iconStyle:'',
-            showDelRow:true,
-            rowAction:[],
-            delRowAction:[{
-                iconcls: 'row',
-                icon:'ios-trash',
-                name: 'delRow',
-                text: '删除',
-                size:'20',
-                type:'text'
-            }],
-        };
-    },
-    computed: {
-        titleClass () {
-            return `efuture-title-font-${this.myConfig.titleType}`;
-        },
-        headClass () {
-            if (!this.showGrid) {
-                return `efuture-card-head-title-${this.myConfig.titleType}` + ' efuture-card-head-title-nobottom';
-            } else {
-                return `efuture-card-head-title-${this.myConfig.titleType}`;
-            }
-         
-        },
-        extraClass () {
-            return `efuture-card-extra-title-${this.myConfig.titleType}`;
-        }
-    },
-    methods: {
-        customInit2() {
-            if (this.myConfig.hide) {
-                this.pStyle = 'cursor:pointer';
-                this.iconStyle = 'transform: rotate(90deg)';
-            } 
-            if (this.myConfig.titleType !== 1) {
-                if (this.config.hide === undefined) {
-                    this.myConfig.hide = false;
-                }
-                if (this.config.bordered === undefined) {
-                    this.myConfig.bordered = false;
-                }
-                if (this.config.disHover === undefined) {
-                    this.myConfig.disHover = true;
-                }  
-            } else {
-                if (this.config.hide === undefined) {
-                    this.myConfig.hide = true;
-                }
-                if (this.config.bordered === undefined) {
-                    this.myConfig.bordered = true;
-                }
-                if (this.config.disHover === undefined) {
-                    this.myConfig.disHover = false;
-                }   
-            }
-            if (this.myConfig.showTitle !== undefined) {
-                this.showTitle = this.myConfig.showTitle;
-            }
-            if (this.myConfig.showBtn !== undefined) {
-                this.showBtn = this.myConfig.showBtn;
-            }
-            if (this.myConfig.showAddBtn !== undefined) {
-                this.showBtn = this.myConfig.showAddBtn;
-            }
-            this.myToolConfig.icon = true;
-            this.setTitleStyle();
-        },
-        toggle () {
-            if (this.myConfig.hide) {
-                this.showGrid = !this.showGrid;
-                this.setTitleStyle();
-            }
-        },
-        setShowGrid(value) {
-            this.showGrid = value;
-            this.setTitleStyle();
-        },
-        setTitleStyle () {
-            if (this.showGrid) {
-                this.iconStyle = 'transform: rotate(90deg)';
-                this.cardPadding =  5 * Number(this.myConfig.titleType);
-                this.cardStyle = 'padding-left:'+this.cardPadding+'px;padding-right:'+this.cardPadding+'px;padding-bottom: 10px;';
-            } else {
-                this.iconStyle = '';
-                this.cardPadding  = 0;
-                this.cardStyle = '';
-            }
-        },
-        editGrid() {
-            if (this.checkIsEdit()) {
-                this.setReadOnly(false);
-                let obj = {};
-                obj.name = 'editGrid';
-                obj.gridname = this.myConfig.name;
-                this.$emit('doAction', obj);
-            }
-        },
-        cancelGrid() {
-            this.setData(this.initData);
-            this.setReadOnly(true);
-            let obj = {};
-            obj.name = 'cancelGrid';
-            obj.gridname = this.myConfig.name;
-            this.$emit('doAction', obj);
-        },
-        checkIsEdit() {
-            let flag = true;
-            if (this.myConfig.editObjectBefore) {
-                flag = this.myConfig.editObjectBefore(this.myConfig.name);
-            }
-            return flag;
-        },
-        setBtnType(value) {
-            let obj = {};
-            obj.addBtnType = value;
-            this.setPro(obj);
-        },
-        setBtnReadOnly(value) {
-            this.btnReadOnly = value;
-        }
-    },
-    mounted() {
-        if (this.$refs.card && this.$refs.card.$el) {
-            this.$refs.card.$el.onmouseleave = () => {
-                this.handleOut();
-            };
-        }
-    }
-};
-</script>
+<template>
+<Card ref="card" :padding="0"  :bordered="myConfig.bordered" :dis-hover="myConfig.disHover" :headClass="headClass" :extraClass="extraClass" >
+    <template v-if="showTitle" #title>
+    <p  :style="pStyle" @click="toggle" >
+        <span :class="titleClass" v-text="myConfig.title" /><Icon v-if="myConfig.hide" class="efuture-title-icon" :style="iconStyle" type='ios-arrow-forward'/>
+    </p>
+    </template>
+    <template #extra>
+    <a   v-if="showBtn && myConfig.readOnly && myConfig.addBtnType === '3' && !btnReadOnly"  href="#" @click.prevent="editGrid">{{myConfig.editBtnName}} </a>
+    <span   v-if="showBtn && myConfig.readOnly && myConfig.addBtnType === '3' && btnReadOnly">{{myConfig.editBtnName}} </span>
+    <a   v-if="showBtn && !myConfig.readOnly && myConfig.addBtnType === '3'"  href="#" @click.prevent="cancelGrid">{{myConfig.cancelBtnName}} </a>
+    <a   v-if="showBtn && myConfig.addBtnType === '3' && !btnReadOnly" style="margin-left: 10px;"  href="#" @click.prevent="addRow">{{myConfig.addBtnName}} </a>
+    <span  v-if="showBtn && myConfig.addBtnType === '3' && btnReadOnly" style="margin-left: 10px;" >{{myConfig.addBtnName}}</span>
+    <a   v-if="showBtn && !myConfig.readOnly && myConfig.addBtnType === '1'"  href="#" @click.prevent="addRow">{{myConfig.addBtnName}} </a>
+     </template>
+    <div  v-show="showGrid" :style="cardStyle" >
+    <Row>
+    <Table ref="table" :loading="loading" :size="myConfig.tableSize"   :row-class-name="rowClassName" :stripe="myConfig.showStripe" :border="myConfig.showBorder" :height="tableHeight" :maxHeight="tableMaxHeight" :show-header="myConfig.showHeader" :columns="tableColumns" @on-selection-change="OnSelectionChange" :data="data" @on-column-width-resize="onColumnWidthResize" :show-summary="myConfig.showSummary"  :summary-method="handleSummary">
+         <template  v-for="config in soltTableColumns" v-slot:[config.key]="{ index }" :key="'show_' + config.key">
+            <div @click="EditCell(index,config)" class="ivu-table-cell">
+                <ControlBox v-if="editIndex === index && editKey=== config.key"  :config="getCellConfig(index,config)" :autofocus="true" :valueData="getCurRow(index)" @inputValue="input" :editIndex="index" @doAction="doAction"></ControlBox>
+                <ShowText v-else style="display:inline-block;" :label="formatValue(index,config)"  :contentAlign="config.contentAlign"  :class="IsCellError(index,config)" ></ShowText>
+            </div>
+         </template>
+    </Table>
+    <div  ref="page" v-if="myConfig.showPage" style="background:#eee;padding-top:5px;width:100%" >
+        <Card :bordered="false" :padding="0" :dis-hover="true" style="border-radius:0px">
+            <Row  type="flex" justify="end" style="padding:5px;padding-right:10px">
+                <Page  :total="myConfig.pageConfig.total_results"  :size="myConfig.pageSize"  :current="myConfig.pageConfig.page_no" :page-size="myConfig.pageConfig.page_size" :page-size-opts="myConfig.pageConfig.pageSizeList"  @on-page-size-change="changePageSize" @on-change="changePage"  :show-total="myConfig.pageShowTotal" :show-elevator="myConfig.pageShowElevator" :show-sizer="myConfig.pageShowSizer"></Page>
+            </Row>
+        </Card>
+    </div>
+    </Row>
+    <Row v-if="showBtn && !myConfig.readOnly && myConfig.addBtnType === '2'"  type="flex" justify="center" style="margin-top: 10px;margin-bottom:10px;" >
+      <Button type="default" style="background-color:#f8f8f9"  @click="addRow" long>{{myConfig.addBtnName}}</Button>
+    </Row>
+</div>
+</Card>
+</template>
+<script>
+import Base from './editgridbase.vue';
+export default {
+    name: 'editgridcard',
+    extends: Base,
+    data () {
+        return {
+            myConfig:{
+                addBtnType:'2',
+                hide:true,
+                titleType:1,
+                bordered:true,   
+                disHover:false,
+                operFixedFlag:false
+            },
+            btnReadOnly:false,
+            showBtn:true,
+            cardPadding:0,
+            cardStyle:'',
+            showGrid:true,
+            showTitle:true,
+            editFlag:false,
+            pStyle:'',
+            iconStyle:'',
+            showDelRow:true,
+            rowAction:[],
+            delRowAction:[{
+                iconcls: 'row',
+                icon:'ios-trash',
+                name: 'delRow',
+                text: '删除',
+                size:'20',
+                type:'text'
+            }],
+        };
+    },
+    computed: {
+        titleClass () {
+            return `efuture-title-font-${this.myConfig.titleType}`;
+        },
+        headClass () {
+            if (!this.showGrid) {
+                return `efuture-card-head-title-${this.myConfig.titleType}` + ' efuture-card-head-title-nobottom';
+            } else {
+                return `efuture-card-head-title-${this.myConfig.titleType}`;
+            }
+         
+        },
+        extraClass () {
+            return `efuture-card-extra-title-${this.myConfig.titleType}`;
+        }
+    },
+    methods: {
+        customInit2() {
+            if (this.myConfig.hide) {
+                this.pStyle = 'cursor:pointer';
+                this.iconStyle = 'transform: rotate(90deg)';
+            } 
+            if (this.myConfig.titleType !== 1) {
+                if (this.config.hide === undefined) {
+                    this.myConfig.hide = false;
+                }
+                if (this.config.bordered === undefined) {
+                    this.myConfig.bordered = false;
+                }
+                if (this.config.disHover === undefined) {
+                    this.myConfig.disHover = true;
+                }  
+            } else {
+                if (this.config.hide === undefined) {
+                    this.myConfig.hide = true;
+                }
+                if (this.config.bordered === undefined) {
+                    this.myConfig.bordered = true;
+                }
+                if (this.config.disHover === undefined) {
+                    this.myConfig.disHover = false;
+                }   
+            }
+            if (this.myConfig.showTitle !== undefined) {
+                this.showTitle = this.myConfig.showTitle;
+            }
+            if (this.myConfig.showBtn !== undefined) {
+                this.showBtn = this.myConfig.showBtn;
+            }
+            if (this.myConfig.showAddBtn !== undefined) {
+                this.showBtn = this.myConfig.showAddBtn;
+            }
+            this.myToolConfig.icon = true;
+            this.setTitleStyle();
+        },
+        toggle () {
+            if (this.myConfig.hide) {
+                this.showGrid = !this.showGrid;
+                this.setTitleStyle();
+            }
+        },
+        setShowGrid(value) {
+            this.showGrid = value;
+            this.setTitleStyle();
+        },
+        setTitleStyle () {
+            if (this.showGrid) {
+                this.iconStyle = 'transform: rotate(90deg)';
+                this.cardPadding =  5 * Number(this.myConfig.titleType);
+                this.cardStyle = 'padding-left:'+this.cardPadding+'px;padding-right:'+this.cardPadding+'px;padding-bottom: 10px;';
+            } else {
+                this.iconStyle = '';
+                this.cardPadding  = 0;
+                this.cardStyle = '';
+            }
+        },
+        editGrid() {
+            if (this.checkIsEdit()) {
+                this.setReadOnly(false);
+                let obj = {};
+                obj.name = 'editGrid';
+                obj.gridname = this.myConfig.name;
+                this.$emit('doAction', obj);
+            }
+        },
+        cancelGrid() {
+            this.setData(this.initData);
+            this.setReadOnly(true);
+            let obj = {};
+            obj.name = 'cancelGrid';
+            obj.gridname = this.myConfig.name;
+            this.$emit('doAction', obj);
+        },
+        checkIsEdit() {
+            let flag = true;
+            if (this.myConfig.editObjectBefore) {
+                flag = this.myConfig.editObjectBefore(this.myConfig.name);
+            }
+            return flag;
+        },
+        setBtnType(value) {
+            let obj = {};
+            obj.addBtnType = value;
+            this.setPro(obj);
+        },
+        setBtnReadOnly(value) {
+            this.btnReadOnly = value;
+        }
+    },
+    mounted() {
+        if (this.$refs.card && this.$refs.card.$el) {
+            this.$refs.card.$el.onmouseleave = () => {
+                this.handleOut();
+            };
+        }
+    }
+};
+</script>