@logwire/logwire-wms-pda-ui 1.1.17 → 1.2.0

package/src/components/ui/NotData/index.vue

@@ -1,75 +1,81 @@
-<!--
-  @name: 空状态
-  @description: -
-  @author 张文
-  @date: 2022-01-20
--->
-<template>
-  <div
-    :class="[
-      'lw-global-flex-center',
-      animation ? 'lw-global-animation-out' : '',
-      'lw-none-data'
-    ]">
-
-    <slot name="image">
-      <img class="lw-not-data-img" :src="src" :alt="content">
-    </slot>
-
-    <slot name="content">
-      <div
-        class="lw-none-data-content"
-      >{{ content || $lwLanguage.get('wms_project.pda.component.notData.null', '空空如也') + '...' }}</div>
-    </slot>
-
-    <slot name="footer"></slot>
-  </div>
-</template>
-
-<script>
-
-export default {
-  name: "lwNotData",
-  props:{
-    // 提示文字信息
-    content: String,
-    // 图片路径
-    src:{
-      type:String,
-      default: require('../../../assets/img/lwNotData/noneData.png')
-    },
-    // 是否需要进入动画
-    animation:{
-      type:Boolean,
-      default: true
-    }
-  },
-  data() {
-    return {}
-  },
-  methods: {}
-}
-</script>
-
-<style scoped lang="less">
-
-@import "../../../assets/css/var.less";
-
-.lw-none-data{
-  width: 100%;
-  flex-direction: column;
-  padding: 20px 0;
-
-  .lw-not-data-img{
-    width: 35%;
-    max-width: 256px;
-    max-height: 270px;
-  }
-
-  .lw-none-data-content{
-    margin-bottom: 10px;
-    color: @baseColor;
-  }
-}
-
-</style>
+<!--
+  @name: 空状态
+  @description: -
+  @author 张文
+  @date: 2022-01-20
+-->
+<template>
+  <div
+    :class="[
+      'lw-global-flex-center',
+      animation ? 'lw-global-animation-out' : '',
+      'lw-none-data'
+    ]">
+
+    <slot name="image">
+      <img class="lw-not-data-img" :src="src" :alt="content">
+    </slot>
+
+    <slot name="content">
+      <div
+        class="lw-none-data-content"
+        :style="{color:color}"
+      >{{ content || $lwLanguage.get('wms_project.pda.component.notData.null', '空空如也') + '...' }}</div>
+    </slot>
+
+    <slot name="footer"></slot>
+  </div>
+</template>
+
+<script>
+import noDataImage from '../../../assets/img/lwNotData/noneData.png'
+
+export default {
+  name: "lwNotData",
+  props:{
+    // 提示文字信息
+    content: String,
+    // 图片路径
+    src:{
+      type:String,
+      default: noDataImage,
+    },
+    // 是否需要进入动画
+    animation:{
+      type:Boolean,
+      default: true
+    },
+    // 底部描述文字的颜色
+    color:{
+      type:String,
+      default: '#969799'
+    },
+  },
+  data() {
+    return {}
+  },
+  methods: {}
+}
+</script>
+
+<style scoped lang="less">
+
+@import "../../../assets/css/var.less";
+
+.lw-none-data{
+  width: 100%;
+  flex-direction: column;
+  padding: 20px 0;
+
+  .lw-not-data-img{
+    width: 35%;
+    max-width: 256px;
+    max-height: 270px;
+  }
+
+  .lw-none-data-content{
+    margin-bottom: 10px;
+  }
+}
+
+</style>

package/src/components/ui/Pages/index.js

@@ -1,5 +1,5 @@
-import lwPages from './index.vue'
-
-lwPages.install = Vue => Vue.component(lwPages.name, lwPages)
-
-export default lwPages
+import lwPages from './index.vue'
+
+lwPages.install = Vue => Vue.component(lwPages.name, lwPages)
+
+export default lwPages

package/src/components/ui/Pages/index.vue

@@ -1,186 +1,187 @@
-<!--
-  @name: 分页
-  @description: -
-  @author 张文
-  @date: 2022-01-20
--->
-<template>
-  <div v-if="show" class="lw-global-flex-center lw-page-num-box">
-    <van-pagination
-      v-model="pageNum"
-      :total-items="pageTotal"
-      :items-per-page="pageSize"
-      :show-page-size="showPageSize"
-      :mode="mode"
-      :force-ellipses="forceEllipses"
-      :prev-text="prevText"
-      :next-text="nextText"
-      :page-count="pageCount"
-      @change="pageChange"
-    >
-      <template #prev-text>
-        <slot name="prev-text">
-          <van-icon v-if="!prevText" name="arrow-left" />
-        </slot>
-      </template>
-      <template #next-text>
-        <slot name="next-text">
-          <van-icon v-if="!nextText" name="arrow" />
-        </slot>
-      </template>
-    </van-pagination>
-  </div>
-</template>
-
-<script>
-
-export default {
-  name: "lwPages",
-  props:{
-    // 当前页码
-    value: {
-      type:Number,
-      default:1
-    },
-    // 数据总条数
-    pageTotal: {
-      type:Number,
-      default: 0
-    },
-    // 每页条数
-    pageSize: {
-      type:Number,
-      default:10
-    },
-    // 底部显示的分页数量
-    showPageSize: {
-      type:Number,
-      default:4
-    },
-    //显示模式
-    mode:{
-      type:String,
-      default: 'multi'
-    },
-    // 上一页的文字
-    prevText:String,
-    // 下一页的文字
-    nextText:String,
-    // 总页数
-    pageCount:[String,Number],
-    // 是否显示省略号
-    forceEllipses:{
-      type:Boolean,
-      default:true
-    },
-    // 点击分页切换时，是否滚动到页面顶部，默认滚动到顶部
-    scrollTop:{
-      type:Boolean,
-      default:true
-    },
-    // 滚动到顶部的元素
-    scrollElement:{
-      type:String,
-      default:'#app'
-    },
-
-    // 当内容小于一页时是否显示分页组件
-    hide:{
-      type: Boolean,
-      default: true
-    }
-  },
-  computed:{
-    pageNum:{
-      get(){
-        return this.value
-      },
-      set(v){
-        this.$emit('input',v)
-      }
-    },
-    show(){
-
-      if (this.pageCount){
-        return this.pageCount > 1  || !this.hide
-      }
-
-      return this.pageTotal > this.pageSize  || !this.hide
-    }
-  },
-  data() {
-    return {}
-  },
-  methods: {
-    // 页码发生改变
-    pageChange(){
-      this.$emit('change',this.pageNum)
-
-      if (this.scrollTop){
-        const dom = document.querySelector(this.scrollElement)
-        dom && dom.scrollIntoView({
-          behavior: "smooth",
-          block:'start',
-        });
-      }
-    }
-  }
-}
-</script>
-
-<style scoped lang="less">
-
-@import "../../../assets/css/var.less";
-
-
-
-.lw-page-num-box{
-  margin: 20px 0 10px;
-
-  /deep/.van-pagination__item{
-    color: @baseColor;
-    background: #fff;
-    height: 30px;
-    min-width: 30px;
-    border-radius: 6px;
-    border: solid 1px @baseColor;
-    flex-basis: 0;
-
-    &+.van-pagination__item{
-      margin-left: 10px;
-    }
-
-    &::after{
-      border-width: 0;
-    }
-
-    &:active{
-      background: #c8c9cc;
-    }
-
-
-  }
-
-  /deep/.van-pagination__item--disabled{
-    color: #646566;
-    background-color: #e5e7eb;
-    cursor: not-allowed;
-    opacity: 0.5;
-    border-color: #ccc;
-  }
-
-  /deep/.van-pagination__item--active{
-    background-color: @baseColor;
-    color: #fff;
-    font-weight: bold;
-  }
-
-  /deep/.van-pagination__page-desc{
-    height: 30px;
-    border-bottom: solid 1px @baseColor;
-    box-sizing: border-box;
-    margin: 0 10px;
-  }
-}
-
-</style>
+<!--
+  @name: 分页
+  @description: -
+  @author 张文
+  @date: 2022-01-20
+-->
+<template>
+  <div v-if="show" class="lw-global-flex-center lw-page-num-box">
+    <van-pagination
+      v-model="pageNum"
+      :total-items="pageTotal"
+      :items-per-page="pageSize"
+      :show-page-size="showPageSize"
+      :mode="mode"
+      :force-ellipses="forceEllipses"
+      :prev-text="prevText"
+      :next-text="nextText"
+      :page-count="pageCount"
+      @change="pageChange"
+    >
+      <template #prev-text>
+        <slot name="prev-text">
+          <van-icon v-if="!prevText" name="arrow-left" />
+        </slot>
+      </template>
+      <template #next-text>
+        <slot name="next-text">
+          <van-icon v-if="!nextText" name="arrow" />
+        </slot>
+      </template>
+    </van-pagination>
+  </div>
+</template>
+
+<script>
+
+export default {
+  name: "lwPages",
+  props:{
+    // 当前页码
+    value: {
+      type:Number,
+      default:1
+    },
+    // 数据总条数
+    pageTotal: {
+      type:Number,
+      default: 0
+    },
+    // 每页条数
+    pageSize: {
+      type:Number,
+      default:10
+    },
+    // 底部显示的分页数量
+    showPageSize: {
+      type:Number,
+      default:4
+    },
+    //显示模式
+    mode:{
+      type:String,
+      default: 'multi'
+    },
+    // 上一页的文字
+    prevText:String,
+    // 下一页的文字
+    nextText:String,
+    // 总页数
+    pageCount:[String,Number],
+    // 是否显示省略号
+    forceEllipses:{
+      type:Boolean,
+      default:true
+    },
+    // 点击分页切换时，是否滚动到页面顶部，默认滚动到顶部
+    scrollTop:{
+      type:Boolean,
+      default:true
+    },
+    // 滚动到顶部的元素
+    scrollElement:{
+      type:String,
+      default:'#app'
+    },
+
+    // 当内容小于一页时是否显示分页组件
+    hide:{
+      type: Boolean,
+      default: true
+    }
+  },
+  computed:{
+    pageNum:{
+      get(){
+        return this.value
+      },
+      set(v){
+        this.$emit('input',v)
+      }
+    },
+    show(){
+
+      if (this.pageCount){
+        return this.pageCount > 1  || !this.hide
+      }
+
+      return this.pageTotal > this.pageSize  || !this.hide
+    }
+  },
+  data() {
+    return {}
+  },
+  methods: {
+    // 页码发生改变
+    pageChange(page){
+      this.$emit('change', page)
+
+      if (this.scrollTop){
+        const dom = document.querySelector(this.scrollElement)
+        dom && dom.scrollIntoView({
+          behavior: "smooth",
+          block:'start',
+        });
+      }
+    }
+  }
+}
+</script>
+
+<style scoped lang="less">
+
+@import "../../../assets/css/var.less";
+
+
+
+.lw-page-num-box{
+  margin: 20px 0 10px;
+
+  /deep/.van-pagination__item{
+    color: @baseColor;
+    background: #fff;
+    height: 30px;
+    min-width: 30px;
+    border-radius: 6px;
+    border: solid 1px @baseColor;
+    flex-basis: 0;
+    flex-grow: 0;
+
+    &+.van-pagination__item{
+      margin-left: 10px;
+    }
+
+    &::after{
+      border-width: 0;
+    }
+
+    &:active{
+      background: #c8c9cc;
+    }
+
+
+  }
+
+  /deep/.van-pagination__item--disabled{
+    color: #646566;
+    background-color: #e5e7eb;
+    cursor: not-allowed;
+    opacity: 0.5;
+    border-color: #ccc;
+  }
+
+  /deep/.van-pagination__item--active{
+    background-color: @baseColor;
+    color: #fff;
+    font-weight: bold;
+  }
+
+  /deep/.van-pagination__page-desc{
+    height: 30px;
+    border-bottom: solid 1px @baseColor;
+    box-sizing: border-box;
+    margin: 0 10px;
+  }
+}
+
+</style>

package/src/components/ui/Pagination/index.js

@@ -0,0 +1,11 @@
+/*
+* 分页组件
+* @author: 张文
+* @date  2022-07-18
+* */
+
+import lwPagination from "./index.vue";
+
+lwPagination.install = Vue => Vue.component(lwPagination.name, lwPagination)
+
+export default lwPagination