cloud-web-corejs 1.0.54-dev.78 → 1.0.54-dev.780

package/src/components/xform/form-render/container-item/detail-item.vue

@@ -1,158 +1,287 @@
-<!--
-/**
- * author: vformAdmin
- * email: vdpadmin@163.com
- * website: https://www.vform666.com
- * date: 2021.08.18
- * remark: 如果要分发VForm源码，需在本文件顶部保留此文件头信息！！
- */
--->
-
-<template>
-  <container-item-wrapper :widget="widget">
-    <div class="detail-wrap grid-container" :class="[customClass]" :ref="widget.id">
-      <div class="d-header clearfix">
-        <div class="fl">
-          <i class="el-icon-info"/>
-          {{ getI18nLabel(widget.options.label) }}
-        </div>
-<!--        <div class="fr">
-          <el-button type="primary" plain class="button-sty" icon="el-icon-refresh-right" @click="reload">重置
-          </el-button>
-          <el-button type="primary" class="button-sty" icon="el-icon-check" @click="saveData" v-if="!wfInfo.id">保存
-          </el-button>
-        </div>-->
-        <div class="fr">
-          <template v-for="(subWidget, swIdx) in widget.widgetList">
-            <template v-if="'container' === subWidget.category">
-              <component :is="subWidget.type + '-item'" :widget="subWidget" :key="swIdx"
-                         :parent-list="widget.widgetList"
-                         :index-of-parent-list="swIdx" :parent-widget="widget">
-                <!-- 递归传递插槽！！！ -->
-                <template v-for="slot in Object.keys($scopedSlots)" v-slot:[slot]="scope">
-                  <slot :name="slot" v-bind="scope"/>
-                </template>
-              </component>
-            </template>
-            <template v-else>
-              <component :is="subWidget.type + '-widget'" :field="subWidget" :designer="null" :key="swIdx"
-                         :parent-list="widget.widgetList"
-                         :index-of-parent-list="swIdx" :parent-widget="widget">
-                <!-- 递归传递插槽！！！ -->
-                <template v-for="slot in Object.keys($scopedSlots)" v-slot:[slot]="scope">
-                  <slot :name="slot" v-bind="scope"/>
-                </template>
-              </component>
-            </template>
-          </template>
-        </div>
-      </div>
-      <baseTabs style="height: auto;">
-        <detail-pane-widget v-for="(paneWidget, index) in widget.panes" :key="index" :widget="paneWidget"
-                            :parent-list="widget.panes"
-                            :index-of-parent-list="index" :parent-widget="widget"
-                            :col-height="widget.options.colHeight" tabRef="baseTabRef" :tabPaneGrade="2"></detail-pane-widget>
-      </baseTabs>
-    </div>
-  </container-item-wrapper>
-</template>
-
-<script>
-
-import emitter from '../../../../components/xform/utils/emitter'
-import i18n from "../../../../components/xform/utils/i18n"
-import refMixin from "../../../../components/xform/form-render/refMixin"
-import ContainerItemWrapper from './container-item-wrapper'
-import containerItemMixin from "./containerItemMixin"
-import detailPaneWidget from "../../../../components/xform/form-render/container-item/detail-pane-item"
-import FieldComponents from '../../../../components/xform/form-designer/form-widget/field-widget/index'
-
-
-import {initWf} from '../../../../components/wf/wfUtil'
-
-export default {
-  name: "detail-item",
-  componentName: 'ContainerItem',
-  mixins: [emitter, i18n, refMixin, containerItemMixin],
-  components: {
-    ContainerItemWrapper,
-    detailPaneWidget,
-    ...FieldComponents,
-  },
-  props: {
-    widget: Object,
-  },
-  inject: ['refList', 'sfRefList', 'globalModel', 'previewState'],
-  created() {
-    this.initRefList()
-    this.handleOnCreated();
-  },
-  mounted() {
-    this.handleOnMounted();
-    this.$nextTick(() => {
-      this.createWf();
-    })
-  },
-  beforeDestroy() {
-    this.unregisterFromRefList()
-  },
-  data() {
-    return {
-      wfInfo: {}
-    }
-  },
-  methods: {
-    reload() {
-      this.getFormRef().$parent.$baseReload()
-    },
-    saveData() {
-      if (!!this.previewState) return
-      this.getFormRef().saveForm();
-    },
-    createWf() {
-      if (!!this.previewState || !this.widget.options.wfEnabled) return
-      let formTarget = this.getFormRef();
-      let formData = formTarget.formData;
-      if (formData && formData.object_foreign_id) {
-        let reportTemplate = formTarget.reportTemplate;
-        let formCode = reportTemplate.formCode;
-        let option = {
-          objId: formData.object_foreign_id, //单据ID
-          wfCode: formCode, //流程编码
-          showStartBtn: true, //是否放出启动按钮,流程已启动时此参数失效
-          serviceId: 'user',
-          callback: ({wfInfo}) => {
-            this.wfInfo = wfInfo;
-          }
-        }
-        initWf.call(formTarget.$parent, option);
-      }
-
-    }
-  },
-}
-</script>
-
-<style lang="scss" scoped>
-.grid-container {
-  min-height: 50px;
-  //line-height: 48px;
-  //padding: 6px;
-  outline: 1px dashed #336699;
-
-  > div {
-    height: 100%;
-  }
-
-  .form-widget-list {
-    // min-height: 28px;
-    height: 100%;
-  }
-
-}
-
-.grid-container.selected, .grid-cell.selected {
-  outline: 2px solid $--color-primary !important;
-}
-
-</style>
+<!--
+/**
+ * author: vformAdmin
+ * email: vdpadmin@163.com
+ * website: https://www.vform666.com
+ * date: 2021.08.18
+ * remark: 如果要分发VForm源码，需在本文件顶部保留此文件头信息！！
+ */
+-->
+
+<template>
+  <container-item-wrapper :widget="widget">
+    <div
+      class="detail-wrap grid-container"
+      :class="[customClass]"
+      :ref="widget.id"
+    >
+      <div class="d-header clearfix">
+        <div class="fl">
+          <i class="el-icon-info" />
+          {{ getI18nLabel(widget.options.label) }}
+        </div>
+        <!--        <div class="fr">
+          <el-button type="primary" plain class="button-sty" icon="el-icon-refresh-right" @click="reload">重置
+          </el-button>
+          <el-button type="primary" class="button-sty" icon="el-icon-check" @click="saveData" v-if="!wfInfo.id">保存
+          </el-button>
+        </div>-->
+        <div class="fr">
+          <template v-if="billNav">
+            <el-button
+              class="button-sty"
+              size="mini"
+              icon="el-icon-arrow-left"
+              :disabled="!billNav.canPrev"
+              @click="navBill(-1)"
+              >上一单</el-button
+            >
+            <el-button
+              class="button-sty"
+              size="mini"
+              :disabled="!billNav.canNext"
+              @click="navBill(1)"
+              >下一单<i class="el-icon-arrow-right el-icon--right"></i
+            ></el-button>
+          </template>
+          <el-button
+            v-if="showWfStartBtn()"
+            class="button-sty yyy"
+            type="success"
+            icon="el-icon-video-play"
+            @click="startWf"
+            >{{ wfStartButtonName }}</el-button
+          >
+          <template v-for="(subWidget, swIdx) in widget.widgetList">
+            <template v-if="'container' === subWidget.category">
+              <component
+                :is="subWidget.type + '-item'"
+                :widget="subWidget"
+                :key="swIdx"
+                :parent-list="widget.widgetList"
+                :index-of-parent-list="swIdx"
+                :parent-widget="widget"
+              >
+                <!-- 递归传递插槽！！！ -->
+                <template
+                  v-for="slot in Object.keys($scopedSlots)"
+                  v-slot:[slot]="scope"
+                >
+                  <slot :name="slot" v-bind="scope" />
+                </template>
+              </component>
+            </template>
+            <template v-else>
+              <component
+                :is="subWidget.type + '-widget'"
+                :field="subWidget"
+                :designer="null"
+                :key="swIdx"
+                :parent-list="widget.widgetList"
+                :index-of-parent-list="swIdx"
+                :parent-widget="widget"
+              >
+                <!-- 递归传递插槽！！！ -->
+                <template
+                  v-for="slot in Object.keys($scopedSlots)"
+                  v-slot:[slot]="scope"
+                >
+                  <slot :name="slot" v-bind="scope" />
+                </template>
+              </component>
+            </template>
+          </template>
+        </div>
+      </div>
+      <baseTabs :showNav="!widget.options.hideNav">
+        <detail-pane-widget
+          v-for="(paneWidget, index) in widget.panes"
+          :key="index"
+          :widget="paneWidget"
+          :parent-list="widget.panes"
+          :index-of-parent-list="index"
+          :parent-widget="widget"
+          :col-height="widget.options.colHeight"
+          tabRef="baseTabRef"
+          :tabPaneGrade="2"
+        ></detail-pane-widget>
+      </baseTabs>
+    </div>
+  </container-item-wrapper>
+</template>
+
+<script>
+import emitter from "../../../../components/xform/utils/emitter";
+import i18n from "../../../../components/xform/utils/i18n";
+import refMixin from "../../../../components/xform/form-render/refMixin";
+import ContainerItemWrapper from "./container-item-wrapper";
+import containerItemMixin from "./containerItemMixin";
+import detailPaneWidget from "../../../../components/xform/form-render/container-item/detail-pane-item";
+import FieldComponents from "../../../../components/xform/form-designer/form-widget/field-widget/index";
+
+import { initWf, openStartWfDialog } from "../../../../components/wf/wfUtil";
+import settingConfig from "@/settings.js";
+
+export default {
+  name: "detail-item",
+  componentName: "ContainerItem",
+  mixins: [emitter, i18n, refMixin, containerItemMixin],
+  components: {
+    ContainerItemWrapper,
+    detailPaneWidget,
+    ...FieldComponents,
+  },
+  props: {
+    widget: Object,
+  },
+  inject: ["refList", "sfRefList", "globalModel", "previewState"],
+  created() {
+    this.initRefList();
+    this.handleOnCreated();
+  },
+  mounted() {
+    this.handleOnMounted();
+    this.$nextTick(() => {
+      this.createWf();
+    });
+  },
+  beforeDestroy() {
+    this.unregisterFromRefList();
+  },
+  data() {
+    return {
+      wfInfo: {},
+      wfReady: false, // 流程状态是否已就绪(callback 返回后)
+      wfHasStarted: false, // 流程是否已启动(已启动则不显示启动按钮)
+      wfStartOption: null, // 启动流程所需 option(createWf 构造)
+      wfStartCtx: null, // openStartWfDialog 的执行上下文(与 initWf 一致)
+    };
+  },
+  computed: {
+    wfStartButtonName() {
+      return (
+        settingConfig.wfStartButtonName ||
+        this.$t2("流程启动", "components.wf.wfStart")
+      );
+    },
+    // 「上一单/下一单」翻单按钮状态：详情表单开启 billNavEnabled 且宿主列表有翻单快照时才显示。
+    // detail-item 在每次翻单时随详情表单重挂载，故此处按当前挂载时机取一次即可。
+    billNav() {
+      let formRef = this.getFormRef && this.getFormRef();
+      if (
+        !formRef ||
+        !formRef.formConfig ||
+        !formRef.formConfig.billNavEnabled
+      ) {
+        return null;
+      }
+      let host = formRef.getListPageRef && formRef.getListPageRef();
+      if (!host || typeof host.getActiveBillNavState !== "function")
+        return null;
+      let state = host.getActiveBillNavState();
+      if (!state) return null;
+      return {
+        canPrev: state.index > 0,
+        canNext: state.index < state.rows.length - 1,
+      };
+    },
+  },
+  methods: {
+    // 解析流程启动信息：优先取表单实例(indexMixin,xform 主链路)暴露的,回退到本组件 createWf(旧路径)。
+    // 用方法实时求值,避免 computed 缓存导致早于 wf 就绪时求值后不再更新。
+    wfStart() {
+      let formRef = this.getFormRef && this.getFormRef();
+      if (formRef && formRef.wfStartOption) {
+        return {
+          ctx: formRef.wfStartCtx || formRef,
+          option: formRef.wfStartOption,
+          hasWf: !!formRef.hasWf,
+        };
+      }
+      if (this.wfReady && this.wfStartOption && this.wfStartCtx) {
+        return {
+          ctx: this.wfStartCtx,
+          option: this.wfStartOption,
+          hasWf: this.wfHasStarted,
+        };
+      }
+      return null;
+    },
+    // 流程启动按钮：有启动信息、需要按钮(showStartBtn 未显式关闭)、未启动、非预览态才显示。
+    // 声明式渲染,替代 wfUtil 的 DOM 强制注入。
+    showWfStartBtn() {
+      let ws = this.wfStart();
+      if (!ws || this.previewState) return false;
+      let opt = ws.option || {};
+      return opt.showStartBtn !== false && !ws.hasWf;
+    },
+    // 声明式触发流程启动(替代原注入按钮的点击),复用 wfUtil 的 openStartWfDialog
+    startWf() {
+      let ws = this.wfStart();
+      if (!ws || !ws.option || !ws.ctx) return;
+      openStartWfDialog(ws.ctx, ws.option);
+    },
+    // 触发宿主翻单：step = -1 上一单 / +1 下一单
+    navBill(step) {
+      let host = this.getFormRef && this.getFormRef();
+      host = host && host.getListPageRef && host.getListPageRef();
+      host && host.navigateActiveBill && host.navigateActiveBill(step);
+    },
+    reload() {
+      this.getFormRef().$parent.$baseReload();
+    },
+    saveData() {
+      if (!!this.previewState) return;
+      this.getFormRef().saveForm();
+    },
+    createWf() {
+      if (!!this.previewState || !this.widget.options.wfEnabled) return;
+      let formTarget = this.getFormRef();
+      let formData = formTarget.formData;
+      if (formData && formData.object_foreign_id) {
+        let reportTemplate = formTarget.reportTemplate;
+        let formCode = reportTemplate.formCode;
+        let option = {
+          objId: formData.object_foreign_id, //单据ID
+          wfCode: formCode, //流程编码
+          showStartBtn: true, //需要启动按钮(语义不变)
+          injectStartBtn: false, //不走 DOM 强制注入,改由本组件模板声明式渲染
+          serviceId: "user",
+          startConfirmText: () => formTarget.getWfStartConfirmText(),
+          callback: ({ wfInfo, hasWf }) => {
+            this.wfInfo = wfInfo;
+            this.wfHasStarted = !!hasWf; //已启动则不显示启动按钮(与原注入条件 !hasWf 一致)
+            this.wfReady = true; //状态就绪后才显示按钮,避免回调前闪现
+          },
+        };
+        this.wfStartOption = option;
+        this.wfStartCtx = formTarget.$parent; //与 initWf 执行上下文一致,供 openStartWfDialog 使用
+        initWf.call(formTarget.$parent, option);
+      }
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.grid-container {
+  min-height: 50px;
+  //line-height: 48px;
+  //padding: 6px;
+  outline: 1px dashed #336699;
+
+  > div {
+    height: 100%;
+  }
+
+  .form-widget-list {
+    // min-height: 28px;
+    height: 100%;
+  }
+}
+
+.grid-container.selected,
+.grid-cell.selected {
+  outline: 2px solid $--color-primary !important;
+}
+</style>

package/src/components/xform/form-render/container-item/detail-pane-item.vue

@@ -1,6 +1,12 @@
 <template>
-  <baseTabPane :label="getI18nLabel(widget.options.label)" ref="baseTabRef" :visible="!widget.options.hidden" v-show="!widget.options.hidden">
+  <baseTabPane :label="getI18nLabel(widget.options.label)" ref="baseTabRef" :visible="!widget.options.hidden" v-show="!widget.options.hidden" :showFold="true"
+               :defaultShowContent="!widget.options.defaultCollapse">
+
     <template #button>
+<!--      <div class='btn-close-open' @click="opeaShowCont()">
+        <span v-if="showStatus==true"><i class="el-icon-arrow-up"></i>收起</span>
+        <span v-else><i class="el-icon-arrow-down"></i>展开</span>
+      </div>-->
       <template v-for="(subWidget, swIdx) in widget.buttonWidgetList">
         <template v-if="'container' === subWidget.category">
           <component :is="subWidget.type + '-item'" :widget="subWidget" :key="swIdx"
@@ -25,7 +31,7 @@
       </template>
     </template>
     <template #default>
-      <div>
+      <div :class="{'hidden':!showStatus}">
         <template>
           <template v-for="(subWidget, swIdx) in widget.widgetList">
             <template v-if="'container' === subWidget.category">
@@ -91,8 +97,16 @@ export default {
   mounted() {
     this.handleOnMounted();
   },
+  data() {
+    return {
+      showStatus:true,
+    }
+  },
   methods: {
-
+    opeaShowCont(){
+      this.showStatus = !this.showStatus
+      console.log(this.showStatus)
+    }
   }
 }
 </script>