@lambo-design/workflow-approve 1.0.0-beta.90 → 1.0.0-beta.92

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lambo-design/workflow-approve",
-  "version": "1.0.0-beta.90",
+  "version": "1.0.0-beta.92",
   "description": "",
   "main": "index.js",
   "author": "lambo",
@@ -12,8 +12,8 @@
   "devDependencies": {
     "axios": "^0.24.0",
     "axios-cache-plugin": "^0.1.0",
-    "@lambo-design/shared": "^1.0.0-beta.293",
-    "@lambo-design/core": "^4.7.1-beta.168"
+    "@lambo-design/core": "^4.7.1-beta.168",
+    "@lambo-design/shared": "^1.0.0-beta.295"
   },
   "dependencies": {
     "bpmn-js": "^7.3.1",

package/src/portrait.vue

@@ -1,5 +1,5 @@
 <template>
-  <LamboPageContainer style="padding: 0">
+  <LamboPageContainer style="overflow: hidden" :footer-height="footerHeight">
     <template slot="page-title">
       <Tabs v-if="processTraceInTab" value="business" @on-click="changeTab">
         <TabPane :label="title" name="business"></TabPane>
@@ -12,7 +12,7 @@
     </template>
 
     <!--  横版  -->
-    <div v-if="inHorizontal && currentTab === 'business'" style="display: flex; flex-direction: column; height: 100%">
+    <div v-if="inHorizontal && currentTab === 'business'" class="workflow-inHorizontal-content" style="display: flex; flex-direction: column; height: 100%; right: 0; left: 0">
       <!--   业务内容区插槽   -->
       <div class="portrait-lambo-indicator-card" :style="{height: `${soltHeight}px`}">
         <slot name="business-content"></slot>
@@ -80,7 +80,7 @@
 
     <!--  竖版  -->
     <div v-if="!inHorizontal" class="portrait-lambo-indicator-card"
-         :style="{float: 'left', width: isExpanded && showProcessInfo ? `calc(100% - ${portraitWidth+10}px)` : '99%'}">
+         :style="{...pageContainerWithoutPadding, left: '0', width: isExpanded && showProcessInfo ? `calc(100% - ${portraitWidth+10}px)` : '99%'}">
       <!--   业务内容区插槽   -->
       <slot v-if="currentTab === 'business'" name="business-content"></slot>
       <div ref="processTraceTab" v-if="currentTab === 'processTrace'">
@@ -94,14 +94,14 @@
     </div>
     <!--   流程信息区   -->
     <a v-if="showProcessInfo && !inHorizontal" @click="isExpanded = !isExpanded" class="arrow-button-container"
-       :style="{right: isExpanded ? portraitWidth+10 + 'px' : '10px'}">
+       :style="{right: isExpanded ? portraitWidth-5 + 'px' : '5px'}">
       <Icon class="icon-class" v-if="isExpanded" type="ios-arrow-forward"/>
       <Icon class="icon-class" v-if="!isExpanded" type="ios-arrow-back"/>
     </a>
-    <transition v-if="showProcessInfo && !inHorizontal" name="draw" @before-enter="beforeFlowInfoEnter" @enter="flowInfoEnter"
+    <transition style="position: relative; overflow-x: hidden" v-if="showProcessInfo && !inHorizontal" name="draw" @before-enter="beforeFlowInfoEnter" @enter="flowInfoEnter"
                 @before-leave="beforeFlowInfoLeave" @leave="flowInfoLeave">
       <lamboIndicatorCard v-show="isExpanded" class="portrait-lambo-indicator-card"
-                          :style="{width: portraitWidth + 'px', float: 'right'}" :hasExtend="false">
+                          :style="{width: portraitWidth + 'px', right: '0', ...pageContainerWithoutPadding}" :hasExtend="false">
         <div slot="content-title">流程信息</div>
         <ProcessInfo ref="processInfo"
                      v-model="form.auditOpinion"
@@ -409,6 +409,7 @@ export default {
   data() {
     return {
       isExpanded: true,
+      footerHeight: 55,
       showProcessInfo: true,
       portraitWidth: 0,
       openProcessInfo: true,
@@ -566,6 +567,15 @@ export default {
     window.removeEventListener('resize', this.handleWindowResize);
   },
   computed: {
+    pageContainerWithoutPadding(){
+      const top = 55
+      let style = {
+        position: 'absolute',
+        top: `${top}px`,
+        height: `calc(100% - ${top + this.footerHeight}px)`,
+      }
+      return style
+    },
     buttons() {
       const showButtons = !this.isDetail && !this.appointTask && !this.rejectedTask
       return [
@@ -2162,11 +2172,6 @@ export default {
   padding: 10px;
 }
 
-/deep/ .page-body {
-  overflow-y: hidden;
-  padding: 0 0 50px 0 !important;
-}
-
 /deep/ .ivu-tabs-bar {
   margin-bottom: 0;
 }

package/src/styles/css/index.less

@@ -38,6 +38,12 @@
   max-width: 130px; /* 限制文本宽度 */
 }
 
+.workflow-inHorizontal-content {
+  position: absolute;
+  top: 55px;
+  height: calc(100% - 50px);
+}
+
 .portrait-lambo-indicator-card {
   height: 100%;
   position: relative;
@@ -122,6 +128,7 @@
   border: 1px solid #e0e0e0;
   border-radius: 16px;
   padding: 16px;
+  margin-bottom: 100px;
   &:hover{
     box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1);
   }