qj-common 4.3.0 → 4.3.2

package/src/components/Logistics/logic.vue

@@ -1,186 +1,186 @@
-<template>
-  <div class="logic-wrap" style="height:624px;">
-    <el-dialog center :visible.sync="logicShow" width="600px"  :show-close="false" @close="hideLogic">
-      <h4 slot="title">{{expressName}}：{{wlnum}}</h4>
-      <el-scrollbar :native="false" wrapStyle="height:330px;">
-        <div class="logic-list">
-          <ul>
-            <li :class="{active: index == 0}" v-for="(item,index) in wltrack" :key="index">
-              <div class="left" v-html="date(item.AcceptTime)"></div>
-              <div class="right">
-                <i class="arrow iconfont icon-circle-arrow-up"></i>
-                <p class="info">
-                  <span>{{th('process')}}</span><br/>
-                  {{item.AcceptStation}}
-                </p>
-              </div>
-            </li>
-          </ul>
-          <!--{{th('none')}}-->
-          <span v-if="wltrack.length==0" class="noInfo">{{$t('common.pc.default.logistics.none')}}</span>
-        </div>
-      </el-scrollbar>
-      <span slot="footer" class="dialog-footer">
-      	<!--{{th('subBtn')}}-->
-        <el-button class="bg-theme button-color" type="primary" @click="hideLogic" >{{$t('common.pc.default.logistics.subBtn')}}</el-button>
-      </span>
-    </el-dialog>
-  </div>
-</template>
-<script>
-import API from "#/api/common";
-export default {
-  props: ["wlnum", "wlcompany", "expressName","logicShow"],
-  data() {
-    return {
-      wltrack: [],
-      wlInfor: {},
-//    wlState: ["暂无物流信息", "暂无物流信息", "在途中", "已签收", "问题件"],
-      //(0,"暂无物流信息"),(1,"通过"),(2,"在途中"),(3,"签收"),(4,"问题件")
-      wlStateInfor: "",
-      resultState: ""
-    };
-  },
-  created() {
-    console.log(this.wlnum, "lookLogiclookLogiclookLogiclookLogic");
-    this.getLogic();
-  },
-  methods: {
-  	th(key) {
-      return this.$th("common.pc.default.logistics.", key);
-   },
-    date(value) {
-      return `<p class="date">${value.slice(
-        5,
-        10
-      )}</p><p class="time">${value.slice(11, 16)}</p>`;
-    },
-    getLogic() {
-      let wlnum = this.wlnum;
-      let wlcompany = this.wlcompany;
-      let params = {
-//      expressType: wlcompany,
-//      expressNo: wlnum
-expressType: 'ems',
-        expressNo: '54534'
-      };
-      console.log(API)
-      API.getExpressPageForProp(params).then(res => {
-//      let dataObj = JSON.parse(res.dataObj);
-//      let wltrack = dataObj.Traces;
-//      let arrwltrack = wltrack.reverse();
-//
-//      this.resultstate = dataObj.State;
-//      this.wlInfor = dataObj;
-//      if (this.wlInfor.State == "0") {
-//        this.wltrack = [];
-//      } else {
-//        this.wltrack = arrwltrack;
-//      }
-//      this.wlStateInfor = this.wlState[this.wlInfor.State];
-      });
-    },
-    hideLogic() {
-      this.$emit('hideLogic')
-    }
-  },
-  watch: {
-    wlnum(newValue, oldValue) {
-      this.getLogic();
-    }
-  }
-};
-</script>
-<style lang="scss" scoped>
-h4 {
-  font-size: 24px;
-  color: #666666;
-  text-align: center;
-}
-.logic-wrap {
-  .noInfo{
-    font-size: 24px;
-    text-align: center;
-    margin-top: 150px;
-    display: block;
-  }
-  .logic-list {
-    width: 100%;
-    li {
-      overflow: hidden;
-      display: flex;
-      align-items: center;
-      &:last-child {
-        .right:after {
-          top: auto;
-          bottom: 0;
-          height: calc(50% + 18px);
-        }
-      }
-    }
-    .left {
-      float: left;
-      width: 10%;
-      padding-bottom: 40px;
-      font-size: 12px;
-      margin-left:70px;
-      .date {
-        font-size: 16px;
-      }
-      .time {
-        font-size: 12px;
-      }
-    }
-    .right {
-      width: 60%;
-      padding-left: 25px;
-      padding-bottom: 40px;
-      position: relative;
-      min-height: 88px;
-      display: flex;
-      align-items: center;
-      .state {
-        font-size: 16px;
-      }
-      .info {
-        font-size: 12px;
-        // margin-top: 8px;
-        line-height: 18px;
-        span{
-          font-size:15px;
-        }
-      }
-      .arrow {
-        font-size: 18px;
-        position: absolute;
-        left: -10px;
-        top: 50%;
-        margin-top: -29px;
-        background: #fff;
-        z-index: 1;
-      }
-    }
-  }
-}
-.logic-wrap  {
-  .el-scrollbar__wrap {
-    overflow-x: hidden;
-  }
-  .el-scrollbar__bar {
-    // opacity: 1;
-  }
-  .is-horizontal {
-    display: none;
-  }
-  .dialog-footer {
-    button {
-      width: 110px;
-      height: 36px;
-      font-size: 16px !important;
-      cursor: pointer;
-    }
-  }
-}
-</style>
-
-
+<template>
+  <div class="logic-wrap" style="height:624px;">
+    <el-dialog center :visible.sync="logicShow" width="600px"  :show-close="false" @close="hideLogic">
+      <h4 slot="title">{{expressName}}：{{wlnum}}</h4>
+      <el-scrollbar :native="false" wrapStyle="height:330px;">
+        <div class="logic-list">
+          <ul>
+            <li :class="{active: index == 0}" v-for="(item,index) in wltrack" :key="index">
+              <div class="left" v-html="date(item.AcceptTime)"></div>
+              <div class="right">
+                <i class="arrow iconfont icon-circle-arrow-up"></i>
+                <p class="info">
+                  <span>{{th('process')}}</span><br/>
+                  {{item.AcceptStation}}
+                </p>
+              </div>
+            </li>
+          </ul>
+          <!--{{th('none')}}-->
+          <span v-if="wltrack.length==0" class="noInfo">{{$t('common.pc.default.logistics.none')}}</span>
+        </div>
+      </el-scrollbar>
+      <span slot="footer" class="dialog-footer">
+      	<!--{{th('subBtn')}}-->
+        <el-button class="bg-theme button-color" type="primary" @click="hideLogic" >{{$t('common.pc.default.logistics.subBtn')}}</el-button>
+      </span>
+    </el-dialog>
+  </div>
+</template>
+<script>
+import API from "#/api/common";
+export default {
+  props: ["wlnum", "wlcompany", "expressName","logicShow"],
+  data() {
+    return {
+      wltrack: [],
+      wlInfor: {},
+//    wlState: ["暂无物流信息", "暂无物流信息", "在途中", "已签收", "问题件"],
+      //(0,"暂无物流信息"),(1,"通过"),(2,"在途中"),(3,"签收"),(4,"问题件")
+      wlStateInfor: "",
+      resultState: ""
+    };
+  },
+  created() {
+    console.log(this.wlnum, "lookLogiclookLogiclookLogiclookLogic");
+    this.getLogic();
+  },
+  methods: {
+  	th(key) {
+      return this.$th("common.pc.default.logistics.", key);
+   },
+    date(value) {
+      return `<p class="date">${value.slice(
+        5,
+        10
+      )}</p><p class="time">${value.slice(11, 16)}</p>`;
+    },
+    getLogic() {
+      let wlnum = this.wlnum;
+      let wlcompany = this.wlcompany;
+      let params = {
+//      expressType: wlcompany,
+//      expressNo: wlnum
+expressType: 'ems',
+        expressNo: '54534'
+      };
+      console.log(API)
+      API.getExpressPageForProp(params).then(res => {
+//      let dataObj = JSON.parse(res.dataObj);
+//      let wltrack = dataObj.Traces;
+//      let arrwltrack = wltrack.reverse();
+//
+//      this.resultstate = dataObj.State;
+//      this.wlInfor = dataObj;
+//      if (this.wlInfor.State == "0") {
+//        this.wltrack = [];
+//      } else {
+//        this.wltrack = arrwltrack;
+//      }
+//      this.wlStateInfor = this.wlState[this.wlInfor.State];
+      });
+    },
+    hideLogic() {
+      this.$emit('hideLogic')
+    }
+  },
+  watch: {
+    wlnum(newValue, oldValue) {
+      this.getLogic();
+    }
+  }
+};
+</script>
+<style lang="scss" scoped>
+h4 {
+  font-size: 24px;
+  color: #666666;
+  text-align: center;
+}
+.logic-wrap {
+  .noInfo{
+    font-size: 24px;
+    text-align: center;
+    margin-top: 150px;
+    display: block;
+  }
+  .logic-list {
+    width: 100%;
+    li {
+      overflow: hidden;
+      display: flex;
+      align-items: center;
+      &:last-child {
+        .right:after {
+          top: auto;
+          bottom: 0;
+          height: calc(50% + 18px);
+        }
+      }
+    }
+    .left {
+      float: left;
+      width: 10%;
+      padding-bottom: 40px;
+      font-size: 12px;
+      margin-left:70px;
+      .date {
+        font-size: 16px;
+      }
+      .time {
+        font-size: 12px;
+      }
+    }
+    .right {
+      width: 60%;
+      padding-left: 25px;
+      padding-bottom: 40px;
+      position: relative;
+      min-height: 88px;
+      display: flex;
+      align-items: center;
+      .state {
+        font-size: 16px;
+      }
+      .info {
+        font-size: 12px;
+        // margin-top: 8px;
+        line-height: 18px;
+        span{
+          font-size:15px;
+        }
+      }
+      .arrow {
+        font-size: 18px;
+        position: absolute;
+        left: -10px;
+        top: 50%;
+        margin-top: -29px;
+        background: #fff;
+        z-index: 1;
+      }
+    }
+  }
+}
+.logic-wrap  {
+  .el-scrollbar__wrap {
+    overflow-x: hidden;
+  }
+  .el-scrollbar__bar {
+    // opacity: 1;
+  }
+  .is-horizontal {
+    display: none;
+  }
+  .dialog-footer {
+    button {
+      width: 110px;
+      height: 36px;
+      font-size: 16px !important;
+      cursor: pointer;
+    }
+  }
+}
+</style>
+
+

package/src/components/ScrollBar/index.vue

@@ -1,60 +1,60 @@
-<template>
-  <div class="scroll-container" ref="scrollContainer" @wheel.prevent="handleScroll" >
-    <div class="scroll-wrapper" ref="scrollWrapper" :style="{top: top + 'px'}">
-      <slot></slot>
-    </div>
-  </div>
-</template>
-
-<script>
-const delta = 15;
-
-export default {
-  name: "scrollBar",
-  data() {
-    return {
-      top: 0
-    };
-  },
-  methods: {
-    handleScroll(e) {
-      const eventDelta = e.wheelDelta || -e.deltaY * 3;
-      const $container = this.$refs.scrollContainer;
-      const $containerHeight = $container.offsetHeight;
-      const $wrapper = this.$refs.scrollWrapper;
-      const $wrapperHeight = $wrapper.offsetHeight;
-      if (eventDelta > 0) {
-        this.top = Math.min(0, this.top + eventDelta);
-      } else {
-        if ($containerHeight - delta < $wrapperHeight) {
-          if (this.top < -($wrapperHeight - $containerHeight + delta)) {
-            this.top = this.top;
-          } else {
-            this.top = Math.max(
-              this.top + eventDelta,
-              $containerHeight - $wrapperHeight - delta
-            );
-          }
-        } else {
-          this.top = 0;
-        }
-      }
-    }
-  }
-};
-</script>
-
-<style rel="stylesheet/scss" lang="scss" scoped>
-// @import "../../../src/theme/variables.scss";
-
-.scroll-container {
-  position: relative;
-  width: 100%;
-  height: 100%;
-  background-color: inherit;
-  .scroll-wrapper {
-    position: absolute;
-    width: 100% !important;
-  }
-}
-</style>
+<template>
+  <div class="scroll-container" ref="scrollContainer" @wheel.prevent="handleScroll" >
+    <div class="scroll-wrapper" ref="scrollWrapper" :style="{top: top + 'px'}">
+      <slot></slot>
+    </div>
+  </div>
+</template>
+
+<script>
+const delta = 15;
+
+export default {
+  name: "scrollBar",
+  data() {
+    return {
+      top: 0
+    };
+  },
+  methods: {
+    handleScroll(e) {
+      const eventDelta = e.wheelDelta || -e.deltaY * 3;
+      const $container = this.$refs.scrollContainer;
+      const $containerHeight = $container.offsetHeight;
+      const $wrapper = this.$refs.scrollWrapper;
+      const $wrapperHeight = $wrapper.offsetHeight;
+      if (eventDelta > 0) {
+        this.top = Math.min(0, this.top + eventDelta);
+      } else {
+        if ($containerHeight - delta < $wrapperHeight) {
+          if (this.top < -($wrapperHeight - $containerHeight + delta)) {
+            this.top = this.top;
+          } else {
+            this.top = Math.max(
+              this.top + eventDelta,
+              $containerHeight - $wrapperHeight - delta
+            );
+          }
+        } else {
+          this.top = 0;
+        }
+      }
+    }
+  }
+};
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+// @import "../../../src/theme/variables.scss";
+
+.scroll-container {
+  position: relative;
+  width: 100%;
+  height: 100%;
+  background-color: inherit;
+  .scroll-wrapper {
+    position: absolute;
+    width: 100% !important;
+  }
+}
+</style>

package/src/components/Sticky/index.vue

@@ -1,76 +1,76 @@
-<template>
-  <div :style="{height:height+'px',zIndex:zIndex}">
-    <div :class="className" :style="{top:stickyTop+'px',zIndex:zIndex,position:position,width:width,height:height+'px'}">
-      <slot>
-        <div>sticky</div>
-      </slot>
-    </div>
-  </div>
-</template>
-
-<script>
-export default {
-  name: 'Sticky',
-  props: {
-    stickyTop: {
-      type: Number,
-      default: 0
-    },
-    zIndex: {
-      type: Number,
-      default: 1
-    },
-    className: {
-      type: String
-    }
-  },
-  data() {
-    return {
-      active: false,
-      position: '',
-      currentTop: '',
-      width: undefined,
-      height: undefined,
-      child: null,
-      stickyHeight: 0
-    }
-  },
-  mounted() {
-    this.height = this.$el.getBoundingClientRect().height
-    window.addEventListener('scroll', this.handleScroll)
-  },
-  activated() {
-    this.handleScroll()
-  },
-  destroyed() {
-    window.removeEventListener('scroll', this.handleScroll)
-  },
-  methods: {
-    sticky() {
-      if (this.active) {
-        return
-      }
-      this.position = 'fixed'
-      this.active = true
-      this.width = this.width + 'px'
-    },
-    reset() {
-      if (!this.active) {
-        return
-      }
-      this.position = ''
-      this.width = 'auto'
-      this.active = false
-    },
-    handleScroll() {
-      this.width = this.$el.getBoundingClientRect().width
-      const offsetTop = this.$el.getBoundingClientRect().top
-      if (offsetTop <= this.stickyTop) {
-        this.sticky()
-        return
-      }
-      this.reset()
-    }
-  }
-}
-</script>
+<template>
+  <div :style="{height:height+'px',zIndex:zIndex}">
+    <div :class="className" :style="{top:stickyTop+'px',zIndex:zIndex,position:position,width:width,height:height+'px'}">
+      <slot>
+        <div>sticky</div>
+      </slot>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'Sticky',
+  props: {
+    stickyTop: {
+      type: Number,
+      default: 0
+    },
+    zIndex: {
+      type: Number,
+      default: 1
+    },
+    className: {
+      type: String
+    }
+  },
+  data() {
+    return {
+      active: false,
+      position: '',
+      currentTop: '',
+      width: undefined,
+      height: undefined,
+      child: null,
+      stickyHeight: 0
+    }
+  },
+  mounted() {
+    this.height = this.$el.getBoundingClientRect().height
+    window.addEventListener('scroll', this.handleScroll)
+  },
+  activated() {
+    this.handleScroll()
+  },
+  destroyed() {
+    window.removeEventListener('scroll', this.handleScroll)
+  },
+  methods: {
+    sticky() {
+      if (this.active) {
+        return
+      }
+      this.position = 'fixed'
+      this.active = true
+      this.width = this.width + 'px'
+    },
+    reset() {
+      if (!this.active) {
+        return
+      }
+      this.position = ''
+      this.width = 'auto'
+      this.active = false
+    },
+    handleScroll() {
+      this.width = this.$el.getBoundingClientRect().width
+      const offsetTop = this.$el.getBoundingClientRect().top
+      if (offsetTop <= this.stickyTop) {
+        this.sticky()
+        return
+      }
+      this.reset()
+    }
+  }
+}
+</script>