jufubao-base 1.0.169-beta3 → 1.0.169-beta5

package/src/components/JfbBaseTfkSearch/SkeletonCinema.vue

@@ -0,0 +1,46 @@
+<template>
+  <view class="skeleton-wrap-item">
+    <view class="title skeleton-item"></view>
+    <view class="address skeleton-item"></view>
+    <view class="bottom">
+      <view class="local skeleton-item"></view>
+      <view class="btn skeleton-item"></view>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  name: "SkeletonCinema"
+}
+</script>
+
+<style scoped lang="less">
+.skeleton-wrap-item {
+  height: 220rpx;
+  display: block;
+
+  & > .title {
+    .skeleton-item(100%, 60rpx);
+    margin-bottom: 20rpx;
+  }
+  & > .address {
+    .skeleton-item(100%, 40rpx);
+    margin-bottom: 20rpx;
+  }
+  & > .bottom {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding-top: 30rpx;
+
+    & > .local {
+      .skeleton-item(120rpx, 30rpx);
+    }
+    & > .btn {
+      .skeleton-item(150rpx, 60rpx);
+    }
+  }
+}
+</style>
+

package/src/components/JfbBaseTfkSearch/SkeletonFilm.vue

@@ -0,0 +1,109 @@
+<template>
+  <view class="skeleton-wrap-item">
+    <view class="skeleton-wrap-item-image skeleton-item" :style="{marginRight:outSpacing + 'rpx'}"></view>
+    <view class="skeleton-wrap-item-title">
+      <view class="title skeleton-item"></view>
+      <view class="type skeleton-item"></view>
+      <view class="director skeleton-item"></view>
+      <view class="star skeleton-item"></view>
+    </view>
+    <view class="skeleton-wrap-item-btn skeleton-item" :style="{marginLeft:outSpacing + 'rpx'}">
+      <view class="score skeleton-item"></view>
+      <view class="btn skeleton-item"></view>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  name: "SkeletonFilm",
+  props:{
+    outSpacing:{
+      type: Number|String,
+      default:20
+    }
+  }
+}
+</script>
+
+
+
+<style scoped lang="less">
+.skeleton-wrap-item {
+  height: 240rpx;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+
+  //影片列表骨架
+  &-image {
+    .skeleton-item(160rpx, 240rpx);
+    flex-shrink: 0;
+    margin-right: 20rpx;
+  }
+
+  &-title {
+    flex: 1;
+
+    .title {
+      .skeleton-item(100%, 50rpx);
+      margin-bottom: 20rpx;
+    }
+
+    .director,.star,.type  {
+      .skeleton-item(100%, 40rpx);
+      margin-bottom: 10rpx;
+    }
+  }
+
+  &-btn {
+    display: flex;
+    align-content: space-between;
+    align-items: flex-end;
+    justify-content: flex-end;
+    flex-flow: wrap;
+    height: 100%;
+    box-sizing: border-box;
+    padding: 10rpx 0;
+    width: 130rpx;
+    flex-shrink: 0;
+
+    & > .score {
+      .skeleton-item(100rpx, 40rpx);
+    }
+    & > .btn {
+      .skeleton-item(130rpx, 60rpx);
+    }
+  }
+
+  &:last-child {
+    margin-bottom: 0!important;
+  }
+
+  //影院列表骨架
+  &.list {
+    display: block;
+  }
+  & > .title {
+    .skeleton-item(100%, 60rpx);
+    margin-bottom: 20rpx;
+  }
+  & > .address {
+    .skeleton-item(100%, 40rpx);
+    margin-bottom: 20rpx;
+  }
+  & > .bottom {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding-top: 30rpx;
+
+    & > .local {
+      .skeleton-item(120rpx, 30rpx);
+    }
+    & > .btn {
+      .skeleton-item(150rpx, 70rpx);
+    }
+  }
+}
+</style>

package/src/components/JfbBaseTfkSearch/SkeletonProduct.vue

@@ -0,0 +1,111 @@
+<template>
+  <view class="skeleton-wrap-item">
+    <template v-if="cell===1">
+
+    </template>
+    <template v-if="cell===2">
+
+    </template>
+  </view>
+</template>
+
+<script>
+export default {
+  name: "SkeletonProduct",
+  props:{
+    outSpacing:{
+      type: Number|String,
+      default:20
+    },
+    cell:{
+      type: Number|String,
+      required: true
+    },
+    productConfig(){
+
+    },
+  }
+}
+</script>
+
+
+
+<style scoped lang="less">
+.skeleton-wrap-item {
+  height: 240rpx;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+
+  //影片列表骨架
+  &-image {
+    .skeleton-item(160rpx, 240rpx);
+    flex-shrink: 0;
+    margin-right: 20rpx;
+  }
+
+  &-title {
+    flex: 1;
+
+    .title {
+      .skeleton-item(100%, 50rpx);
+      margin-bottom: 20rpx;
+    }
+
+    .director,.star,.type  {
+      .skeleton-item(100%, 40rpx);
+      margin-bottom: 10rpx;
+    }
+  }
+
+  &-btn {
+    display: flex;
+    align-content: space-between;
+    align-items: flex-end;
+    justify-content: flex-end;
+    flex-flow: wrap;
+    height: 100%;
+    box-sizing: border-box;
+    padding: 10rpx 0;
+    width: 130rpx;
+    flex-shrink: 0;
+
+    & > .score {
+      .skeleton-item(100rpx, 40rpx);
+    }
+    & > .btn {
+      .skeleton-item(130rpx, 60rpx);
+    }
+  }
+
+  &:last-child {
+    margin-bottom: 0!important;
+  }
+
+  //影院列表骨架
+  &.list {
+    display: block;
+  }
+  & > .title {
+    .skeleton-item(100%, 60rpx);
+    margin-bottom: 20rpx;
+  }
+  & > .address {
+    .skeleton-item(100%, 40rpx);
+    margin-bottom: 20rpx;
+  }
+  & > .bottom {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding-top: 30rpx;
+
+    & > .local {
+      .skeleton-item(120rpx, 30rpx);
+    }
+    & > .btn {
+      .skeleton-item(150rpx, 70rpx);
+    }
+  }
+}
+</style>

package/src/components/JfbBaseTfkSearch/SkeletonShop.vue

@@ -0,0 +1,81 @@
+<template>
+  <view class="skeleton-wrap-item">
+    <view class="image  skeleton-item" :style="{marginRight: outSpacing + 'rpx'}"></view>
+    <view class="content">
+      <view class="title">
+        <view class="title-left skeleton-item"></view>
+        <view class="title-right skeleton-item"></view>
+      </view>
+      <view class="address skeleton-item"></view>
+      <view class="phone skeleton-item"></view>
+      <view class="btn">
+        <view class="skeleton-item"></view>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  name: "SkeletonShop",
+  props:{
+    outSpacing:{
+      type: Number|String,
+      default:20
+    }
+  }
+}
+</script>
+
+<style scoped lang="less">
+.skeleton-wrap-item {
+  height: 200rpx;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+
+  & > .image {
+    .skeleton-item(200rpx, 200rpx);
+    flex-shrink: 0;
+  }
+
+  .content {
+    height: 100%;
+
+    .title {
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      margin-bottom: 20rpx;
+
+      &-left {
+        flex: 1;
+        margin-right: 20rpx;
+        .skeleton-item(100%, 40rpx);
+      }
+      &-right {
+        flex-shrink: 0;
+        .skeleton-item(100rpx, 30rpx);
+      }
+    }
+
+    flex: 1;
+    .address {
+      margin-bottom: 10rpx;
+      .skeleton-item(100%, 30rpx);
+    }
+    .phone {
+      margin-bottom: 10rpx;
+      .skeleton-item(100%, 30rpx);
+    }
+    .btn {
+      display: flex;
+      justify-content: flex-end;
+
+      .skeleton-item {
+        .skeleton-item(100rpx, 50rpx)
+      }
+    }
+  }
+}
+</style>

package/src/components/JfbBaseTfkSearch/listMixins.js

@@ -0,0 +1,76 @@
+'use strict';
+import { getContainerPropsValue } from "@/utils/xd.base";
+
+export default {
+  data(){
+    return {
+      isShowExchange:'N',
+
+      contMargin:{},
+      contRradius:'10',
+      contShadow:'',
+      contBorder:'',
+      contBgColor:'',
+      contBorderWidth: 0,
+
+      imgRradius:'10',
+
+      productConfig:null,
+    }
+  },
+  created(){
+
+  },
+  methods:{
+    cusInit(container){
+      this.isShowExchange = getContainerPropsValue(container, 'content.isShowExchange', 'N');
+
+      //商品相关
+      let is_show_brand = getContainerPropsValue(container, 'content.is_show_brand', 'N');
+      let isPrice = getContainerPropsValue(container, 'content.isPrice', "Y");
+      let isShowTag = getContainerPropsValue(container, 'content.isShowTag', "Y");
+      let isShowDiscount = getContainerPropsValue(container, 'content.isShowDiscount', "Y");
+      let isAddCart = getContainerPropsValue(container, 'content.isAddCart', "Y");
+      let differ = getContainerPropsValue(container, 'content.differ', 1);
+      let showActivityPrice = getContainerPropsValue(container, 'content.showActivityPrice', 'N');
+      this.productConfig = {is_show_brand,isPrice,isShowTag,isShowDiscount,isAddCart,differ,showActivityPrice}
+
+      //内容
+      this.contMargin =  getContainerPropsValue(container, 'content.contMargin', {});
+      this.contRradius =  getContainerPropsValue(container, 'content.contRradius', '10');
+      this.contShadow = this.getXdShadow({width:20, color:'rgba(0,0,0,0)'},getContainerPropsValue(container, 'content.contShadow', {}))
+      this.contBorder = this.getXdBorder({width:2,color:'rgba(0,0,0,0)'},getContainerPropsValue(container, 'content.contBorder', {}));
+      this.contBgColor = getContainerPropsValue(container, 'content.contBgColor', '#fff');
+      this.contObjBorder = getContainerPropsValue(container, 'content.contBorder', {});
+      if(this.contObjBorder && this.contObjBorder.type === 'Y') {
+        if(this.contObjBorder.value && this.contObjBorder.value.width) {
+          this.contBorderWidth = Number(this.contObjBorder.value.width);
+        }
+        else this.contBorderWidth = 2;
+      }
+
+      //图片
+      this.imgRradius = getContainerPropsValue(container, 'content.imgRradius', '10');
+
+    },
+
+
+    //通信相关================
+    handleParentVm(cb){
+      cb(this)
+    },
+
+    onJfbReachBottom(options) {
+      console.log('event.onJfbReachBottom', options)
+      this.$refs['customList']['onCusReachBottom'](options)
+
+    },
+
+    onCusReload() {
+      console.log('event.onCusReload', this.options)
+      this.$refs['customList']['onCusReloadList'](this.options)
+    },
+    //通信相关================
+  },
+}
+

package/src/components/JfbBaseTfkSearch/search.js

@@ -0,0 +1,175 @@
+export default {
+  "list": [
+    {
+      "type": "product",
+      "name": "蛋糕1",
+      "detail_url": {
+        "dir": "wtxsaas",
+        "host": "sandbox-website-05.jufubao.cn",
+        "path": "/main/order/detail",
+        "appType": "h5",
+        "site_id": "17928cc37788be02",
+        "site_url": "https://sandbox-website-05.jufubao.cn/wtxsaas/main/order/detail",
+        "frontPath": "/wtxsaas/main/order/detail",
+        "fixed_business_code": ""
+      },
+      "more_url": null,
+      "sort": 1,
+      "setting_id": 1,
+      "next_page_token": "a:2:{i:0;d:625.65704;i:1;s:8:\"60030065\";}",
+      "product_items": [
+        {
+          "brand_id": 100003,
+          "brand_name": "品牌jls0519",
+          "list_title": "3",
+          "market_price": 2000,
+          "market_tags": [],
+          "product_id": 60030143,
+          "product_name": "仅快递实物商品（北京廊坊支持配送）",
+          "product_type": "good",
+          "promo_price": 0,
+          "sale_num": 8,
+          "sale_price": 3000,
+          "status": "ok",
+          "thumb": "/uploads/20231215/b2ce0235129aa592044f96343f25c338.jpeg"
+        },
+        {
+          "brand_id": 20381,
+          "brand_name": "捷诚食品",
+          "list_title": "八瑞祥老北京酱肉1800g",
+          "market_price": 28800,
+          "market_tags": [],
+          "product_id": 60028946,
+          "product_name": "八瑞祥老北京酱肉1800g",
+          "product_type": "good",
+          "promo_price": 0,
+          "sale_num": 0,
+          "sale_price": 22003,
+          "status": "ok",
+          "thumb": "https://img.dangaoss.com/public/p/48/1/1271802_l.jpg"
+        },
+        {
+          "brand_id": 20591,
+          "brand_name": "于小菓",
+          "list_title": "桃山绿豆沙北京福饼260g",
+          "market_price": 12800,
+          "market_tags": [],
+          "product_id": 60017411,
+          "product_name": "桃山绿豆沙北京福饼260g",
+          "product_type": "good",
+          "promo_price": 0,
+          "sale_num": 0,
+          "sale_price": 11141,
+          "status": "ok",
+          "thumb": "https://img.dangaoss.com/public/p/83/14/1257977_l.jpg"
+        },
+        {
+          "brand_id": 30000,
+          "brand_name": "其他",
+          "list_title": "清代戏剧文化史论/北京大学明清研究丛书",
+          "market_price": 2600,
+          "market_tags": [],
+          "product_id": 60029756,
+          "product_name": "清代戏剧文化史论/北京大学明清研究丛书",
+          "product_type": "good",
+          "promo_price": 0,
+          "sale_num": 0,
+          "sale_price": 2195,
+          "status": "ok",
+          "thumb": "https://img1.winxuancdn.com/1305/10251305_9.jpg?1530683968642"
+        },
+        {
+          "brand_id": 30000,
+          "brand_name": "其他",
+          "list_title": "亚洲的崛起(傅骊元文集)/北京大学经济学院教授文库",
+          "market_price": 5000,
+          "market_tags": [],
+          "product_id": 60030080,
+          "product_name": "亚洲的崛起(傅骊元文集)/北京大学经济学院教授文库",
+          "product_type": "good",
+          "promo_price": 0,
+          "sale_num": 0,
+          "sale_price": 4219,
+          "status": "ok",
+          "thumb": "https://img2.winxuancdn.com/9564/10309564_9.jpg?1530754178039"
+        },
+        {
+          "brand_id": 30000,
+          "brand_name": "其他",
+          "list_title": "保险.社会保障与经济改革(孙祁祥文集)/北京大学经济学院教授文库",
+          "market_price": 5200,
+          "market_tags": [],
+          "product_id": 60030078,
+          "product_name": "保险.社会保障与经济改革(孙祁祥文集)/北京大学经济学院教授文库",
+          "product_type": "good",
+          "promo_price": 0,
+          "sale_num": 0,
+          "sale_price": 4388,
+          "status": "ok",
+          "thumb": "https://img3.winxuancdn.com/9416/10309416_9.jpg?1530754178039"
+        },
+        {
+          "brand_id": 30000,
+          "brand_name": "其他",
+          "list_title": "消费:拉动经济增长的引擎(刘方棫文集)/北京大学经济学院教授文库",
+          "market_price": 3500,
+          "market_tags": [],
+          "product_id": 60030082,
+          "product_name": "消费:拉动经济增长的引擎(刘方棫文集)/北京大学经济学院教授文库",
+          "product_type": "good",
+          "promo_price": 0,
+          "sale_num": 0,
+          "sale_price": 2954,
+          "status": "ok",
+          "thumb": "https://img0.winxuancdn.com/9574/10309574_800x800.jpg?1539223598404"
+        },
+        {
+          "brand_id": 20300,
+          "brand_name": "棒棒糖优选",
+          "list_title": "北镇熏鸡",
+          "market_price": 9900,
+          "market_tags": [],
+          "product_id": 60028786,
+          "product_name": "北镇熏鸡",
+          "product_type": "good",
+          "promo_price": 0,
+          "sale_num": 0,
+          "sale_price": 9810,
+          "status": "ok",
+          "thumb": "https://img.dangaoss.com/public/p/52/0/1350907_l.jpg"
+        },
+        {
+          "brand_id": 20390,
+          "brand_name": "京食食品",
+          "list_title": "【300元档】京食中秋礼盒",
+          "market_price": 30000,
+          "market_tags": [],
+          "product_id": 60029124,
+          "product_name": "【300元档】京食中秋礼盒",
+          "product_type": "good",
+          "promo_price": 0,
+          "sale_num": 0,
+          "sale_price": 30128,
+          "status": "ok",
+          "thumb": "https://img.dangaoss.com/public/p/31/14/1313662_l.jpg"
+        },
+        {
+          "brand_id": 30000,
+          "brand_name": "其他",
+          "list_title": "经济学理论及现实问题的思考/北京大学经济学院教授文库",
+          "market_price": 5200,
+          "market_tags": [],
+          "product_id": 60030065,
+          "product_name": "经济学理论及现实问题的思考/北京大学经济学院教授文库",
+          "product_type": "good",
+          "promo_price": 0,
+          "sale_num": 0,
+          "sale_price": 4388,
+          "status": "ok",
+          "thumb": "https://img1.winxuancdn.com/5643/10305643_9.jpg?1530754178022"
+        }
+      ]
+    }
+  ],
+  "request_id": "e554b48ac67480c3"
+}