ocpview-plus 0.0.1

package/src/components/tree/index.js

@@ -0,0 +1,3 @@
+import TreeBox from './treedata.vue';
+import TreeBoxBase from './treedatabase.vue';
+export {TreeBox,TreeBoxBase};

package/src/components/tree/treedata.vue

@@ -0,0 +1,51 @@
+<template>
+    <div>
+        <div ref="condition">
+        <Row v-if="showCondition">
+            <Col span='24'>
+                <ConditionBox ref="condition" :config="myConfig" :dictData="dictData"  @conditionAction="conditionAction" :isPop="isPop" modelType="treeSearch" > </ConditionBox>
+            </Col>
+        </Row>
+        </div>
+        <Row  class="customLayout" :style="style">
+            <Card v-show="showTree" :padding="0" :bordered="myConfig.bordered" :dis-hover="myConfig.disHover" style="width:100%;overflow-x:hidden">
+                <template v-if="myConfig.showTitle" #title>
+                <p>
+                    {{config.title}}
+                </p>
+                </template>  
+                <Tree ref="tree" :data="treeData" :class="myConfig.className" :show-checkbox="myConfig.showCheckBox"  @on-select-change="onSelectChange" @on-check-change="onCheckChange" @on-toggle-expand="onToggleExpand" :load-data="loadData"/>
+            </Card>
+            <ViewGrid v-show="!showTree" ref="grid"  :config="gridConfig"  :dictData="dictData" @dbclick="dbclick"/>
+          </Row>
+    </div>
+</template>
+<script>
+    import Base from '@/components/tree/treedatabase.vue';
+    import elementResizeDetectorMaker from 'element-resize-detector';
+    export default {
+        name:'treedata',
+        extends: Base,
+        mounted () {
+            this.observer = elementResizeDetectorMaker();
+            if (this.$refs.condition)  {
+                this.observer.listenTo(this.$refs.condition, this.setExtraHeight);
+            }
+           
+        },
+        beforeUnmount() {
+            if (this.$refs.condition) {
+                this.observer.removeListener(this.$refs.condition, this.setExtraHeight);
+            }
+            
+        }
+    };
+</script>
+
+<style>
+.customLayout{
+    OVERFLOW-Y: auto; 
+    /*background: url('./images/bg.jpg') no-repeat 4px 5px;*/
+}
+</style>
+

package/src/components/tree/treedatabase.vue

@@ -0,0 +1,189 @@
+<script>
+    import Base from '@/components/tree/basetree.vue';
+    export default {
+        name:'treedatabase',
+        extends: Base,
+        props:{
+            isPop: {
+                type: Boolean,
+                default:false
+            }
+        } ,
+        computed:{
+            style() {
+                let height = this.currentHeight;
+                if (this.extraHeight) {
+                    height =  height - Number(this.extraHeight);
+                }
+                if (this.outsideHeight) {
+                    height =  height - Number(this.outsideHeight);
+                }
+                return 'height:' + height + 'px';
+            }
+        
+        },
+        methods: {
+            customInit() {
+                if (this.myConfig.showCondition === undefined) {
+                    if (this.myConfig.items && this.myConfig.items.length >0) {
+                        let flag = false;
+                        this.myConfig.items.forEach(el=> {
+                            if (el.condition || el.conditionPrior) {
+                                flag = true;
+                                return;
+                            }
+                        });
+                        this.showCondition = flag;
+                    }
+                } else {
+                    this.showCondition = this.myConfig.showCondition;
+                }
+                if (this.isPop) {
+                    this.myConfig.showTitle = false;
+                }
+
+                if (this.myConfig.gridConfig) {
+                    this.gridConfig = Object.assign({}, this.gridConfig, this.myConfig.gridConfig);
+                }
+                if (this.myConfig.formConfig && this.myConfig.formConfig.items && this.myConfig.formConfig.items.length > 0) {
+                    if (!this.gridConfig.items || this.gridConfig.items.length === 0) {
+                        this.gridConfig.items = this.$Method.copy(this.myConfig.formConfig.items);
+                    }
+                    this.gridConfig.items.forEach(el => {
+                        if (el.tooltip === undefined) {
+                            el.tooltip = true;
+                        }
+                    });
+                    this.gridConfig.response = this.myConfig.response;
+                    this.gridConfig.method = this.myConfig.method;
+                    this.gridConfig.resources = this.myConfig.resources;
+                    if (this.myConfig.searchParam) {
+                        this.gridConfig.searchParam = this.myConfig.searchParam;
+                    }
+                    this.gridConfig.headStyle = '';
+                    if (this.gridConfig.height === undefined) {
+                        this.gridConfig.height = 360;
+                    }
+                    this.gridConfig.tableSize = 'small';
+                    this.gridConfig.showBorder = false;
+                    this.gridConfig.pageSize = 'small';
+                    this.gridConfig.pageShowElevator = false;
+                    this.gridConfig.pageShowTotal = false;
+                    this.gridConfig.pageShowSizer = false;
+                    if (this.myConfig.multiSelect !== undefined) {
+                        this.gridConfig.multiSelect = this.myConfig.multiSelect;
+                    } else {
+                        this.gridConfig.multiSelect = false;
+                    }
+                    if (this.gridConfig.pageSizeNum === undefined) {
+                        this.gridConfig.pageSizeNum = 50;
+                    }
+                    this.showGrid = true;
+                }
+                
+            },
+            getSearchParam(para) {
+                let searchParam = Object.assign({},this.myConfig.searchParam,this.searchBeforeSearchParam);
+                if (!searchParam) {
+                    searchParam = {};
+                }
+                if (this.myConfig.response === 'report') {
+                    searchParam = Object.assign({},searchParam,this.conditionSearchParam);
+                } else {
+                    let tempSearchParam = {};
+                    for (let el in searchParam) {
+                        if (this.conditionSearchParam[el]) {
+                            tempSearchParam[el]={'$and':[]}; 
+                            tempSearchParam[el]['$and'].push(searchParam[el]);
+                            tempSearchParam[el]['$and'].push(this.conditionSearchParam[el]);
+                        }
+                    }
+                    searchParam = Object.assign({},searchParam,this.conditionSearchParam);
+                    for (let el in tempSearchParam) {
+                        delete searchParam[el];
+                        searchParam['$and'] = el['$and'];
+                    }
+                }
+                if (para) {
+                    Object.assign(searchParam, para);
+                }
+                if (this.myConfig.overrideSearchParam) {
+                    return this.myConfig.overrideSearchParam(searchParam);
+                } else {
+                    return searchParam;
+                }
+            },
+            setWhereParam(para) {
+                this.conditionSearchParam = para;
+            },
+            gridRefurbish (obj) {
+                this.$refs.grid.clearSearchBeforeSearchParam();
+                this.$refs.grid.setSearchBeforeSearchParam(obj);
+                this.$refs.grid.refurbish();
+                this.$refs.grid.refurbish();
+            },
+            conditionAction(temp) {
+                let data=[];
+                switch (temp.action) {
+                    case 'condition_search' :
+                        if (JSON.stringify(temp.para) !== '{}') {
+                            if (this.showGrid) {
+                                this.showTree = false;
+                                this.gridRefurbish(temp.para);
+                            } else {
+                                this.conditionSearchParam = temp.para;
+                                this.refurbish();
+                            }
+                        } else {
+                            this.showTree = true;
+                            this.conditionSearchParam = {};
+                            this.refurbish();
+                        }
+                        break;
+                    case 'condition_clear' :
+                        this.conditionSearchParam = {};
+                        this.refurbish();
+                        break;
+                    case 'condition_ok' :
+                        data = this.getData();
+                        if (data.length === 0) {
+                            this.alert('请选择');
+                        } else {
+                            temp.rows = data;
+                            this.$emit('conditionAction',temp);
+                        }
+                        break;
+                    case 'condition_cancel' :
+                        this.$emit('conditionAction',temp);
+                        break;
+                }
+            },
+            getSelection() {
+                if (this.showTree) {
+                    return this.getData();
+                } else {
+                    return this.$refs.grid.getSelection();
+                }
+               
+            },
+            dbclick (e) {
+                let temp = {};
+                temp.action= 'condition_ok';
+                temp.rows = [];
+                temp.rows.push(e);
+                this.$emit('conditionAction',temp);
+            },
+            clearCondition() {
+                if (this.$refs.condition && this.$refs.condition.clear) {
+                    this.$refs.condition.clear();
+                }
+                this.conditionSearchParam = {};
+                this.showTree = true;
+                this.refurbish();
+
+            },
+        },
+    };
+</script>
+
+

package/src/components/upload/billimport.vue

@@ -0,0 +1,233 @@
+<style lang="less">
+    .vertical-center-modal{
+        display: flex;
+        align-items: center;
+        justify-content: center;
+
+        .ivu-modal{
+            top: 0;
+        }
+    }
+    .demo-spin-icon-load{
+        animation: ani-demo-spin 1s linear infinite;
+    }
+    @keyframes ani-demo-spin {
+        from { transform: rotate(0deg);}
+        50%  { transform: rotate(180deg);}
+        to   { transform: rotate(360deg);}
+    }
+    .demo-spin-col{
+        height: 100px;
+        position: relative;
+        border: 1px solid #eee;
+    }
+</style>
+<template>
+  <div >
+    <template v-if="modeltype==='upload'">
+    <Modal  title="上传文件" v-model="showUpload" class-name="vertical-center-modal" :footer-hide="true">
+        <div class="demo-spin-col">
+        <Row v-if="showType" type="flex" justify="center"  :gutter="4" style="margin-bottom: 20px">
+            <Col>
+                <RadioGroup v-model="type">
+                    <Radio v-for="(item,index) in myConfig.typeData" :key="index" :label="item.code">
+                        <span>{{item.name}}</span>
+                    </Radio>
+                </RadioGroup>
+            </Col>
+        </Row>
+        <Row type="flex" justify="center"  :gutter="4">
+            <Col>
+                <Button @click="upload">上传</Button>
+            </Col>
+             <Col>
+                <Poptip trigger="focus">
+                 <Input v-model="name" clearable readonly/>
+                    <template #content>
+                    <div>{{filename}}</div>
+                    </template>
+                </Poptip>   
+            </Col>
+            <Col>
+                 <Upload ref="upload"
+                    :before-upload="handleUpload"
+                    accept=".xlsx,.xls" 
+                    :format="myConfig.fileType"
+                    :on-format-error="handleFormatError"
+                    :on-success="handleSuccess"
+                    :show-upload-list="false"
+                    :action="url">
+                        <Button>浏览</Button>
+                        </Upload>
+            </Col>
+        </Row>
+         <Spin v-show="loading" fix>
+                <CommonIcon type="ios-loading" size="18" class="demo-spin-icon-load"></CommonIcon>
+                <div>导入中</div>
+        </Spin>
+        </div>
+    </Modal>
+    </template>
+    <template v-if="modeltype === 'down'">
+        <Modal v-model="showUpload" title="选择模版" @on-ok="downTemplate" class-name="vertical-center-modal">
+        <RadioGroup v-model="type">
+            <Radio v-for="(item,index) in myConfig.typeData" :key="index" :label="item.code">
+                    <span>{{item.name}}</span>
+            </Radio>
+        </RadioGroup>
+    </Modal>
+    </template>
+      
+  </div>
+</template>
+<script>
+    export default {
+        name:'billimport',
+        data () {
+            return {
+                myConfig:{
+                    typeData:[],
+                    fileType:['xlsx','xls']
+                },
+                file: null,
+                name:'',
+                type:'',
+                showType:false,
+                showUpload:false,
+                url:'',
+                modeltype:'upload',
+                param:{},
+                loading:false
+            };
+        },
+        props:{
+            config: {
+                type:Object,
+                default () {
+                    return {};
+                }
+            },
+        } ,
+        computed:{
+            filename(){
+                if (this.name) {
+                    return this.name;
+                } else {
+                    return '请选择Excel文件';
+                }
+            }
+        },
+        created () {
+            this.init();
+        },
+        methods: {
+            init () {
+                if (this.config) {
+                    let config = this.$Method.copy(this.config);
+                    for (let temp2 in this.myConfig) {
+                        if (config[temp2] !== undefined) {
+                            this.myConfig[temp2] = config[temp2];
+                        }
+                    }
+                    if (this.myConfig.typeData && this.myConfig.typeData.length > 0) {
+                        this.showType = true;
+                        this.type = this.myConfig.typeData[0].code;
+                    }
+                }
+            },
+            setModeltype(value) {
+                this.modeltype = value;
+            },
+            setShowUpload(flag) {
+                this.showUpload = flag;
+            },
+            setUrl(url,method,param) {
+                if (url) {
+                    url = url.replace('rest', 'import');
+                }
+                let self = this;
+                this.url = this.getResturl(url,method,{},self);
+                if (this.type) {
+                    param.billmoduleid =  param.billmoduleid+'_' +this.type;
+                }
+                if (this.myConfig.typeData.length > 1) {
+                    this.type = this.myConfig.typeData[0].code;
+                }
+                this.url = this.url+'&param=' +encodeURI(JSON.stringify(param));
+            },
+            setDownUrl(url,param) {
+                if (url) {
+                    url = url.replace('rest', 'exportTemplate');
+                }
+                let self = this;
+                this.url = this.getResturl(url,null,{},self);
+                if (this.myConfig.typeData.length > 1) {
+                    this.param = param;
+                    this.type = this.myConfig.typeData[0].code;
+                    this.showUpload = true;
+                } else {
+                    let temp  = this.url +'&param=' +encodeURI(JSON.stringify(param));
+                    window.open(temp,'_self');
+                } 
+            },
+            handleUpload (file) {
+                if (!this.checkFormat(file)) {
+                    this.handleFormatError(file);
+                    this.file = null;
+                    this.name = '';
+                    return false;
+                } else {
+                    this.file = file;
+                    this.name = file.name;
+                }
+                return false;
+            },
+            checkFormat(file) {
+                const _file_format = file.name.split('.').pop().toLocaleLowerCase();
+                const checked = this.myConfig.fileType.some(item => item.toLocaleLowerCase() === _file_format);
+                return checked;
+            },
+            upload () {
+                if (!this.name) {
+                    this.file = null;
+                }
+                if (this.file !== null) {
+                    this.loading = true;
+                    this.$refs.upload.post(this.file);
+                }
+            },
+            handleFormatError (file) {
+                let type = this.myConfig.fileType.join(',');
+                this.alert('文件[' + file.name + ']的格式不正确，请上传格式为(' + type + ')的文件');
+            },
+            handleSuccess(res) {
+                if (res && res.returncode !== '0') {
+                    this.showUpload = false;
+                    this.file = null;
+                    this.name = '';
+                    this.alert(res.data);
+                } else {
+                    this.alert(res.elapsed,'导入成功');
+                    this.showUpload = false;
+                    this.file = null;
+                    this.name = '';
+                    this.$emit('importSuccess',res);
+                }
+                this.loading = false;
+               
+            },
+            downTemplate() {
+                if (this.type) {
+                    let param = this.$Method.copy(this.param);
+                    if (param.billmoduleid) {
+                        param.billmoduleid =  param.billmoduleid + '_' + this.type;
+                        let temp  = this.url +'&param=' +encodeURI(JSON.stringify(param));
+                        window.open(temp,'_self');
+                        this.showUpload = false;
+                    }
+                    
+                }
+            }
+        }
+    };
+</script>

package/src/components/upload/index.js

@@ -0,0 +1,2 @@
+import BillImport from './billimport.vue';
+export default BillImport;

package/src/components/videobox/index.js

@@ -0,0 +1,2 @@
+import VideoBox from './videobox.vue';
+export default VideoBox;

package/src/components/videobox/uploadbox.vue

@@ -0,0 +1,148 @@
+<template>
+  <Upload
+    ref="upload"
+    :show-upload-list="false"
+    :default-file-list="defaultList"
+    :on-success="handleSuccess"
+    :format="myConfig.fileType"
+    :disabled="disabled"
+    :max-size="fileSize"
+    :data="headers"
+    :on-format-error="handleFormatError"
+    :on-exceeded-size="handleMaxSize"
+    :before-upload="handleBeforeUpload"
+    multiple
+    type="drag"
+    :class="uploadClass"
+    :action="uploadUrl"
+  >
+    <slot name="btn"></slot>
+  </Upload>
+</template>
+<script>
+export default {
+    name: 'uploadbox',
+    data() {
+        return {
+            defaultList: [],
+            fileSize: 2048,
+            myConfig: {},
+            uploadUrl: '',
+            disabled: false,
+        };
+    },
+    props: {
+        config: {
+            type: Object,
+            default: null,
+        },
+        headers: {
+            type: Object,
+            default: null,
+        },
+        readOnly:{
+            type:Boolean,
+            default:false
+        }
+    },
+    computed: {
+        uploadClass () {
+            if (this.disabled) {
+                return 'efuture-upload-disabled';
+            } else {
+                return '';
+            }
+        }
+    },
+    created() {
+        this.myConfig = Object.assign({}, this.myConfig, this.config);
+        if (this.myConfig.fileSize !== undefined) {
+            this.fileSize = 1024 * Number(this.myConfig.fileSize);
+        }
+        this.uploadUrl = this.myConfig.uploadfile;
+    },
+    methods: {
+        handleSuccess(res, file) {
+            if (res.data && res.data.length > 0) {
+                if (res.data[0].filekey) {
+                    file.filekey = res.data[0].filekey;
+                } else {
+                    if (res.data[0].fileKey) {
+                        file.filekey = res.data[0].fileKey;
+                    }
+                }
+            }
+
+            this.$emit('success', res);
+        },
+        handleFormatError(file) {
+            let type = this.myConfig.fileType.join(',');
+            this.alert('文件[' + file.name + ']的格式不正确，请上传格式为(' + type + ')的文件');
+        },
+        handleMaxSize(file) {
+            this.alert(
+        '文件[' +
+          file.name +
+          ']的文件大小不允许超过' +
+          this.myConfig.fileSize +
+          'M'
+      );
+        },
+        handleBeforeUpload() {
+            if (!this.myConfig.multiSelect) {
+                const check = this.$refs.upload.fileList.length < this.myConfig.fileNum;
+                if (!check) {
+                    this.alert('上传的文件数量过多，请先删除部分已上传文件再上传');
+                }
+                return check;
+            } else {
+                return true;
+            }
+        },
+        delFile(filekey) {
+            const index = this.$refs.upload.fileList.findIndex(el => el.filekey === filekey);
+            if (index > -1) {
+                this.$refs.upload.fileList.splice(index, 1);
+            }
+        },
+        onClick() {
+            let flag = true;
+            if (this.$parent.$parent.$parent.checkPara) {
+                flag = this.$parent.$parent.$parent.checkPara();
+            }
+            if (flag) {
+                if (this.config.onOpenChange) {
+                    this.config.onOpenChange(true);
+                }
+            }
+           
+            if (flag) {
+                if (this.$refs.upload.$refs && this.$refs.upload.$refs.input) {
+                     this.$refs.upload.$refs.input.click();
+                }
+            } 
+            return flag;
+        },
+    },
+    watch: {
+        config: {
+            handler(data) {
+                if (this.readOnly || data.readOnly) {
+                    this.disabled = true;
+                } else {
+                    this.disabled = false;
+                }
+            },
+            deep: true,
+            immediate: true,
+        },
+        readOnly(value) {
+            if (value || this.config.readOnly) {
+                this.disabled = true;
+            } else {
+                this.disabled = false;
+            }
+        }
+    },
+};
+</script>