ocpview-pro 0.0.3 → 0.0.4

package/package.json

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

package/src/components/masterplate/RewriteBillListDetails/BillInfoPanel.vue

@@ -74,6 +74,22 @@
                         :dictData="dictData"
                         @doAction="doAction"
                     />
+                    <BillInfoPanelSlotPanel
+                        v-if="temp2.type === 'SlotPanelCard'"
+                        :ref="temp2.name"
+                        :config="temp2"
+                        :dictData="dictData"
+                        @doAction="doAction"
+                    >
+                        <!-- 组件原始slot透传 -->
+                        <template
+                            v-for="(_, name) in $slots"
+                            #[name]="slotData"
+                        >
+                            <slot :name="name" v-bind="slotData || {}"></slot>
+                        </template>
+                        <!-- ============================ -->
+                    </BillInfoPanelSlotPanel>
                     <DetailsBoxs
                         v-if="temp2.type === 'DetailsBox'"
                         :ref="temp2.name"
@@ -102,11 +118,12 @@
 <script>
 import billdetailform from "../billdetailform.vue";
 import BillInfoPanelEditTable from "./BillInfoPanelEditTable.vue";
+import BillInfoPanelSlotPanel from "./BillInfoPanelSlotPanel.vue";
 
 export default {
     name: "BillInfoPanel",
     extends: billdetailform,
-    components: { BillInfoPanelEditTable },
+    components: { BillInfoPanelEditTable, BillInfoPanelSlotPanel },
     data() {
         return {};
     },
@@ -174,6 +191,122 @@ export default {
             }
             return flag;
         },
+        /**
+         * 覆写设置明细数据
+         */
+        setData(data) {
+            this.myConfig.formsConfig.items.forEach((el) => {
+                if (this.$refs[el.name] && this.$refs[el.name][0]) {
+                    this.$refs[el.name][0].setData(data);
+                }
+            });
+            if (this.detailConfig.items) {
+                this.detailConfig.items.forEach((el) => {
+                    if (data[el.name]) {
+                        if (this.$refs[el.name] && this.$refs[el.name][0]) {
+                            if (el.type === "DetailsBox") {
+                                let tempDetailData = this.setDetailsBox(
+                                    el,
+                                    data
+                                );
+                                this.$refs[el.name][0].setData(tempDetailData);
+                            } else {
+                                if (
+                                    el.type === "FormCardBox" ||
+                                    el.type === "FormCardBox2"
+                                ) {
+                                    if (data[el.name].length > 0) {
+                                        this.$refs[el.name][0].setData(
+                                            data[el.name][0]
+                                        );
+                                    } else {
+                                        this.$refs[el.name][0].clearData();
+                                    }
+                                } else {
+                                    this.$refs[el.name][0].setData(
+                                        data[el.name]
+                                    );
+                                }
+                            }
+                        }
+                    } else {
+                        if (this.config.response === el.name) {
+                            if (
+                                el.type === "FormCardBox" ||
+                                el.type === "FormCardBox2"
+                            ) {
+                                let temp = {};
+                                if (el.items) {
+                                    el.items.forEach((el2) => {
+                                        if (el2.name) {
+                                            temp[el2.name] = data[el2.name];
+                                        }
+                                        if (el2.sname) {
+                                            temp[el2.sname] = data[el2.sname];
+                                        }
+                                        if (el2.ename) {
+                                            temp[el2.ename] = data[el2.ename];
+                                        }
+                                        if (el2.textName) {
+                                            temp[el2.textName] =
+                                                data[el2.textName];
+                                        }
+                                    });
+                                }
+                                this.$refs[el.name][0].setData(temp);
+                            }
+                            // ==============================================
+                            // SlotPanelCard 插槽数据赋值 覆写
+                            if (el.type === "SlotPanelCard") {
+                                this.$refs[el.name][0].setData(data);
+                            }
+                            // ==============================================
+                        } else {
+                            if (
+                                el.type !== "AppendixBox" ||
+                                el.type !== "AppendixBox2"
+                            ) {
+                                if (
+                                    this.$refs[el.name] &&
+                                    this.$refs[el.name][0]
+                                ) {
+                                    this.$refs[el.name][0].setData([]);
+                                }
+                            }
+                        }
+                    }
+                });
+            }
+            if (this.billAppendixConfig.showAppendix) {
+                if (
+                    this.$refs.detail_appenndix &&
+                    this.$refs.detail_appenndix[0]
+                ) {
+                    let billno = data[this.billAppendixConfig.appendixKey];
+                    let billmoduleid = data.billmoduleid;
+                    this.$refs.detail_appenndix[0].setData(
+                        billno,
+                        billmoduleid
+                    );
+                }
+            } else if (this.billAppendixConfig.showAppendix2) {
+                if (
+                    this.$refs.detail_appenndix2 &&
+                    this.$refs.detail_appenndix2[0]
+                ) {
+                    let billno = data[this.billAppendixConfig.appendixKey];
+                    let billmoduleid = data.billmoduleid;
+                    this.$refs.detail_appenndix2[0].setData(
+                        billno,
+                        billmoduleid
+                    );
+                }
+            }
+            this.$nextTick(() => {
+                this.resetAnchor();
+                this.curlEditObject = "";
+            });
+        },
     },
     mounted() {
         // console.log("我继承覆写了8888");

package/src/components/masterplate/RewriteBillListDetails/BillInfoPanelSlotPanel.vue

@@ -0,0 +1,139 @@
+<template>
+    <Card ref="card" :bordered="false" :padding="0" dis-hover>
+        <!-- 如果myConfig.modetype为1，则显示 -->
+        <template v-if="myConfig.modetype === '1'">
+            <!-- 如果showTitle为true，则显示 -->
+            <p v-if="showTitle" @click="toggle" style="cursor: pointer">
+                <Row
+                    type="flex"
+                    justify="start"
+                    align="middle"
+                    style="margin-top: 14px; margin-bottom: 14px"
+                >
+                    <!-- 如果showGrid为true，则显示icon-custom-pack，否则显示icon-custom-spread -->
+                    <Icon
+                        custom="iconfont icon-custom-pack"
+                        color="#f3b352"
+                        v-show="showGrid"
+                        size="14"
+                    />
+                    <Icon
+                        v-show="!showGrid"
+                        color="#f3b352"
+                        custom="iconfont icon-custom-spread"
+                        size="14"
+                    />
+                    <!-- 显示myConfig.title -->
+                    <span
+                        style="
+                            margin-left: 10px;
+                            font-size: 14px;
+                            font-weight: bold;
+                        "
+                        v-text="myConfig.title"
+                    />
+                </Row>
+            </p>
+            <!-- 显示分割线 -->
+            <Divider
+                style="margin-left: 24px; margin-top: 0px; margin-bottom: 10px"
+            />
+        </template>
+
+        <!-- 如果myConfig.modetype为2，则显示 -->
+        <template v-if="myConfig.modetype === '2'">
+            <div v-if="showTitle" style="margin-bottom: 10px">
+                <span class="efuture-title-verticalline" /><span
+                    style="font-size: 14px; font-weight: bold"
+                    v-text="myConfig.title"
+                />
+            </div>
+        </template>
+
+        <!-- 插槽相关面板 -->
+        <div v-show="showGrid">
+            <slot
+                v-if="$slots[myConfig.slot]"
+                :name="myConfig.slot"
+                :formData="formData"
+                :config="config"
+                :dictData="dictData"
+                :doAction="doAction"
+                :dataInfo="dataInfo"
+            ></slot>
+        </div>
+    </Card>
+</template>
+<script>
+export default {
+    name: "BillInfoPanelSlotPanel",
+    components: {},
+    props: {
+        config: {
+            type: Object,
+            default: () => {
+                return {};
+            },
+        },
+        dictData: {
+            type: Object,
+            default: null,
+        },
+    },
+    data() {
+        return {
+            myConfig: {
+                modetype: "1",
+            },
+            showGrid: true,
+            showTitle: true,
+            dataInfo: {},
+        };
+    },
+    computed: {},
+    methods: {
+        init() {
+            this.myConfig = Object.assign({}, this.config);
+        },
+        toggle() {
+            this.showGrid = !this.showGrid;
+        },
+
+        /**
+         * 设置数据
+         */
+        setData(data = [], flag = "set") {
+            console.log("🚀 ~ setData ~ data:", data);
+            this.dataInfo = data;
+            // switch (flag) {
+            //     case "set":
+            //         // console.log("初始化表格数据触发");
+            //         // this.dataList = [...data];
+            //         break;
+
+            //     case "I":
+            //         // console.log("手工全量编辑触发");
+            //         break;
+
+            //     default:
+            //         break;
+            // }
+        },
+        clearData() {},
+        setReadOnly(value) {
+            console.log("🚀 ~ setReadOnly ~ value:", value);
+        },
+        doAction(params) {
+            this.$emit("doAction", params);
+        },
+    },
+    mounted() {
+        // console.log("我继承覆写了999999");
+    },
+    created() {
+        this.init();
+    },
+};
+</script>
+
+<style lang="scss" scoped></style>

package/src/components/masterplate/RewriteBillListDetails/BillListPanel.vue

@@ -4,7 +4,7 @@
             :padding="0"
             dis-hover
             :bordered="false"
-            style="background: #fff; padding: 14px 16px 14px 16px"
+            style="background: #fafcff; padding: 14px 16px 14px 16px"
         >
             <div ref="toolbar" style="padding-bottom: 14px">
                 <BillListPanelQueryBar
@@ -68,7 +68,13 @@
                     :config="changeGridConfig"
                     :dictData="dictData"
                     @dbclick="dbclick"
-                />
+                >
+                    <!-- 组件原始slot透传 -->
+                    <template v-for="(_, name) in $slots" #[name]="slotData">
+                        <slot :name="name" v-bind="slotData || {}"></slot>
+                    </template>
+                    <!-- ============================ -->
+                </BillListPanelTable>
             </Card>
         </Card>
     </div>
@@ -76,7 +82,8 @@
 <script>
 import billquerygrid from "../billquerygrid.vue";
 import BillListPanelTable from "./BillListPanelTable.vue";
-import BillListPanelQueryBar from "./BillListPanelQueryBar.vue";
+// import BillListPanelQueryBar from "./BillListPanelQueryBar.vue";
+import BillListPanelQueryBar from "../RewriteListdetails/BillListPanelV3QueryBar.vue";
 
 export default {
     name: "BillListPanel",

package/src/components/masterplate/RewriteBillListDetails/BillListPanelTable.vue

@@ -32,6 +32,11 @@
                     <template #loading>
                         <Spin size="large" style="display: inline-block"></Spin>
                     </template>
+                    <!-- 组件原始slot透传 -->
+                    <template v-for="(_, name) in $slots" #[name]="slotData">
+                        <slot :name="name" v-bind="slotData || {}"></slot>
+                    </template>
+                    <!-- ============================ -->
                 </vxe-grid>
                 <!-- 表格覆写点结束 -->
             </Card>
@@ -263,6 +268,12 @@ export default {
                     ...(item.resizable && {
                         resizable: item.resizable,
                     }),
+                    ...(item.fixed && {
+                        fixed: item.fixed,
+                    }),
+                    ...(item.slots && {
+                        slots: item.slots,
+                    }),
                     sortable: true,
                     ...(columnsItemType && {
                         type: columnsItemType,

package/src/components/masterplate/RewriteBillListDetails/index.vue

@@ -8,7 +8,13 @@
             :dictData="dictData"
             :moduleMethod="moduleMethod"
             @doAction="doAction"
-        />
+        >
+            <!-- 组件原始slot透传 -->
+            <template v-for="(_, name) in $slots" #[name]="slotData">
+                <slot :name="name" v-bind="slotData || {}"></slot>
+            </template>
+            <!-- ============================ -->
+        </BillListPanel>
         <!-- 列表覆写结束 -->
 
         <!-- 详情覆写开始 -->
@@ -37,6 +43,11 @@
                     <Divider style="margin-top: 16px; margin-bottom: 0px" />
                 </Card>
             </template>
+            <!-- 组件原始slot透传 -->
+            <template v-for="(_, name) in $slots" #[name]="slotData">
+                <slot :name="name" v-bind="slotData || {}"></slot>
+            </template>
+            <!-- ============================ -->
         </BillInfoPanel>
         <!-- 详情覆写结束 -->
 
@@ -317,7 +328,10 @@ export default {
         },
         onSubmitBefore() {
             let flag = true;
-            if (this.$parent && typeof this.$parent.onSubmitBefore === 'function') {
+            if (
+                this.$parent &&
+                typeof this.$parent.onSubmitBefore === "function"
+            ) {
                 flag = this.$parent.onSubmitBefore();
             }
             return flag;

package/src/components/masterplate/RewriteListdetails/BillListPanelV3QueryBar.vue

@@ -94,6 +94,16 @@
                                         @click="addData"
                                         >新增</Button
                                     >
+                                    <Button
+                                        v-if="
+                                            !addDataBtnFlag &&
+                                            btnData.length > 0
+                                        "
+                                        :icon="btnData[0].icon"
+                                        :customIcon="btnData[0].customIcon"
+                                        @click="action(btnData[0].name)"
+                                        >{{ btnData[0].text }}</Button
+                                    >
                                     <Button
                                         v-if="!btnFlag && moreBtnFlag"
                                         icon="ios-arrow-down"

package/src/components/masterplate/billconditionbox.vue

@@ -1,4 +1,4 @@
-<template> 
+<template>
 <div style="display: flex; align-items: center;">
     <Icon custom="iconfont icon-custom-delcond" @click.stop="doDel" size="20" color="#515a6e" style="cursor:pointer;margin-bottom:10px;padding-right:8px"/>
     <FormBox ref="form" :config="form"  @inputValue="formChanged" style="flex:1"/>
@@ -78,7 +78,7 @@
                 default:null
             }
         } ,
-        mounted () {  
+        mounted () {
             this.$nextTick(() => {
                 if (this.valueData) {
                     if (this.valueData.field){
@@ -97,7 +97,7 @@
                 let obj = {};
                 obj.index = this.curIndex;
                 obj.form  = this.$refs.form.getData();
-                this.$emit('inputValue', obj);   
+                this.$emit('inputValue', obj);
             },
             init() {
                this.initField();
@@ -106,7 +106,7 @@
                 let fieldData = [];
                 if (this.config.items && this.config.items.length > 0) {
                     this.config.items.forEach(el => {
-                        if (el.name && el.label) {
+                        if (el.name && el.label && el.condition) {
                             fieldData.push({code:el.name,name:el.label});
                             this.dataType[el.name] = Object.assign({},el, {name:'value'});
                             this.dataType[el.name].operData = this.getOperData(el);
@@ -142,7 +142,7 @@
                         name: '不等于',
                         code: '<>'
                     });
-                } 
+                }
                 if (el.type === 'TextBox') {
                     tempData.push({
                         name: '不等于',
@@ -152,11 +152,11 @@
                         name: '包含',
                         code: 'LIKE'
                     });
-                } 
+                }
                 if (el.setOperData) {
                     tempData =  el.setOperData(el,tempData);
                 }
-                return tempData; 
+                return tempData;
             },
             fieldChanged(e) {
                 let self = this;
@@ -169,7 +169,7 @@
                     oper.data = this.$Method.copy(config.operData);
                     oper.readOnly = false;
                     obj.push(oper);
-                    config.name ='value'; 
+                    config.name ='value';
                     config.label = '';
                     config.readOnly = false;
                     config.visible = true;
@@ -200,8 +200,8 @@
                 }
                 self.$refs.form.updateItemsConfig(obj);
                 self.$nextTick(() => {
-                    self.$refs.form.setValue('oper',operValue); 
-                    self.$refs.form.setValue('value',''); 
+                    self.$refs.form.setValue('oper',operValue);
+                    self.$refs.form.setValue('value','');
                 });
                 return true;
             },
@@ -221,4 +221,4 @@
             }
         }
     };
-</script>
+</script>

package/src/components/masterplate/layouttemplate.vue

@@ -1,51 +1,116 @@
 <template>
-<div>
-   <component ref="layout" :is="uiLayoutType" :config="uiconfig" :dictData="globalConfig.dictData" :moduleMethod="globalConfig.userModuleMethod" @handleSuccessAfter="handleSuccessAfter" @onSubmitBefore="onSubmitBefore" @doAction="doAction" />
-   <Modal title="附件" v-model="showDetailAppendix" :width="appendixCurrentWidth" :footer-hide="true">
-        <AppendixBoxs v-if="detalAppendixFlag" ref="detailappendix" :config="billDetailAppendixConfig"  @doAction="doAction"/>
-    </Modal>
-    <Modal title="模版打印" v-model="showPrintMode" :width="appendixCurrentWidth" :footer-hide="true" :fullscreen="true" class-name="print-bill-panel-modal">
-         <iframe ref="iframetemplate" v-if="printModeReset" :src="printModeUrl"  width="100%"  height="100%" allowtransparency="true" frameborder="0"  ></iframe>
-    </Modal>
-    <BillAsyncImport v-if="importReset" ref="billAsyncImport"  :config="billAsyncImportConfig"  />
-    <BillImport v-if="importReset" ref="billImport" :config="billImportConfig"> </BillImport>
-    <Modal title="合同模版" v-model="ContractModalShowType" :width="ContractModalWidth" :mask-closable="false" :footer-hide="true" class-name="contract-print-panel-modal" @on-cancel="HideContractPrintModal">
-         <iframe ref="iframetemplate" v-if="ContractModalContentShowType" :src="ContractModalIframeUrl"  width="100%"  height="100%" allowtransparency="true" frameborder="0"  ></iframe>
-    </Modal>
-</div>
+    <div>
+        <component
+            ref="layout"
+            :is="uiLayoutType"
+            :config="uiconfig"
+            :dictData="globalConfig.dictData"
+            :moduleMethod="globalConfig.userModuleMethod"
+            @handleSuccessAfter="handleSuccessAfter"
+            @onSubmitBefore="onSubmitBefore"
+            @doAction="doAction"
+        >
+            <!-- 组件原始slot透传 -->
+            <template v-for="(_, name) in $slots" #[name]="slotData">
+                <slot :name="name" v-bind="slotData || {}"></slot>
+            </template>
+            <!-- ============================ -->
+        </component>
+        <Modal
+            title="附件"
+            v-model="showDetailAppendix"
+            :width="appendixCurrentWidth"
+            :footer-hide="true"
+        >
+            <AppendixBoxs
+                v-if="detalAppendixFlag"
+                ref="detailappendix"
+                :config="billDetailAppendixConfig"
+                @doAction="doAction"
+            />
+        </Modal>
+        <Modal
+            title="模版打印"
+            v-model="showPrintMode"
+            :width="appendixCurrentWidth"
+            :footer-hide="true"
+            :fullscreen="true"
+            class-name="print-bill-panel-modal"
+        >
+            <iframe
+                ref="iframetemplate"
+                v-if="printModeReset"
+                :src="printModeUrl"
+                width="100%"
+                height="100%"
+                allowtransparency="true"
+                frameborder="0"
+            ></iframe>
+        </Modal>
+        <BillAsyncImport
+            v-if="importReset"
+            ref="billAsyncImport"
+            :config="billAsyncImportConfig"
+        />
+        <BillImport
+            v-if="importReset"
+            ref="billImport"
+            :config="billImportConfig"
+        >
+        </BillImport>
+        <Modal
+            title="合同模版"
+            v-model="ContractModalShowType"
+            :width="ContractModalWidth"
+            :mask-closable="false"
+            :footer-hide="true"
+            class-name="contract-print-panel-modal"
+            @on-cancel="HideContractPrintModal"
+        >
+            <iframe
+                ref="iframetemplate"
+                v-if="ContractModalContentShowType"
+                :src="ContractModalIframeUrl"
+                width="100%"
+                height="100%"
+                allowtransparency="true"
+                frameborder="0"
+            ></iframe>
+        </Modal>
+    </div>
 </template>
 
 <script>
-import Base from './base.vue';
-import AppendixBoxs from './appendix.vue';
-import BillAsyncImport from './billasyncimport.vue';
-import BillImport from './billimport.vue';
-import ContractPrintMixins from '@/components/base/ContractPrintMixins';
+import Base from "./base.vue";
+import AppendixBoxs from "./appendix.vue";
+import BillAsyncImport from "./billasyncimport.vue";
+import BillImport from "./billimport.vue";
+import ContractPrintMixins from "@/components/base/ContractPrintMixins";
 export default {
-    name:'BillTemplate',
+    name: "BillTemplate",
     extends: Base,
     mixins: [ContractPrintMixins],
-    components:{AppendixBoxs,BillAsyncImport,BillImport},
+    components: { AppendixBoxs, BillAsyncImport, BillImport },
     computed: {
-        uiLayoutType () {
-            return 'm' + this.uiconfig.layoutType;
+        uiLayoutType() {
+            return "m" + this.uiconfig.layoutType;
         },
-        appendixCurrentWidth () {
+        appendixCurrentWidth() {
             return this.$Store.state.app.clientWidth * 0.8;
         },
     },
 };
 </script>
 <style lang="less">
-.print-bill-panel-modal{
-    .ivu-modal-body{
-        padding: 0px!important;
-        overflow: hidden!important;
+.print-bill-panel-modal {
+    .ivu-modal-body {
+        padding: 0px !important;
+        overflow: hidden !important;
     }
 }
-.contract-print-panel-modal{
-    .ivu-modal-body{
-        height:300px!important;
+.contract-print-panel-modal {
+    .ivu-modal-body {
+        height: 300px !important;
     }
 }
 </style>

package/src/plugins/theme/theme-variable.css

@@ -90,7 +90,7 @@ html:root {
 }
 
 .vxe-table--render-default .vxe-table--border-line {
-    border: 0;
+    /* border: 0; */
 }
 
 /* .col--valid-error .ivu-input {