ocpview-plus 1.3.15 → 1.3.17

package/src/components/grid/expandrow.vue

@@ -1,137 +1,137 @@
-<template> 
-<div  :style="style">
-    <Form ref="form" :model="form" :rules="formRules" :label-width="myConfig.labelWidth" :inline="myConfig.inline" :id="myConfig.name" @keydown.enter.prevent ="keyDownEvent">
-        <Row type="flex" justify="start">
-            <Col v-for="(item,index) in items"  :key="'form_' + index" :span="initFormItemCol(index)" v-show="item.visible !== false" :style="{height:item.height}" >
-                <FormItem  :label="item.label" :prop="item.name||item.sname"  style="width: 100%;" :show-message="false">
-                    <template #label>
-                    <span v-if="item.required === true" style="color:#348eed;">{{item.label}}</span>
-                    <span v-else>{{item.label}}</span>
-                    </template>
-                    <div @click="EditCell(item)" style="width: 100%;height:100%" >
-                        <ControlBox v-if="editKey=== item.name"   :config="item"  :valueData="form"  @inputValue="input" style="width:100%" :editIndex="editIndex" ></ControlBox>
-                        <ShowText v-else style="display:inline-block;height:32px;line-height:32px" :label="formatValue(form[item.name],form,item)" contentAlign="left" ></ShowText>
-                    </div>
-                </FormItem>
-            </Col>
-        </Row>
-    </Form>
-</div>
-</template>
-<script>
-    import Base from '@/components/form/baseform.vue';
-    export default {
-        extends: Base,
-        data (){
-            return {
-                editIndex: -1,
-                editKey:''
-            };
-        },
-        created () {
-            this.init();
-        },
-        props: {
-            valueData: {
-                type: Object,
-                default () {
-                    return {};
-                }
-            },
-            vstyle:{
-                type:String,
-                default:''
-            },
-            showRowAction:{
-                type: Boolean,
-                default:false
-            }
-        },
-        methods:{
-            customInit() {
-                this.form = Object.assign({},this.form,this.valueData);
-                this.style = this.vstyle;
-            },
-            keyDownEvent() {
-                this.cancelCellEditing();
-            },
-            formatValue(value , row, column) {
-                return this.$Method.formatValue(value ,row, column);
-            },
-
-            EditCell(config) {
-                if (config.readOnly) {
-                    this.editKey = '';
-                    this.cancelCellEditing();
-                    return;
-                }
-                if (this.showRowAction) {
-                    this.cancelCellEditing();
-                    return;
-                }
-                if (this.editKey === config.name) {
-                    return;
-                } 
-                if (this.config.cellbeginedit) {
-                    let rowinfo = {};
-                    rowinfo.index = this.editIndex;
-                    rowinfo.column = config;
-                    rowinfo.row = this.valueData;
-                    if (this.config.cellbeginedit) {
-                        if (!this.config.cellbeginedit(rowinfo)) {
-                            this.cancelCellEditing();
-                            return;
-                        } else {
-                            this.editKey = config.name;
-                        }
-                    }
-                } else {
-                    this.editKey = config.name;
-                }  
-            },
-            addRowInfo(obj,column) {
-                obj.rowinfo = {};
-                obj.rowinfo.column = column;
-                obj.rowinfo.index = this.editIndex;
-                obj.rowinfo.row = this.valueData;
-                obj.rowinfo.gridObject = this.config.getGridObject();
-                obj.rowinfo.formObject = this;
-            },
-            valueChanged(obj) {
-                const column = this.config.items.find(el => {return el.name === obj.name;});
-                this.addRowInfo(obj,column);
-                return column.valueChanged(obj);
-            },
-            searchBefore(obj) {
-                const column = this.config.items.find(el => {return el.name === obj.config.name;});
-                this.addRowInfo(obj,column);
-                return column.searchBefore(obj);
-            },
-            setDataBefore(obj,that) {
-                const column = this.config.items.find(el => {return el.name === that.myConfig.name;}) ;
-                let temp = {};
-                temp.data = obj;
-                this.addRowInfo(temp,column);
-                return column.setDataBefore(temp, that);
-            },
-            setEditIndex(value) {
-                this.editIndex = value;
-            },
-            getEditIndex() {
-                return this.editIndex;
-            },
-            cancelCellEditing() {
-                this.editKey = ''; 
-            }
-        },
-        watch:{
-            valueData: {
-                handler(data) {
-                    this.form = Object.assign({},this.form,data);
-                },
-                deep: true,
-                immediate: true,
-            }
-        }
-    };
-</script>
+<template> 
+<div  :style="style">
+    <Form ref="form" :model="form" :rules="formRules" :label-width="myConfig.labelWidth" :inline="myConfig.inline" :id="myConfig.name" @keydown.enter.prevent ="keyDownEvent">
+        <Row type="flex" justify="start">
+            <Col v-for="(item,index) in items"  :key="'form_' + index" :span="initFormItemCol(index)" v-show="item.visible !== false" :style="{height:item.height}" >
+                <FormItem  :label="item.label" :prop="item.name||item.sname"  style="width: 100%;" :show-message="false">
+                    <template #label>
+                    <span v-if="item.required === true" style="color:#348eed;">{{item.label}}</span>
+                    <span v-else>{{item.label}}</span>
+                    </template>
+                    <div @click="EditCell(item)" style="width: 100%;height:100%" >
+                        <ControlBox v-if="editKey=== item.name"   :config="item"  :valueData="form"  @inputValue="input" style="width:100%" :editIndex="editIndex" ></ControlBox>
+                        <ShowText v-else style="display:inline-block;height:32px;line-height:32px" :label="formatValue(form[item.name],form,item)" contentAlign="left" ></ShowText>
+                    </div>
+                </FormItem>
+            </Col>
+        </Row>
+    </Form>
+</div>
+</template>
+<script>
+    import Base from '@/components/form/baseform.vue';
+    export default {
+        extends: Base,
+        data (){
+            return {
+                editIndex: -1,
+                editKey:''
+            };
+        },
+        created () {
+            this.init();
+        },
+        props: {
+            valueData: {
+                type: Object,
+                default () {
+                    return {};
+                }
+            },
+            vstyle:{
+                type:String,
+                default:''
+            },
+            showRowAction:{
+                type: Boolean,
+                default:false
+            }
+        },
+        methods:{
+            customInit() {
+                this.form = Object.assign({},this.form,this.valueData);
+                this.style = this.vstyle;
+            },
+            keyDownEvent() {
+                this.cancelCellEditing();
+            },
+            formatValue(value , row, column) {
+                return this.$Method.formatValue(value ,row, column);
+            },
+
+            EditCell(config) {
+                if (config.readOnly) {
+                    this.editKey = '';
+                    this.cancelCellEditing();
+                    return;
+                }
+                if (this.showRowAction) {
+                    this.cancelCellEditing();
+                    return;
+                }
+                if (this.editKey === config.name) {
+                    return;
+                } 
+                if (this.config.cellbeginedit) {
+                    let rowinfo = {};
+                    rowinfo.index = this.editIndex;
+                    rowinfo.column = config;
+                    rowinfo.row = this.valueData;
+                    if (this.config.cellbeginedit) {
+                        if (!this.config.cellbeginedit(rowinfo)) {
+                            this.cancelCellEditing();
+                            return;
+                        } else {
+                            this.editKey = config.name;
+                        }
+                    }
+                } else {
+                    this.editKey = config.name;
+                }  
+            },
+            addRowInfo(obj,column) {
+                obj.rowinfo = {};
+                obj.rowinfo.column = column;
+                obj.rowinfo.index = this.editIndex;
+                obj.rowinfo.row = this.valueData;
+                obj.rowinfo.gridObject = this.config.getGridObject();
+                obj.rowinfo.formObject = this;
+            },
+            valueChanged(obj) {
+                const column = this.config.items.find(el => {return el.name === obj.name;});
+                this.addRowInfo(obj,column);
+                return column.valueChanged(obj);
+            },
+            searchBefore(obj) {
+                const column = this.config.items.find(el => {return el.name === obj.config.name;});
+                this.addRowInfo(obj,column);
+                return column.searchBefore(obj);
+            },
+            setDataBefore(obj,that) {
+                const column = this.config.items.find(el => {return el.name === that.myConfig.name;}) ;
+                let temp = {};
+                temp.data = obj;
+                this.addRowInfo(temp,column);
+                return column.setDataBefore(temp, that);
+            },
+            setEditIndex(value) {
+                this.editIndex = value;
+            },
+            getEditIndex() {
+                return this.editIndex;
+            },
+            cancelCellEditing() {
+                this.editKey = ''; 
+            }
+        },
+        watch:{
+            valueData: {
+                handler(data) {
+                    this.form = Object.assign({},this.form,data);
+                },
+                deep: true,
+                immediate: true,
+            }
+        }
+    };
+</script>

package/src/components/grid/index.js

@@ -1,6 +1,6 @@
-import ExpandRow from './expandrow.vue';
-import ViewGridBase from './viewgridbase.vue';
-import ViewGrid from './viewgrid.vue';
-import EditGrid from './editgrid.vue';
-import EditGridCard from './editgridcard.vue';
+import ExpandRow from './expandrow.vue';
+import ViewGridBase from './viewgridbase.vue';
+import ViewGrid from './viewgrid.vue';
+import EditGrid from './editgrid.vue';
+import EditGridCard from './editgridcard.vue';
 export {ExpandRow,EditGrid,ViewGridBase,ViewGrid,EditGridCard};

package/src/components/grid/viewgrid.vue

@@ -1,122 +1,122 @@
-<template>
-<div>
-    <div ref="head">
-    <div v-if="$slots.header" :style="myConfig.headStyle">
-        <slot name="header"></slot>
-    </div>
-    <div v-else :style="myConfig.headStyle">
-        <div v-if="showCondition">
-            <Row v-if="myConfig.gridType === 'billGrid'" :gutter="4">
-                <Col span='18'>
-                    <ConditionBox ref="condition" :config="myConfig"  @conditionAction="conditionAction"  :dictData="dictData" modelType="billSearch"></ConditionBox>
-                </Col>
-                <Col span='6'>
-                    <Row type="flex" justify="end" :gutter="8">
-                        <Col>
-                            <Toolbar :config="myToolConfig"  @doAction="doBatchAction" tooltype="batch" :moduleMethod="globalConfig.moduleMethod" ></Toolbar>
-                        </Col>
-                        <Col v-if="showHelpBtn">
-                            <a  href="#" @click.prevent="openHelp">
-                                <Tooltip content="帮助中心" placement="left">
-                                    <CommonIcon   size="32" color="#2d8cf0" type="md-help-circle" />
-                                </Tooltip>
-                            </a>
-                        </Col>
-                        <Col v-if="modulecode">
-                            <Tooltip :content="modulecode" placement="left">
-                                <CommonIcon size="32" color="#2d8cf0" type="ios-information-circle-outline" />
-                            </Tooltip>
-                        </Col>
-                    </Row>
-                </Col>
-            </Row>
-            <Row v-else>
-                <Col span='24'>
-                    <ConditionBox  ref="condition" :config="myConfig"  @conditionAction="conditionAction"  :dictData="dictData" :isPop="isPop"></ConditionBox>
-                </Col>
-            </Row>
-        </div>
-    </div>
-    </div>
-    <template v-if="!myConfig.multiSelectGrid">
-        <Table ref="table"  :row-class-name="myConfig.rowClassName" :loading="loading"  :show-summary="myConfig.showSummary"  :summary-method="handleSummary"  :size="myConfig.tableSize"  :stripe="myConfig.showStripe" :border="myConfig.showBorder" :height="tableHeight" :max-height="tableMaxHeight" :show-header="myConfig.showHeader" :columns="tableColumns"  :data="tempData" @on-sort-change="sortChagne"  @on-current-change="onCurrentChange" :highlight-row="myConfig.highLightRow" @on-row-dblclick="dbclick"  @on-select="onSelect" @on-select-cancel="onSelectCancel" @on-selection-change="OnSelectionChange" @on-row-click="click"  @on-column-width-resize="onColumnWidthResize">
-        <template  v-for="config in soltTableColumns" v-slot:[config.key]="{ index }" :key="'show_' + config.key">          
-               <ShowText :label="formatValue(index,config)"  :contentAlign="config.contentAlign" :rowIndex="index" ></ShowText>
-         </template>
-        </Table>
-         <div v-if="$slots.footer">
-            <slot name="footer"></slot>
-        </div>
-        <div ref="page" name="page">
-        <div  v-if="myConfig.showPage"  style="background:#eee;padding-top:5px;" >
-            <Card :bordered="false" :padding="0" :dis-hover="true" style="border-radius:0px">
-                 <Row  type="flex" justify="end" style="padding:5px;padding-right:10px">
-                     <Page v-model="culPage" :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>
-        </div>
-    </template>
-    <template v-else>
-        <Row type="flex" justify="center" align="middle" >
-            <Col :span="gridCol">
-                <Card :padding="0" :bordered="false">
-                    <template #title>
-                     <span  v-text="myConfig.gridTitle"></span>
-                    </template>
-                    <Table ref="table"  :row-class-name="myConfig.rowClassName"  :show-summary="myConfig.showSummary" :summary-method="handleSummary"  :loading="loading" :size="myConfig.tableSize"  :stripe="myConfig.showStripe" :border="myConfig.showBorder" :height="tableHeight" :max-height="tableMaxHeight" :show-header="myConfig.showHeader" :columns="tableColumns"  :data="tempData" @on-sort-change="sortChagne"  @on-current-change="onCurrentChange" :highlight-row="myConfig.highLightRow" @on-row-dblclick="dbclick"  @on-select="onSelect" @on-select-cancel="onSelectCancel" @on-selection-change="OnSelectionChange" @on-row-click="click" @on-column-width-resize="onColumnWidthResize">
-                         <template   v-for="config in soltTableColumns" v-slot:[config.key]="{ index }" :key="'show_' + config.key">  
-                            <ShowText  :label="formatValue(index,config)"  :contentAlign="config.contentAlign" :rowIndex="index"></ShowText>
-                         </template>
-                    </Table>
-                </Card>
-            </Col>
-            <Col span= '2'>
-                  <Row  type="flex" justify="center" align="middle" style="padding:5px;" >
-                        <Tooltip content="删除" placement="left">
-                           <Button type="primary" size="small"  icon="ios-arrow-back" :disabled="!rightActive" @click="moveToLeft"></Button>
-                        </Tooltip>
-                  </Row>
-                  <Row  type="flex" justify="center" align="middle" style="padding:5px;" >
-                       <Tooltip content="添加" placement="right">
-                            <Button type="primary" size="small"  icon="ios-arrow-forward" :disabled="!leftActive" @click="moveToRight"></Button>
-                        </Tooltip>
-                  </Row>
-            </Col>
-            <Col :span="multiGridCol">
-                <Card :padding="0" :bordered="false">
-                     <template #title>
-                     <span v-text="myConfig.multiGridTitle"></span>
-                     </template>
-                     <Table ref="multiSelectTable"  :row-class-name="myConfig.rowClassName"  :size="myConfig.tableSize"  :stripe="myConfig.showStripe" :border="myConfig.showBorder" :height="tableHeight" :max-height="tableMaxHeight" :show-header="myConfig.showHeader" :columns="multiTableColumns"  :data="tempMultiSelectData" :highlight-row="myConfig.highLightRow" @on-selection-change="OnMultiSelectionChange">
-                         <template   v-for="config in multiSoltTableColumns" v-slot:[config.key]="{ index }" :key="'show_' + config.key">  
-                            <ShowText  :label="formatMulValue(index,config)"  :contentAlign="config.contentAlign" ></ShowText>
-                         </template>
-                     </Table>
-                </Card>
-            </Col>
-        </Row>
-         <div ref="page" name="page">
-         <div v-if="$slots.footer">
-                <slot name="footer"></slot>
-        </div>
-        <div  v-if="myConfig.showPage" ref="page" style="background:#eee;padding-top:5px;">
-            <Card :bordered="false" :padding="0" :dis-hover="true"  style="border-radius:0px">
-                 <Row  type="flex" justify="start" style="padding:5px;padding-right:10px">
-                     <Page  v-model="culPage" :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>
-        </div>
-    </template> 
-</div>
-</template>
-<script>
-import Base from './viewgridbase.vue';
-export default {
-    name: 'viewgrid',
-    extends: Base,
-    mounted () {  
-    }
-};
+<template>
+<div>
+    <div ref="head">
+    <div v-if="$slots.header" :style="myConfig.headStyle">
+        <slot name="header"></slot>
+    </div>
+    <div v-else :style="myConfig.headStyle">
+        <div v-if="showCondition">
+            <Row v-if="myConfig.gridType === 'billGrid'" :gutter="4">
+                <Col span='18'>
+                    <ConditionBox ref="condition" :config="myConfig"  @conditionAction="conditionAction"  :dictData="dictData" modelType="billSearch"></ConditionBox>
+                </Col>
+                <Col span='6'>
+                    <Row type="flex" justify="end" :gutter="8">
+                        <Col>
+                            <Toolbar :config="myToolConfig"  @doAction="doBatchAction" tooltype="batch" :moduleMethod="globalConfig.moduleMethod" ></Toolbar>
+                        </Col>
+                        <Col v-if="showHelpBtn">
+                            <a  href="#" @click.prevent="openHelp">
+                                <Tooltip content="帮助中心" placement="left">
+                                    <CommonIcon   size="32" color="#2d8cf0" type="md-help-circle" />
+                                </Tooltip>
+                            </a>
+                        </Col>
+                        <Col v-if="modulecode">
+                            <Tooltip :content="modulecode" placement="left">
+                                <CommonIcon size="32" color="#2d8cf0" type="ios-information-circle-outline" />
+                            </Tooltip>
+                        </Col>
+                    </Row>
+                </Col>
+            </Row>
+            <Row v-else>
+                <Col span='24'>
+                    <ConditionBox  ref="condition" :config="myConfig"  @conditionAction="conditionAction"  :dictData="dictData" :isPop="isPop"></ConditionBox>
+                </Col>
+            </Row>
+        </div>
+    </div>
+    </div>
+    <template v-if="!myConfig.multiSelectGrid">
+        <Table ref="table"  :row-class-name="myConfig.rowClassName" :loading="loading"  :show-summary="myConfig.showSummary"  :summary-method="handleSummary"  :size="myConfig.tableSize"  :stripe="myConfig.showStripe" :border="myConfig.showBorder" :height="tableHeight" :max-height="tableMaxHeight" :show-header="myConfig.showHeader" :columns="tableColumns"  :data="tempData" @on-sort-change="sortChagne"  @on-current-change="onCurrentChange" :highlight-row="myConfig.highLightRow" @on-row-dblclick="dbclick"  @on-select="onSelect" @on-select-cancel="onSelectCancel" @on-selection-change="OnSelectionChange" @on-row-click="click"  @on-column-width-resize="onColumnWidthResize">
+        <template  v-for="config in soltTableColumns" v-slot:[config.key]="{ index }" :key="'show_' + config.key">          
+               <ShowText :label="formatValue(index,config)"  :contentAlign="config.contentAlign" :rowIndex="index" ></ShowText>
+         </template>
+        </Table>
+         <div v-if="$slots.footer">
+            <slot name="footer"></slot>
+        </div>
+        <div ref="page" name="page">
+        <div  v-if="myConfig.showPage"  style="background:#eee;padding-top:5px;" >
+            <Card :bordered="false" :padding="0" :dis-hover="true" style="border-radius:0px">
+                 <Row  type="flex" justify="end" style="padding:5px;padding-right:10px">
+                     <Page v-model="culPage" :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>
+        </div>
+    </template>
+    <template v-else>
+        <Row type="flex" justify="center" align="middle" >
+            <Col :span="gridCol">
+                <Card :padding="0" :bordered="false">
+                    <template #title>
+                     <span  v-text="myConfig.gridTitle"></span>
+                    </template>
+                    <Table ref="table"  :row-class-name="myConfig.rowClassName"  :show-summary="myConfig.showSummary" :summary-method="handleSummary"  :loading="loading" :size="myConfig.tableSize"  :stripe="myConfig.showStripe" :border="myConfig.showBorder" :height="tableHeight" :max-height="tableMaxHeight" :show-header="myConfig.showHeader" :columns="tableColumns"  :data="tempData" @on-sort-change="sortChagne"  @on-current-change="onCurrentChange" :highlight-row="myConfig.highLightRow" @on-row-dblclick="dbclick"  @on-select="onSelect" @on-select-cancel="onSelectCancel" @on-selection-change="OnSelectionChange" @on-row-click="click" @on-column-width-resize="onColumnWidthResize">
+                         <template   v-for="config in soltTableColumns" v-slot:[config.key]="{ index }" :key="'show_' + config.key">  
+                            <ShowText  :label="formatValue(index,config)"  :contentAlign="config.contentAlign" :rowIndex="index"></ShowText>
+                         </template>
+                    </Table>
+                </Card>
+            </Col>
+            <Col span= '2'>
+                  <Row  type="flex" justify="center" align="middle" style="padding:5px;" >
+                        <Tooltip content="删除" placement="left">
+                           <Button type="primary" size="small"  icon="ios-arrow-back" :disabled="!rightActive" @click="moveToLeft"></Button>
+                        </Tooltip>
+                  </Row>
+                  <Row  type="flex" justify="center" align="middle" style="padding:5px;" >
+                       <Tooltip content="添加" placement="right">
+                            <Button type="primary" size="small"  icon="ios-arrow-forward" :disabled="!leftActive" @click="moveToRight"></Button>
+                        </Tooltip>
+                  </Row>
+            </Col>
+            <Col :span="multiGridCol">
+                <Card :padding="0" :bordered="false">
+                     <template #title>
+                     <span v-text="myConfig.multiGridTitle"></span>
+                     </template>
+                     <Table ref="multiSelectTable"  :row-class-name="myConfig.rowClassName"  :size="myConfig.tableSize"  :stripe="myConfig.showStripe" :border="myConfig.showBorder" :height="tableHeight" :max-height="tableMaxHeight" :show-header="myConfig.showHeader" :columns="multiTableColumns"  :data="tempMultiSelectData" :highlight-row="myConfig.highLightRow" @on-selection-change="OnMultiSelectionChange">
+                         <template   v-for="config in multiSoltTableColumns" v-slot:[config.key]="{ index }" :key="'show_' + config.key">  
+                            <ShowText  :label="formatMulValue(index,config)"  :contentAlign="config.contentAlign" ></ShowText>
+                         </template>
+                     </Table>
+                </Card>
+            </Col>
+        </Row>
+         <div ref="page" name="page">
+         <div v-if="$slots.footer">
+                <slot name="footer"></slot>
+        </div>
+        <div  v-if="myConfig.showPage" ref="page" style="background:#eee;padding-top:5px;">
+            <Card :bordered="false" :padding="0" :dis-hover="true"  style="border-radius:0px">
+                 <Row  type="flex" justify="start" style="padding:5px;padding-right:10px">
+                     <Page  v-model="culPage" :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>
+        </div>
+    </template> 
+</div>
+</template>
+<script>
+import Base from './viewgridbase.vue';
+export default {
+    name: 'viewgrid',
+    extends: Base,
+    mounted () {  
+    }
+};
 </script>