jufubao-base 1.0.169-beta9 → 1.0.170

package/src/components/JfbBaseTfkSearch/AllList.vue

@@ -1,59 +1,76 @@
 <template>
   <view class="search_all_list" >
     <view class="module_item" v-for="parent in list" :key="parent.setting_id"
-      :style="{
-        padding:contMarginComp,
-      }"
+      :style="moduleItemStyle"
     >
-      <view class="module_title">{{ parent.name }}</view>
-      <view class="module_cont">
-        <view v-for="(item, i) in parent.items" :key="i">
+      <view class="module_title" :style="moduleItemTitleStyle">{{ parent.name }}</view>
+      <view v-if="parent.type !== 'product'" class="module_cont">
+        <view v-for="(item, i) in parent.items" :key="item.key"
+          class="module_cont_inner"
+          :style="moduleItemContStyle"
+        >
           <content-cinema v-if="parent.type === 'cinema'"
             style="width: 100%; height: 100%"
+            :keyword="keyword"
             :item="item"
-            :out-spacing="$parentVm.outSpacing"
-            :color="{SEAT:$parentVm.mainColor,CODE:$parentVm.subMainColor,SELL:$parentVm.successColor}"
-            :border-radius="$parentVm.imgRradius"
-            @on-schedule="(cinema)=>{$parentVm.handleSchedule(cinema,parent)}"
-            @on-cashier-detail="(cinema)=>{$parentVm.handleCashierDetail(cinema,parent)}"
-            @on-code-detail="(cinema)=>{$parentVm.handleCodeDetail(cinema,parent)}"
+            :out-spacing="listItemStyle.outSpacing"
+            :color="{SEAT:listItemStyle.mainColor,CODE:listItemStyle.subMainColor,SELL:listItemStyle.successColor}"
+            :border-radius="listItemStyle.imgRradius"
+            :brand-color="listItemStyle.brandColor"
+            @on-schedule="handleFilmDetail"
+            @on-cashier-detail="handleCashierDetail"
+            @on-code-detail="handleCodeDetail"
           ></content-cinema>
-
           <content-film v-if="parent.type === 'film'"
+            type="hot"
             style="width: 100%; height: 100%"
+            :keyword="keyword"
             :item="item"
-            :out-spacing="$parentVm.outSpacing"
-            :color="$parentVm.mainColor"
-            :border-radius="$parentVm.imgRradius"
-            @on-film-detail="(film_id)=>{$parentVm.handleFilmDetail(film_id, parent)}"
-            @on-buy="(film_id)=>{$parentVm.handleBuy(film_id, parent)}"
+            :out-spacing="listItemStyle.outSpacing"
+            :color="listItemStyle.mainColor"
+            :border-radius="listItemStyle.imgRradius"
+            :brand-color="listItemStyle.brandColor"
+            @on-film-detail="handleFilmDetail"
+            @on-buy="handleBuy"
           ></content-film>
-
           <content-shop v-if="parent.type === 'shop'"
             style="width: 100%; height: 100%"
+            :keyword="keyword"
             :item="item"
-            :out-spacing="$parentVm.outSpacing"
-            :color="$parentVm.mainColor"
-            :border-radius="$parentVm.imgRradius"
-            :is-echange="'Y' || $parentVm.isShowExchange"
-            @on-shop-jhd="(shop)=>{$parentVm.handleShopJhd(shop,parent)}"
-            @on-shop-detail="(shop)=>{$parentVm.handleShopDetail(shop,parent)}"
+            :out-spacing="listItemStyle.outSpacing"
+            :color="listItemStyle.mainColor"
+            :border-radius="listItemStyle.imgRradius"
+            :brand-color="listItemStyle.brandColor"
+            :is-echange="'Y' || listItemStyle.isShowExchange"
+            @on-shop-jhd="handleShopJhd"
+            @on-shop-detail="handleShopDetail"
           ></content-shop>
-
+        </view>
+      </view>
+      <view v-else class="module_cont product_wrap">
+        <view v-for="(item, i) in parent.items" :key="item.key"
+          class="module_cont_inner"
+          :style="[moduleItemContStyle, {
+            width: getProductCell(parent.tab) == 2 ? `calc(50% - ${listItemStyle.outSpacing/2}rpx)`: '100%',
+          }]"
+        >
           <content-product v-if="parent.type === 'product'"
             style="width: 100%; height: 100%"
+            :keyword="keyword"
             :item="item"
-            :product-config="$parentVm.productConfig"
-            :out-spacing="$parentVm.outSpacing"
-            :color="$parentVm.mainColor"
-            :border-radius="$parentVm.imgRradius"
-            :cell="1"
-            @on-product-detail="(product)=>{$parentVm.handleProductDetail(product,parent)}"
+            :height="outItemProduct"
+            :product-config="productConfig"
+            :out-spacing="listItemStyle.outSpacing"
+            :color="listItemStyle.mainColor"
+            :brand-color="listItemStyle.brandColor"
+            :border-radius="listItemStyle.imgRradius"
+            :cell="getProductCell(parent.tab)"
+            @on-product-detail="handleProductDetail"
           ></content-product>
         </view>
       </view>
       <view class="module_more">
-        <view>查看全部{{ parent.name }} >></view>
+        <view class="more_inner" :style="moduleMoreStyle" @click="switchMenu(parent)">查看全部</view>
       </view>
     </view>
   </view>
@@ -64,6 +81,7 @@
   import ContentFilm from "./ContentFilm.vue"
   import ContentShop from "./ContentShop.vue"
   import ContentProduct from "./ContentProduct.vue"
+  import {mapState} from "vuex";
   export default{
     name: "SearchAllList",
     components: {
@@ -73,109 +91,119 @@
       ContentProduct
     },
     props: {
-
+      keyword:{
+        type:String,
+        default:'',
+      },
+      allStyle: {
+        type:Object,
+      },
+      listItemStyle:{
+        type:Object|null,
+        default:null,
+      },
+      productConfig:{
+        type:Object|null,
+        default:null,
+      },
     },
     computed: {
+      ...mapState({
+        stateCity: state => state.cityLocation.city,
+        stateLocation: (state) => state.cityLocation.location || {},
+      }),
       contMarginComp(){
-        let str = `${this.$parentVm.checkValue(this.$parentVm.contMargin.top, 20)}rpx`;
-        str = `${str} ${this.$parentVm.checkValue(this.$parentVm.contMargin.right, 20)}rpx`;
-        str = `${str} ${this.$parentVm.checkValue(this.$parentVm.contMargin.bottom, 20)}rpx`;
-        str = `${str} ${this.$parentVm.checkValue(this.$parentVm.contMargin.left, 20)}rpx`;
+        if(this.getParent === null) return 0
+        let str = `${this.getParent().checkValue(this.listItemStyle.contMargin.top, 20)}rpx`;
+        str = `${str} ${this.getParent().checkValue(this.listItemStyle.contMargin.right, 20)}rpx`;
+        str = `${str} ${this.getParent().checkValue(this.listItemStyle.contMargin.bottom, 20)}rpx`;
+        str = `${str} ${this.getParent().checkValue(this.listItemStyle.contMargin.left, 20)}rpx`;
         return str
       },
+      moduleItemStyle(){
+        const { allModuleRadius, allModulePadding, allListBgColor, allModuleMargin } = this.allStyle;
+        let padding = `${this.checkValue(allModulePadding.top, 20)}rpx`;
+        padding = `${padding} ${this.checkValue(allModulePadding.right, 20)}rpx`;
+        padding = `${padding} ${this.checkValue(allModulePadding.bottom, 20)}rpx`;
+        padding = `${padding} ${this.checkValue(allModulePadding.left, 20)}rpx`;
+
+        return this.styleObjectToString({
+          background: allListBgColor,
+          padding: padding,
+          marginBottom: allModuleMargin + 'rpx',
+          borderRadius: allModuleRadius + 'rpx',
+        })
+      },
+      moduleItemTitleStyle(){
+        const { allModuleTitlePadding, allModuleTitleStyle, allModuleTitleBgColor } = this.allStyle;
+        let padding = `${this.checkValue(allModuleTitlePadding.top, 20)}rpx`;
+        padding = `${padding} ${this.checkValue(allModuleTitlePadding.right, 20)}rpx`;
+        padding = `${padding} ${this.checkValue(allModuleTitlePadding.bottom, 20)}rpx`;
+        padding = `${padding} ${this.checkValue(allModuleTitlePadding.left, 20)}rpx`;
+
+        let style = {padding: padding};
+        if(allModuleTitleStyle === 'underline'){
+          style['borderBottom'] = '1px solid #EEEEEE';
+        }else{
+          style['background'] = allModuleTitleBgColor;
+        }
+
+        return this.styleObjectToString(style);
+      },
+      moduleItemContStyle(){
+        const { contBgColor, contShadow, contBorder, contMargin, contRradius, outSpacing } = this.listItemStyle;
+    
+        let padding = `${this.checkValue(contMargin.top, 20)}rpx`;
+        padding = `${padding} ${this.checkValue(contMargin.right, 20)}rpx`;
+        padding = `${padding} ${this.checkValue(contMargin.bottom, 20)}rpx`;
+        padding = `${padding} ${this.checkValue(contMargin.left, 20)}rpx`;
+        return this.styleObjectToString({
+          padding: padding,
+          border: contBorder,
+          borderRadius: contRradius + 'rpx',
+          boxShadow: contShadow,
+          marginBottom: outSpacing + 'rpx',
+          background: contBgColor,
+        })
+      },
+      moduleMoreStyle(){
+        const { allModuleMoreStyle } = this.allStyle;
+        let style = {};
+        if(allModuleMoreStyle === 'text'){
+
+        }else{
+          style['border'] = '1px solid #EEEEEE';
+          style['background'] = '#EEEEEE';
+          style['color'] = '#999999';
+        }
+        return this.styleObjectToString(style);
+      },
+      outItemProduct(){
+        if(this.getParent === null) return 0
+        //获取每列元素最大宽度
+        let num = (750 - 3 * Number(this.listItemStyle.outSpacing))/2;
+        num = num - this.getParent().checkValue(this.listItemStyle.contMargin.right, 20) - this.getParent().checkValue(this.listItemStyle.contMargin.left, 20);
+        return num - this.listItemStyle.contBorderWidth * 2
+      },
+    },
+    watch: {
+      keyword(){
+        this.getList()
+      },
+      stateCity(n, o){
+        if(n && JSON.stringify(n) !== JSON.stringify(o)){
+          this.getList()
+        }
+      },
     },
     data(){
       return {
+        /**@type Function|null**/
+        getParent:null,
         $parentVm:null,
         parentStatus: false,
 
-        list: [
-              {
-                  "type": "product",
-                  "name": "蛋糕",
-                  "detail_redirect_data": "{\"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\":\"\"}",
-                  "detail1_redirect_data": "",
-                  "more_redirect_data": "",
-                  "sort": 0,
-                  "setting_id": 1,
-                  "next_page_token": "a:2:{i:0;d:1705.0785;i:1;s:8:\"60030143\";}",
-                  "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"
-                      }
-                  ]
-              },
-              {
-                  "type": "shop",
-                  "name": "蛋糕",
-                  "detail_redirect_data": "",
-                  "detail1_redirect_data": "",
-                  "more_redirect_data": "",
-                  "sort": 1,
-                  "setting_id": 5,
-                  "next_page_token": "a:1:{i:0;d:4.4;}",
-                  "items": [
-                      {
-                          "brand_id": 0,
-                          "brand_name": "",
-                          "shop_icon": "https://dimg04.uat.qa.nt.ctripcorp.com/images/1lo4a12000007fyeg8D96.gif",
-                          "distance": 4,
-                          "business_status": "5",
-                          "full_address": "北京北京北京市东城区景山前街4号",
-                          "phone": "",
-                          "consume_mode": [
-                              "TRAVEL"
-                          ],
-                          "consume_mode_name": "",
-                          "shop_id": 1052782,
-                          "resource_shop_id": 8000302,
-                          "resource_shop_name": "故宫-测试1-攻略修改",
-                          "shop_tags": {},
-                          "stars": 2
-                      }
-                  ]
-              },
-              {
-                  "type": "cinema",
-                  "name": "影院",
-                  "detail_redirect_data": "{\"dir\":\"apply06\",\"host\":\"sandbox-website-05.jufubao.cn\",\"path\":\"\\/main\\/movie\\/suhedule\",\"appType\":\"h5\",\"site_id\":\"17928cc37788be02\",\"site_url\":\"https:\\/\\/sandbox-website-05.jufubao.cn\\/apply06\\/main\\/movie\\/suhedule\",\"frontPath\":\"\\/apply06\\/main\\/movie\\/suhedule\",\"fixed_business_code\":\"\"}",
-                  "detail1_redirect_data": "{\"dir\":\"apply06\",\"host\":\"sandbox-website-05.jufubao.cn\",\"path\":\"\\/main\\/movie\\/cdetailnew\",\"appType\":\"h5\",\"site_id\":\"17928cc37788be02\",\"site_url\":\"https:\\/\\/sandbox-website-05.jufubao.cn\\/apply06\\/main\\/movie\\/cdetailnew\",\"frontPath\":\"\\/apply06\\/main\\/movie\\/cdetailnew\",\"fixed_business_code\":\"\"}",
-                  "more_redirect_data": "",
-                  "sort": 3,
-                  "setting_id": 10,
-                  "next_page_token": 1,
-                  "items": [
-                      {
-                          "address": "朝阳区安慧里三区10号 （北辰购物中心对面）",
-                          "brand_id": 0,
-                          "brand_name": "",
-                          "cinema_id": 6771413,
-                          "cinema_name": "北京剧院",
-                          "cinema_type": [
-                              "SEAT"
-                          ],
-                          "cinema_type_name": [
-                              "在线选座"
-                          ],
-                          "distance": "",
-                          "is_open": "Y",
-                          "shop_icon": ""
-                      }
-                  ]
-              }
-        ],
+        list: [],
       }
     },
     created(){
@@ -183,22 +211,85 @@
       this.getList();
     },
     methods: {
+      checkValue(value, defaultValue){
+        return this.getParent().checkValue(value, defaultValue);
+      },
+      getProductCell(str = ''){
+        let cellNum = str.split("@")[3] || 1;
+        return Number(cellNum);
+      },
       getParentMV(){
-        this.$emit('on-parent-vm', ($vm)=>{
-          this.$parentVm = $vm;
+        this.$emit('on-parent-vm', (getParent)=>{
+          this.getParent = getParent;
           this.parentStatus = true;
         })
       },
       getList(){
+        let params = {keyword: this.keyword};
+        //设置城市
+        if(this.stateCity && this.stateCity.city_code) {
+          params['city_code'] = this.stateCity.city_code;
+        }
+
+        //设置经纬度
+        if(this.stateLocation &&
+          (this.stateLocation.latitude && this.stateLocation.longitude)
+        ){
+          params['latitude'] = this.stateLocation.latitude;
+          params['longitude'] = this.stateLocation.longitude;
+        }
+
         this.$xdShowLoading({});
         this.$emit('on-list', {
-          params: {},
+          params: params,
           cb:(list)=>{
-            this.list = list;
+            this.list = (list || []).map(parent => {
+              parent.items = parent.items.map(item => {
+                item['key'] = item.product_id || item.resource_shop_id || item.cinema_id || item.film_id;
+                return item;
+              })
+              return parent;
+            });
             this.$xdHideLoading();
           }
         })
-      }
+      },
+      switchMenu(item){
+        this.$emit('on-switch', {...item, value: item.tab});
+      },
+
+
+      //影片
+      handleFilmDetail(film){
+        this.getParent().handleFilmDetail(film, this.dataConfig)
+      },
+      handleBuy(film){
+        this.getParent().handleBuy(film, this.dataConfig)
+      },
+
+      //影院
+      handleSchedule(cinema){
+        this.getParent().handleSchedule(cinema, this.dataConfig)
+      },
+      handleCashierDetail(cinema){
+        this.getParent().handleCashierDetail(cinema, this.dataConfig)
+      },
+      handleCodeDetail(cinema){
+        this.getParent().handleCodeDetail(cinema, this.dataConfig)
+      },
+
+      //门店
+      handleShopJhd(shop){
+        this.getParent().handleShopJhd(shop, this.dataConfig)
+      },
+      handleShopDetail(shop){
+        this.getParent().handleShopDetail(shop, this.dataConfig)
+      },
+
+      //商品
+      handleProductDetail(product){
+        this.getParent().handleProductDetail(product, this.dataConfig)
+      },
     }
   }
 </script>
@@ -210,22 +301,37 @@
       margin-bottom: 20rpx;
     }
     .module_title{
-      height: 88rpx;
-      line-height: 88rpx;
-      border-bottom: 1px solid #EEEEEE;
       font-size: 28rpx;
       color: #333333;
     }
     .module_cont{
       padding: 20rpx 0;
+
+      &.product_wrap{
+        display: flex;
+        justify-content: space-between;
+        flex-wrap: wrap;
+      }
+
+      .module_cont_inner{
+        box-sizing: border-box;
+      }
     }
     .module_more{
       display: flex;
       justify-content: center;
       align-items: center;
-      height: 80rpx;
       font-size: 26rpx;
       color: #999999;
+      margin-top: 32rpx;
+      .more_inner{
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        height: 70rpx;
+        width: 200rpx;
+        border-radius: 80rpx;
+      }
     }
   }
-</style>
+</style>

package/src/components/JfbBaseTfkSearch/Api.js

@@ -9,7 +9,7 @@ module.exports = [
     //设置方法名字当别忘记加上【模块名字】：Tfk
     mapFnName: 'getTfkSearchList',
     title: '获取s搜索列表',
-    path: '/mall/v1/search',
+    path: '/mall/v1/msearch',
     isRule: false,
     params: {
       keyword: ['模糊搜索关键字', 'Number', '必选'],