jufubao-base 1.0.438-beta2 → 1.0.438-beta4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "jufubao-base",
-  "version": "1.0.438-beta2",
+  "version": "1.0.438-beta4",
   "private": false,
   "description": "聚福宝业务组件基础插件包",
   "main": "index.js",
@@ -51,7 +51,7 @@
     "dingtalk-jsapi": "^3.0.31",
     "flyio": "^0.6.2",
     "gxd-commands-bussiness": "^1.0.12",
-    "gxd-uni-library-editx": "1.0.198-beta1",
+    "gxd-uni-library-editx": "1.0.202-beta3",
     "jweixin-module": "^1.6.0",
     "md5": "^2.3.0",
     "path-to-regexp": "^6.2.1",

package/src/components/JfbBaseExpressList/Api.js

@@ -0,0 +1,34 @@
+'use strict';
+/**
+ * @description  接口配置，
+ * 在设置方法名字当时候，别忘记加上【模块名字】：Express
+ * @type {*[]}
+ */
+module.exports = [
+  {
+    //设置方法名字当别忘记加上【模块名字】：Express
+    mapFnName: 'getExpressCount',
+    title: '订单 - 快递包裹数量(代签收/运输中)',
+    path: '/order/v1/logistics/express-package-count',
+    isRule: false,
+    params: {
+      
+    },
+    isConsole: true,
+    disabled: true,
+  },
+  {
+    //设置方法名字当别忘记加上【模块名字】：Express
+    mapFnName: 'getExpressList',
+    title: '订单 - 快递包裹分类列表',
+    path: '/order/v1/logistics/express-package-list',
+    isRule: false,
+    params: {
+      logistics_status: ['物流状态', 'String', '必选'],
+      page_size: ['每页数量', 'Number', '必选'],
+      page_token: ['分页token', 'String', '必选'],
+    },
+    isConsole: true,
+    disabled: true,
+  },
+];

package/src/components/JfbBaseExpressList/Attr.js

@@ -0,0 +1,25 @@
+'use strict';
+
+/**
+ * @description 当表单组件中有联动操作时候，使用方法进行返回
+ */
+export default {
+  style: [],
+  content: (data) => {
+    return [
+      {
+        label: '物流详情路径:',
+        groupKey:'advanced',
+        className: 'input100',
+        labelInline:true,
+        ele: 'xd-select-pages-path',
+        valueKey: 'select-pages-path',
+        value: data['select-pages-path'] || null,
+        setting: {
+          router: XdBus.getParentApi('getPagesTree')
+        },
+      },
+    ].filter(i=>i)
+  },
+  advanced: [],
+};

package/src/components/JfbBaseExpressList/JfbBaseExpressList.vue

@@ -0,0 +1,498 @@
+<template>
+  <view
+    class="jfb-base-express-list"
+    @click="handleEditxSelect"
+    :class="{ editx : isEditx && active }"
+  >
+    <!--#ifdef H5-->
+    <view
+      class="jfb-base-express-list__edit"
+      :class="{ editx : isEditx && active }"
+      v-if="isEditx && active"
+    >
+      <view class="jfb-base-express-list__edit-icon" @click="delEdit">删除</view>
+    </view>
+    <!-- #endif -->
+    <view class="jfb-base-express-list__body">
+      <!--状态tab栏-->
+      <view class="jfb-base-express-list__status fixed_top" :style="{top: (layoutInfo.top - 2)+'rpx'}" v-if="statusList.length > 0">
+        <view
+          class="jfb-base-express-list__status-item"
+          :class="{ 'is-active': activeStatus === item.status }"
+          v-for="(item, index) in statusList"
+          :key="index"
+          @click="handleStatusChange(item.status)"
+        >
+          <view class="jfb-base-express-list__status-text">
+            <view class="jfb-base-express-list__status-name">
+              <text>{{ item.label }}</text>
+              <view class="jfb-base-express-list__status-line" :class="{ 'is-visible': activeStatus === item.status }"></view>
+            </view>
+            <view class="jfb-base-express-list__status-count" v-if="item.count">{{ item.count > 99 ? '99+' : item.count }}</view>
+          </view>
+        </view>
+      </view>
+      <view style="height: 100rpx;"></view>
+      <!--包裹列表-->
+      <view class="jfb-base-express-list__list">
+        <view
+          class="jfb-base-express-list__item"
+          v-for="(item, index) in express"
+          :key="index"
+        >
+          <view class="jfb-base-express-list__item-title">
+            <view class="jfb-base-express-list__item-title-left">
+              <xd-font-icon icon="iconbaoguo" size="30" color="#999"></xd-font-icon>
+              <text class="jfb-base-express-list__item-title-text">包裹 {{ index + 1 }}</text>
+            </view>
+            <view class="jfb-base-express-list__item-title-right" @click="handleToDetail(item)">
+              <text>查看详情</text>
+              <xd-font-icon icon="iconxiangyou_xian" size="24" color="#999"></xd-font-icon>
+            </view>
+          </view>
+          <view class="jfb-base-express-list__item-number">
+            <view class="jfb-base-express-list__item-number-info">
+              <text class="jfb-base-express-list__item-number-company">{{ item.logistics_company_name }}</text>
+              <text class="jfb-base-express-list__item-number-no">{{ item.logistics_number }}</text>
+            </view>
+            <view
+              class="jfb-base-express-list__item-number-copy"
+              v-if="item.logistics_number"
+              @click.stop="copy(item.logistics_number)"
+            >复制单号</view>
+          </view>
+          <view class="jfb-base-express-list__item-goods">
+            <view
+              class="jfb-base-express-list__item-goods-item"
+              v-for="(Sitem, Sindex) in item.product_list"
+              :key="Sindex"
+            >
+              <image
+                class="jfb-base-express-list__item-goods-image"
+                :src="Sitem.product_thumb"
+                mode="aspectFill"
+              ></image>
+              <view class="jfb-base-express-list__item-goods-info">
+                <view class="jfb-base-express-list__item-goods-name">{{ Sitem.product_name }}</view>
+                <view class="jfb-base-express-list__item-goods-brand" v-if="Sitem.brand_name">{{ Sitem.brand_name }}</view>
+                <view class="jfb-base-express-list__item-goods-bottom">
+                  <view class="jfb-base-express-list__item-goods-price">
+                    <xd-unit :isOld="false" :price="Sitem.price" :color="mainColor" :fontSize="36"></xd-unit>
+                  </view>
+                  <view class="jfb-base-express-list__item-goods-num">x{{ Sitem.product_num }}</view>
+                </view>
+              </view>
+            </view>
+          </view>
+        </view>
+      </view>
+      <!--空状态-->
+      <view class="jfb-base-express-list__empty" v-if="express.length === 0">暂无数据</view>
+    </view>
+  </view>
+</template>
+
+<script>
+  import XdFontIcon from "@/components/XdFontIcon/XdFontIcon";
+  import XdUnit from "@/components/XdUnit/XdUnit";
+  import { jfbRootExec } from "@/utils/xd.event";
+  import JfbBaseExpressListMixin from "./JfbBaseExpressListMixin";
+  import { getContainerPropsValue } from "@/utils/xd.base";
+  import getServiceUrl from "@/common/getServiceUrl";
+  import componentsMixins from "@/mixins/componentsMixins";
+  import extsMixins from "@/mixins/extsMixins";
+  export default {
+    // #ifdef MP-WEIXIN
+    options: { styleIsolation: 'shared' },
+    // #endif
+    name: "JfbBaseExpressList",
+    components: {
+      XdFontIcon,
+      XdUnit,
+    },
+    mixins: [
+      componentsMixins, extsMixins, JfbBaseExpressListMixin
+    ],
+    data() {
+      return {
+        expressPath: "", //物流详情路径
+        activeStatus: "logistics_status_p", //当前选中状态
+        statusList: [], //状态tab列表
+        express: [], //包裹列表
+        page_token: "1", //当前页码
+        page_size: 20, //每页数量
+        hasNext: false, //是否有下一页
+        next_page_token: "", //下一页token
+      }
+    },
+    watch: {
+      container(value, oldValue) {
+        if (JSON.stringify(value) === JSON.stringify(oldValue)) return;
+        if (this.$configProject['isPreview']) this.init(value)
+      },
+    },
+    created() {
+      this.init(this.container);
+    },
+    methods: {
+      onJfbLoad(options) {
+        if(options.tab) {
+          this.activeStatus = options.tab
+        }
+        //加载状态tab数量与包裹列表
+        this.getExpressCount();
+        this.getExpressList();
+      },
+      /**
+       * @description 监听事件变化
+       * @param container {object} 业务组件对象自己
+       */
+      init(container) {
+        this.expressPath = getContainerPropsValue(container, 'content.select-pages-path', {value: ""}).value;
+      },
+      /**
+       * @description 获取各状态包裹数量
+       */
+      getExpressCount() {
+        jfbRootExec("getExpressCount", {
+          vm: this,
+          data: {
+            page_id: this.pageAttr['page_id'], //页面ID
+            container_id: this.containerId, //组件ID
+          },
+        })
+          .then((res) => {
+            //已签收状态不显示数量
+            this.statusList = [
+              { status: 'logistics_status_p', label: '待签收', count: res.proxy_sign_count },
+              { status: 'logistics_status_n', label: '运输中', count: res.transport_count },
+              { status: 'logistics_status_y', label: '已签收', count: 0 },
+            ];
+          })
+          .catch((err) => {
+            this.$xdLog.catch(err);
+            this.statusList = [];
+          });
+      },
+      /**
+       * @description 获取包裹列表
+       */
+      getExpressList() {
+        jfbRootExec("getExpressList", {
+          vm: this,
+          data: this.$xdUniHelper.deleteParamEmptyKey({
+            page_id: this.pageAttr['page_id'], //页面ID
+            container_id: this.containerId, //组件ID
+            logistics_status: this.activeStatus, //当前状态
+            page_token: this.page_token, //当前页码
+            page_size: this.page_size, //每页数量
+          }),
+        })
+          .then((res) => {
+            const list = (res.list || []).map((item) => {
+              item.product_list = (item.product_list || []).map((Sitem) => {
+                Sitem.product_thumb = Sitem.product_thumb ? getServiceUrl(Sitem.product_thumb, "size3") : "";
+                return Sitem;
+              });
+              return item;
+            });
+            //追加列表（首屏替换，分页累加）
+            this.express = this.page_token === '1' ? list : (this.express || []).concat(list);
+            this.next_page_token = res.next_page_token;
+            this.hasNext = !!res.next_page_token;
+          })
+          .catch((err) => {
+            this.$xdLog.catch(err);
+            if (this.page_token === '1') this.express = [];
+          });
+      },
+      /**
+       * @description 切换状态
+       * @param status {string} 状态值
+       */
+      handleStatusChange(status) {
+        this.activeStatus = status;
+        this.page_token = '1';
+        this.getExpressList();
+      },
+      /**
+       * @description 查看物流详情
+       * @param item {object} 包裹对象
+       */
+      handleToDetail(item) {
+        console.log(this.expressPath,'this.expressPath')
+        if (this.$configProject['isPreview']) return;
+        this.$xdUniHelper.navigateTo({
+          url: `${this.expressPath}?package_id=${item.package_id}`,
+        });
+      },
+      /**
+       * @description 复制功能
+       * @param text {string} 复制内容
+       */
+      copy(text) {
+        // #ifdef H5
+        this.$copyText(text).then((res) => {
+          this.$xdAlert({ content: "复制成功" });
+        });
+        // #endif
+        // #ifndef H5
+        uni.setClipboardData({
+          data: text,
+          showToast: false,
+          success: () => {
+            //this.$xdAlert({ content: "复制成功" });
+          },
+        });
+        // #endif
+      },
+      onJfbScroll(options) {
+        console.log('event.onJfbScroll', options)
+      },
+      onJfbReachBottom(options) {
+        if (this.hasNext) {
+          this.page_token = this.next_page_token;
+          this.getExpressList();
+        }
+      },
+      onJfbShow(options) {
+        console.log('event.onJfbShow', options)
+      },
+      onJfbHide(options) {
+        console.log('event.onJfbHide', options)
+      },
+      onJfbBack(options) {
+        console.log('event.onJfbBack', options)
+      },
+      onJfbUpdate(...data) {
+        console.log('event.onJfbUpdate', data)
+      },
+      onJfbCustomEvent(options) {
+        console.log('event.onJfbReachBottom', options)
+      },
+    }
+  }
+
+</script>
+
+<style scoped lang="less">
+  @import "./JfbBaseExpressListLess.less";
+
+  .jfb-base-express-list {
+    &__body {
+      background: #f8f8f8;
+      .fixed_top{
+        position: fixed;
+        top: 0;
+        left: 0;
+        width: 100%;
+        background: #FFFFFF;
+        z-index: 999;
+      }
+    }
+
+    //状态tab栏
+    &__status {
+      background: #fff;
+      display: flex;
+      align-items: center;
+
+      &-item {
+        flex: 1;
+        height: 100rpx;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        color: #666;
+
+        &.is-active {
+          color: #333;
+          font-weight: 600;
+        }
+      }
+
+      &-text {
+        display: flex;
+        align-items: center;
+      }
+
+      &-name {
+        position: relative;
+        font-size: 28rpx;
+      }
+
+      &-line {
+        position: absolute;
+        left: 0;
+        bottom: -8rpx;
+        width: 100%;
+        height: 6rpx;
+        border-radius: 3rpx;
+        background: #333;
+        visibility: hidden;
+
+        &.is-visible {
+          visibility: visible;
+        }
+      }
+
+      &-count {
+        width: 50rpx;
+        height: 40rpx;
+        line-height: 40rpx;
+        margin-left: 8rpx;
+        border-radius: 24rpx;
+        background: rgba(240, 31, 31, 1);
+        box-shadow: 0px 2rpx 4rpx rgba(240, 31, 31, 0.25);
+        color: #fff;
+        font-size: 22rpx;
+        text-align: center;
+        box-sizing: border-box;
+      }
+    }
+
+    //包裹列表
+    &__list {
+      padding: 16rpx;
+    }
+
+    &__item {
+      background: #fff;
+      border-radius: 16rpx;
+      overflow: hidden;
+      margin-bottom: 16rpx;
+
+      &:last-child {
+        margin-bottom: 0;
+      }
+
+      &-title {
+        padding: 24rpx;
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        font-size: 24rpx;
+        color: #999;
+
+        &-left,
+        &-right {
+          display: flex;
+          align-items: center;
+        }
+
+        &-text {
+          margin-left: 12rpx;
+        }
+      }
+
+      &-number {
+        margin: 0 24rpx;
+        padding-bottom: 24rpx;
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+
+        &-info {
+          display: flex;
+          align-items: center;
+          overflow: hidden;
+        }
+
+        &-company {
+          font-size: 32rpx;
+          font-weight: 500;
+          color: #333;
+          margin-right: 16rpx;
+          flex-shrink: 0;
+        }
+
+        &-no {
+          font-size: 32rpx;
+          font-weight: 500;
+          color: #333;
+        }
+
+        &-copy {
+          flex-shrink: 0;
+          border: 2rpx solid #e5e5e5;
+          border-radius: 30rpx;
+          color: #999;
+          font-size: 24rpx;
+          padding: 6rpx 20rpx;
+        }
+      }
+
+      &-goods {
+        border-top: 2rpx solid #f5f5f5;
+        padding: 24rpx;
+
+        &-item {
+          display: flex;
+          align-items: center;
+          margin-bottom: 24rpx;
+
+          &:last-child {
+            margin-bottom: 0;
+          }
+        }
+
+        &-image {
+          width: 160rpx;
+          height: 160rpx;
+          border-radius: 8rpx;
+          flex-shrink: 0;
+        }
+
+        &-info {
+          flex: 1;
+          display: flex;
+          flex-direction: column;
+          justify-content: space-between;
+          min-height: 160rpx;
+          margin-left: 20rpx;
+          overflow: hidden;
+        }
+
+        &-name {
+          font-size: 28rpx;
+          color: #333;
+          line-height: 40rpx;
+          .uni-max-cut(2, 80);
+          word-break: break-all;
+        }
+
+        &-brand {
+          font-size: 24rpx;
+          color: #999;
+          margin-top: 6rpx;
+          .uni-max-cut(1, 32);
+        }
+
+        &-bottom {
+          display: flex;
+          justify-content: space-between;
+          align-items: center;
+          margin-top: 12rpx;
+        }
+
+        &-price {
+          display: flex;
+          align-items: center;
+        }
+
+        &-num {
+          flex-shrink: 0;
+          font-size: 24rpx;
+          color: #999;
+        }
+      }
+    }
+
+    &__empty {
+      padding: 80rpx 0;
+      text-align: center;
+      font-size: 26rpx;
+      color: #999;
+    }
+  }
+</style>

package/src/components/{JfbBaseCardConsumpCode/JfbBaseCardConsumpCodeLess.less → JfbBaseExpressList/JfbBaseExpressListLess.less}

@@ -12,7 +12,7 @@
 }
 
 //start
-.jfb-base-card-consump-code {
+.jfb-base-express-list {
   box-sizing: border-box;
 
   &__body{
@@ -70,7 +70,7 @@
 
 
 /**notPreview**/
-.jfb-base-card-consump-code {
+.jfb-base-express-list {
   //&:before {
     //content: " ";
     //display: table;

package/src/components/{JfbBaseCardConsumpCode/JfbBaseCardConsumpCodeMixin.js → JfbBaseExpressList/JfbBaseExpressListMixin.js}

@@ -16,7 +16,7 @@ export default {
       //@EndAttrData
       
       // #endif
-      cssRoot: 'jfb-base-card-consump-code'
+      cssRoot: 'jfb-base-express-list'
     }
   },
   created() {

package/src/components/JfbBaseExpressList/Mock.js

@@ -0,0 +1,64 @@
+'use strict';
+
+module.exports = {
+  
+  getExpressCount:{
+    "proxy_sign_count": 2,
+    "transport_count": 3
+  },
+  
+  getExpressList:{
+     "list": [
+        {
+            "package_id": "string",
+            "logistics_company_code": "string",
+            "logistics_company_name": "圆通快递",
+            "logistics_number": "9851324944905",
+            "logistics_status": "string",
+            "logistics_send_time": 0,
+            "product_list": [
+                {    
+                    "main_order_id": "string",
+                    "sub_order_id": "string",
+                    "product_id": 0,
+                    "product_name": "港荣蒸蛋糕 奶香味手撕蛋糕900g/箱面包蛋糕早餐面包办公室零食",
+                    "product_sku_name": "33",
+                    "product_num": 1,
+                    "product_thumb": "//sandbox-img.jufubao.cn/uploads/20230522/f1a75df336de07214278e97232207e97.jpg"
+                }
+            ]
+        },
+        {
+            "package_id": "string",
+            "logistics_company_code": "string",
+            "logistics_company_name": "顺丰快递",
+            "logistics_number": "9851324944905",
+            "logistics_status": "string",
+            "logistics_send_time": 0,
+            "product_list": [
+                {
+                    "main_order_id": "string",
+                    "sub_order_id": "string",
+                    "product_id": 0,
+                    "product_name": "良品铺子手撕面包2斤装",
+                    "product_sku_name": "11",
+                    "product_num": 1,
+                    "product_thumb": "//sandbox-img.jufubao.cn/uploads/20230522/24f0e3386a80c2a6659d71862eedcae7.jpg"
+                },
+                {
+                    "main_order_id": "string",
+                    "sub_order_id": "string",
+                    "product_id": 0,
+                    "product_name": "好丽友（orion）零食休闲零食薯条膨化食品呀!土豆番茄酱味70g/袋",
+                    "product_sku_name": "22",
+                    "product_num": 2,
+                    "product_thumb": "//sandbox-img.jufubao.cn/uploads/20230522/eb1d4222f69559e1ac0c999ae01da8ae.jpg"
+                }
+            ]
+        }
+    ],
+    "next_page_token": "string",
+    "total_size": 0
+  },
+  
+}