sone-ui-component-3.2.4 2.1.42 → 2.1.43

package/package.json

@@ -1,6 +1,6 @@
   {
   "name": "sone-ui-component-3.2.4",
-  "version": "2.1.42",
+  "version": "2.1.43",
   "private": false,
   "main": "lib/sone-ui.common.js",
   "files": [

package/packages/tree/src/main.vue

@@ -9,7 +9,10 @@
     <!-- 展示类型 -->
     <div class="sone-tree" v-if="type === 'normal'">
     <div v-if="lineDirection === 'left'" class="show-line" :style="dragWidth?'cursor:col-resize;':''" ref='line'>
-      <div class="show-line-box" @click="onShow(2)" :style="showStyle2"></div>
+      <div class="show-line-box" @click="onShow(2)">
+        <img v-show="show" :src="leftImg"/>
+        <img v-show="!show" :src="rightImg"/>
+      </div>
     </div>
     <div class="tree-wrap" ref="menu" v-show="show" :style="'width:' + defaultWidth + 'px'">
       <div class="sone-tree-title">
@@ -59,13 +62,19 @@
       </div>
     </div>
     <div v-if="lineDirection === 'right'" class="show-line" :style="dragWidth?'cursor:col-resize;':''" ref='line'>
-      <div class="show-line-box" @click="onShow(1)" :style="showStyle"></div>
+      <div class="show-line-box" @click="onShow(1)">
+        <img v-show="show" :src="leftImg"/>
+        <img v-show="!show" :src="rightImg"/>
+      </div>
     </div>
     </div>
     <!-- 操作类型 -->
     <div class="sone-tree" v-else >
       <div v-if="lineDirection === 'left'" class="show-line" :style="dragWidth?'cursor:col-resize;':''" ref='line'>
-        <div class="show-line-box" @click="onShow(2)" :style="showStyle2"></div>
+        <div class="show-line-box" @click="onShow(2)">
+          <img v-show="show" :src="leftImg"/>
+          <img v-show="!show" :src="rightImg"/>
+        </div>
       </div>
       <div class="tree-wrap" ref="menu" v-show="show" :style="'width:' + defaultWidth + 'px'" >
         <div class="sone-tree-title">
@@ -157,7 +166,10 @@
 
       </div>
       <div v-if="lineDirection === 'right'" class="show-line" :style="dragWidth?'cursor:col-resize;':''" ref='line'>
-        <div class="show-line-box" @click="onShow(1)" :style="showStyle"></div>
+        <div class="show-line-box" @click="onShow(1)">
+          <img v-show="show" :src="leftImg"/>
+          <img v-show="!show" :src="rightImg"/>
+        </div>
       </div>
     </div>
   </div>
@@ -165,6 +177,8 @@
 
 <script>
 // import { deepClone } from '../../../../src/utils/util';
+import leftImg from "../img/left.png"
+import rightImg from "../img/right.png"
 export const getObjType = obj => {
   var toString = Object.prototype.toString
   var map = {
@@ -281,6 +295,8 @@ export default {
   },
   data() {
     return {
+      leftImg,
+      rightImg,
       show: true,
       showStyle: "border-right: 6px solid #019bee;transform: translate(-100%,-50%)",
       showStyle2: "border-left: 6px solid #019bee;transform: translate(0,-50%)",

package/src/index.js

@@ -57,7 +57,7 @@ if (typeof window !== 'undefined' && window.Vue) {
 }
 
 export default {
-  version: '2.1.42',
+  version: '2.1.43',
   locale: locale.use,
   i18n: locale.i18n,
   install,

package/src/styles/form.scss

@@ -191,8 +191,8 @@
   
   .more-line {
     width: 100%;
-    height: 8px;
-    border-top: 1px solid #009bee;
+    height: 14px;
+    // border-top: 1px solid #009bee;
     background: #fff;
     cursor: pointer;
     position: absolute;
@@ -201,8 +201,11 @@
   }
   .more-line::before {
     content: "";
-    border: 6px solid transparent;
-    border-top-color: #009bee;
+    // border: 6px solid transparent;
+    // border-top-color: #009bee;
+    width: 28px;
+    height: 14px;
+    background-image:url('../assets/img/down.png');
     position: absolute;
     left: calc(50% - 5px);
     top: 0px;
@@ -210,14 +213,17 @@
   }
   .more-collapse{
     border-top: none !important;
-    border-bottom: 1px solid #009bee;
+    // border-bottom: 1px solid #009bee;
     background: unset;
     position: sticky;
   }
   .more-collapse::before {
     content: "";
-    border: 6px solid transparent;
-    border-bottom-color: #009bee;
+    // border: 6px solid transparent;
+    // border-bottom-color: #009bee;
+    width: 28px;
+    height: 14px;
+    background-image:url('../assets/img/up.png');
     position: absolute;
     z-index: 10;
     left: calc(50% - 5px);

package/src/styles/tree.scss

@@ -76,14 +76,18 @@
     .show-line{
         position: relative;
         height: 100%;
-        border-right:1px solid #019bee;
+        border-right:1px solid #fff;
+        width: 18px;
+        background: #fff;
+        box-shadow: 10px 0 5px -3px rgba(0, 0, 0, 0.12);
         .show-line-box{
+            border: 1px solid red;
             width: 0;
             height: 0;
             cursor: pointer;
             border: 6px solid transparent;
             position: absolute;
-            top: 50%;
+            top: 49%;
         }
     }
 }