jufubao-base 1.0.233-beta2 → 1.0.233-beta31

package/src/components/JfbBaseHeaderColumn/JfbBaseHeaderColumn.vue

@@ -1,516 +0,0 @@
-<template>
-  <view
-    class="jfb-base-header-column"
-    @click="handleEditxSelect"
-    :class="{ editx : isEditx && active }"
-  >
-    <!--#ifdef H5-->
-    <view
-      class="jfb-base-header-column__edit"
-      :class="{ editx : isEditx && active }"
-      v-if="isEditx && active"
-    >
-      <view class="jfb-base-header-column__edit-icon" @click="delEdit">删除</view>
-    </view>
-    <!-- #endif -->
-    <view class="jfb-base-header-column__body">
-      <view
-        class="header_wrap"
-        :style="{
-          background: backgroundColor,
-          borderBottom: bottomBorder
-        }"
-      >
-        <view class="header_sec header_top">
-          <view class="header_wrap-back" @click="onJfbBack" v-if="showBack==='Y'">
-            <xd-font-icon :size="30" :color="textColor" icon="iconxiangzuo_xian"/>
-          </view>
-          <view class="site_wrap" :style="[siteBoxStyle]">
-            <view v-if="showPartner==='Y'" class="name_logo">
-              <view v-if="logo" class="logo">
-                <image :src="logo" mode="heightFix"></image>
-              </view>
-              <view v-if="showPartnerName==='Y'" class="name" :style="{color: textColor}">{{partnerName}}</view>
-            </view>
-          </view>
-          
-        </view>
-        <view class="header_sec header_bottom">
-          <view v-if="loaded && showLocation==='Y' && searchBoxPosition==='out'" class="header_wrap-city">
-            <xd-city-show-api
-              @done="handleCityDone"
-              @onChange="handleCityChange"
-              :color="textColor"
-              :icon="locationIcon"
-              :bgColor="locationBackgroundColor"
-              :key="showLocationKey"
-            ></xd-city-show-api>
-          </view>
-          <view
-            class="search_wrap"
-            @click="toSearch"
-            :style="{
-              background:inputBackgroundColor,
-              color:inputTextColor,
-              borderRadius: searchBoxRadius + 'rpx',
-              border: inputBorder
-            }"
-          >
-            <view v-if="loaded && showLocation==='Y' && searchBoxPosition==='in'" class="header-city-in" @click.stop>
-              <xd-city-show-api
-                @done="handleCityDone"
-                @onChange="handleCityChange"
-                :color="textColor"
-                :icon="locationIcon"
-                :bgColor="locationBackgroundColor"
-                :key="showLocationKey"
-              ></xd-city-show-api>
-            </view>
-            <xd-font-icon v-if="searchIconPosition==='left'" :icon="icon" :color="iconColor" size="32"/>
-            <input
-              v-if="useSearch==='Y'"
-              :placeholder="placeholder"
-              class="search_input"
-              :value="keyword"
-              @input="handleInput"
-              @click="toSearch"
-              :placeholder-style="'color:' + inputTextColor"
-            />
-            <view v-else class="search_placeholder">{{placeholder}}</view>
-            <xd-font-icon v-if="searchIconPosition==='right'" :icon="icon" :color="iconColor" size="32"/>
-            <view v-if="showSearchBtn==='Y' && searchBtnPosition==='in'"
-              class="search_btn_in"
-              :style="[searchBtnStyle]"
-              @click.stop="doSearch"
-            >{{searchBtnText || '搜索'}}</view>
-          </view>
-          <view v-if="showSearchBtn==='Y' && searchBtnPosition==='out'"
-            class="search_btn_out"
-            :style="[searchBtnStyle]"
-            @click="doSearch"
-          >{{searchBtnText || '搜索'}}</view>
-          <!-- 非预览情况下，H5隐藏客服功能 -->
-          <!--#ifdef H5-->
-          <view v-if="isPreview">
-            <view  v-if="showQuickEntry==='Y'" @click="handleQuickEntry" :style="{backgroundColor:quickBackgroundColor}" class="quick">
-              <xd-font-icon size="32" :style="{color:quickTextColor||mainColor}" :icon="quickIcon"></xd-font-icon>
-            </view>
-          </view>
-          <view v-else>
-            <view  v-if="showQuickEntry==='Y'&&quickEntryType!=='service'" @click="handleQuickEntry" :style="{backgroundColor:quickBackgroundColor}" class="quick">
-              <xd-font-icon size="32" :style="{color:quickTextColor||mainColor}" :icon="quickIcon"></xd-font-icon>
-            </view>
-          </view>
-          <!-- #endif -->
-          <!-- #ifdef MP-WEIXIN -->
-          <view  v-if="showQuickEntry==='Y'&&quickEntryType!=='service'" @click="handleQuickEntry" :style="{backgroundColor:quickBackgroundColor}" class="quick">
-            <xd-font-icon size="32" :style="{color:quickTextColor||mainColor}" :icon="quickIcon"></xd-font-icon>
-          </view>
-          <button v-if="showQuickEntry==='Y'&&quickEntryType==='service'" :style="{backgroundColor:quickBackgroundColor}" class="quick-button" open-type="contact">
-            <xd-font-icon size="32" :style="{color:quickTextColor||mainColor}" :icon="quickIcon"></xd-font-icon>
-          </button>
-          <!-- #endif -->
-        </view>
-        
-      </view>
-    </view>
-  </view>
-</template>
-
-<script>
-  import XdFontIcon from "@/components/XdFontIcon/XdFontIcon";
-  import XdCityShowApi from "@/components/XdCityShowApi/XdCityShowApi"
-  import { jfbRootExec, jfbRootFnExec } from "@/utils/xd.event";
-  import JfbBaseHeaderColumnMixin from "./JfbBaseHeaderColumnMixin";
-  import { getContainerPropsValue } from "@/utils/xd.base";
-  import componentsMixins from "@/mixins/componentsMixins";
-  import extsMixins from "@/mixins/extsMixins";
-  import getServiceUrl from "@/common/getServiceUrl";
-  import {mapState, mapMutations } from 'vuex';
-  export default {
-    name: "JfbBaseHeaderColumn",
-    components: {
-      XdFontIcon,
-      XdCityShowApi
-    },
-    mixins: [
-      componentsMixins, extsMixins, JfbBaseHeaderColumnMixin
-    ],
-    computed:{
-      ...mapState(['siteInfo']),
-      searchBtnStyle(){
-        return {
-          background: this.searchBtnBgColor,
-          color: this.searchBtnTextColor,
-          borderRadius: this.searchBtnRadius + 'rpx'
-        }
-      },
-      siteBoxStyle(){
-        return {
-          justifyContent: this.sitePosition
-        }
-      },
-    },
-    data() {
-      return {
-        timer: null,
-        saveKey: 'xd_user_current_access_city', //用户选中城市存储key
-        loaded: false,
-        keyword: "",
-        isPreview: false,
-
-        //面板
-        showLocation: "",
-        showLocationKey: 'showLocationKey',
-        showBack: "",
-        showPartner: "",
-        showPartnerName: "",
-        logo: "",
-        partnerName: "",
-        useSearch: "N",   //Y:用于搜索;  N:用于跳转搜索页面
-        searchPagePath: "",
-        placeholder: "请输入关键词",
-        choseCityPath: "",  //选择城市i
-        quickEntryPath: "",  //快速入口
-        quickBackgroundColor: "",
-        quickTextColor: "",
-        quickIcon: "",
-        showQuickEntry: '',
-        quickEntryType: "",
-
-        //基础
-        textColor: '',
-        backgroundColor: '',
-        inputBackgroundColor: '',
-        inputTextColor: '',
-
-
-        //ICON
-        icon: '',
-        iconColor: '',
-
-        //边框
-        is_border: 'Y',
-        is_border_w: 0,
-        is_border_c: '',
-
-        //定位ICON
-        locationIcon: "",
-        locationBackgroundColor: "",
-
-        sitePosition: "left",
-
-        //
-        searchBoxPosition: "out",
-        searchIconPosition: "right",
-        showSearchBtn: "",
-        searchBtnPosition: "out",
-        searchBtnText: "",
-        searchBtnBgColor: "",
-        searchBtnTextColor: "",
-        searchBtnRadius: 0,
-        searchBoxRadius: 30,
-        bottomBorder: "",
-        inputBorder: "",
-      }
-    },
-    watch: {
-      container(value, oldValue) {
-        if (JSON.stringify(value) === JSON.stringify(oldValue)) return;
-        if (this.$configProject['isPreview']) this.init(value)
-      },
-    },
-    created() {
-      this.init(this.container);
-      this.isPreview = this.$configProject['isPreview'];
-      //todo
-    },
-    methods: {
-      ...mapMutations(['setShowSwitchCity', 'setCityInfo']),
-      onJfbLoad(options) {
-        this.loaded = true;
-      },
-      /**
-       * @description 监听事件变化
-       * @param container {object} 业务组件对象自己
-       */
-      init(container) {
-        this.showLocation = getContainerPropsValue(container, "content.showLocation", "Y");
-        this.showBack = getContainerPropsValue(container, "content.showBack", "Y");
-        this.showPartner = getContainerPropsValue(container, "content.showPartner", "Y")
-        this.showPartnerName = getContainerPropsValue(container, "content.showPartnerName", "N");
-        this.placeholder = getContainerPropsValue(container, "content.placeholder",'请输入关键词');
-        this.useSearch = getContainerPropsValue(container, "content.useSearch", "Y");
-        this.searchPagePath = getContainerPropsValue(container, "content.searchPagePath", {value:""}).value;
-        this.choseCityPath = getContainerPropsValue(container, "content.choseCityPath", {value:""}).value;
-
-
-        //基础
-        this.backgroundColor = getContainerPropsValue(container, "content.backgroundColor", '#fff');
-        this.icon = getContainerPropsValue(container, "content.icon", 'iconsousuo_mian');
-        this.iconColor = getContainerPropsValue(container, "content.iconColor", '#333');
-        this.inputBackgroundColor = getContainerPropsValue(container, "content.inputBackgroundColor", '#eee');
-        this.inputTextColor = getContainerPropsValue(container, "content.inputTextColor", '#999');
-        this.textColor = getContainerPropsValue(container, "content.textColor", '#333');
-        this.locationIcon = getContainerPropsValue(container, "content.locationIcon", "icondizhitubiao")
-        this.locationBackgroundColor = getContainerPropsValue(container, "content.locationBackgroundColor", "")
-
-        this.is_border = getContainerPropsValue(container, 'content.is_border', 'N');
-        this.is_border_c = getContainerPropsValue(container, 'content.is_border_c', '#fff');
-        this.is_border_w = getContainerPropsValue(container, 'content.is_border_w', '2');
-
-        this.sitePosition = getContainerPropsValue(container, 'content.sitePosition', "left");
-
-        this.searchBoxPosition = getContainerPropsValue(container, 'content.searchBoxPosition', "out");
-        this.searchIconPosition = getContainerPropsValue(container, 'content.searchIconPosition', "right");
-        this.showSearchBtn = getContainerPropsValue(container, 'content.showSearchBtn', "");
-        this.searchBtnPosition = getContainerPropsValue(container, 'content.searchBtnPosition', "out");
-        this.searchBtnText = getContainerPropsValue(container, 'content.searchBtnText', "");
-        this.searchBtnBgColor = getContainerPropsValue(container, 'content.searchBtnBgColor', "");
-        this.searchBtnTextColor = getContainerPropsValue(container, 'content.searchBtnTextColor', "");
-        this.searchBtnRadius = getContainerPropsValue(container, 'content.searchBtnRadius', 100);
-        this.searchBoxRadius = getContainerPropsValue(container, 'content.searchBoxRadius', 30);
-        let bottomBorder = getContainerPropsValue(container, 'content.bottomBorder', "Y");
-        console.log("this.bottomBorder", this.bottomBorder)
-        this.bottomBorder = this.getBorderCompatibleOldStyle(bottomBorder, {})
-        this.inputBorder = this.getXdBorder({}, getContainerPropsValue(container, 'content.inputBorder', {}))
-
-        //快捷入口
-        this.quickBackgroundColor = getContainerPropsValue(container, 'content.quickBackgroundColor', "#FFEDDB");
-        this.quickTextColor = getContainerPropsValue(container, 'content.quickTextColor', "");
-        this.quickIcon = getContainerPropsValue(container, 'content.quickIcon', "iconkefu");
-        this.showQuickEntry = getContainerPropsValue(container, 'content.showQuickEntry', "N");
-        this.quickEntryType = getContainerPropsValue(container, 'content.quickEntryType', "");
-        this.quickEntryPath = getContainerPropsValue(container, 'content.quickEntryPath', {value:""}).value;
-
-        let name , logo, platform_logo;
-        if (this.projectAttr['site_name']) name = this.projectAttr['site_name'];
-        if (this['siteInfo'] && this['siteInfo']['mapping'] && this['siteInfo']['mapping']['site_name'])  name = this['siteInfo']['mapping']['site_name'];
-        if (this.projectAttr['site_logo']) logo = getServiceUrl(this.projectAttr['site_logo'], 'size3');
-        if (this.projectAttr['platform_logo']) platform_logo = getServiceUrl(this.projectAttr['platform_logo'], 'size3');
-        this.logo = platform_logo || logo || '//dummyimage.com/100x100';
-        this.partnerName  = name || '聚福宝福利';
-
-        if(this.isPreview){
-          document.querySelector('.xd-Layout__top').style.zIndex = 149099;
-        }
-      },
-      handleInput(e){
-        this.keyword = e.detail.value;
-        //如果有搜索按钮，则不自动执行搜索
-        if(this.showSearchBtn === 'Y') return;
-        if(this.timer) clearTimeout(this.timer);
-        this.timer = setTimeout(() => {
-          jfbRootFnExec(this, 'onCustomEvent')("baseHeader@search", e.detail.value);
-        }, 300)
-      },
-      doSearch(){
-        if(this.useSearch === "N"){
-          this.$xdUniHelper.navigateTo({
-            url: this.searchPagePath
-          })
-        }else{
-          jfbRootFnExec(this, 'onCustomEvent')("baseHeader@search", this.keyword);
-        }
-      },
-      toSearch(){
-        if(this.useSearch === 'N'){
-          this.$xdUniHelper.navigateTo({
-            url: this.searchPagePath
-          })
-        }
-      },
-
-      /***
-       * @description 定位完成事件
-       * @param city
-       */
-      handleCityDone({city}) {
-        if(JSON.stringify(this.city) === JSON.stringify(city)) return false;
-        this.city = city;
-        jfbRootFnExec(this, 'onCustomEvent')("baseHeader@city", city);
-      },
-
-      handleCityChange() {
-        this.$xdUniHelper.navigateTo({
-          url: this.choseCityPath
-        },true)
-      },
-
-      handleQuickEntry() {
-          this.$xdUniHelper.navigateTo({
-            url: this.quickEntryPath
-          })
-      },
-
-      onJfbBack(options) {
-        if(getCurrentPages().length === 1 ) {
-          this.$xdUniHelper.redirectTo({
-            url: this.$settings.index
-          })
-          return
-        }
-        this.$xdUniHelper.navigateBack();
-      },
-      onJfbCustomEvent({action, data}){
-        if(action === 'baseTfkSearch@keyword'){
-          this.keyword = data;
-        }
-      }
-    }
-  }
-
-</script>
-
-<style scoped lang="less">
-  @import "./JfbBaseHeaderColumnLess.less";
-
-  .jfb-base-header-column {
-    &__body{
-      height: unit(200, rpx);
-      .header_wrap{
-        box-sizing: border-box;
-        width: 100%;
-        z-index: 2;
-        height: unit(200, rpx);
-        padding: 0 unit(20, rpx) 0 0;
-        display: flex;
-        flex-direction: column;
-        justify-content: space-between;
-        align-items: stretch;
-        .header_sec{
-          display: flex;
-          align-items: center;
-          justify-content: space-between;
-          height: unit(100, rpx);
-          .site_wrap{
-            flex: 1;
-            display: flex;
-            align-items: center;
-          }
-        }
-        .quick {
-          display: flex;
-          align-items: center;
-          justify-content: center;
-          padding: 12rpx 24rpx;
-          border-radius: 36rpx;
-          margin-left: 16rpx;
-        }
-        .quick-button {
-          display: flex;
-          align-items: center;
-          justify-content: center;
-          padding: 12rpx 24rpx;
-          border-radius: 36rpx;
-          margin-left: 16rpx;
-          line-height: inherit;
-        }
-        .quick-button::after{
-          border: none !important;
-        }
-
-        &-back {
-          padding-left: unit(20, rpx);
-          height: unit(110, rpx);
-          display: flex;
-          justify-content: center;
-          align-items: center;
-          flex-shrink: 0;
-        }
-
-        &-city {
-          height: unit(110, rpx);
-          // padding-left: unit(20, rpx);
-          display: flex;
-          justify-content: center;
-          align-items: center;
-          flex-shrink: 0;
-        }
-
-        .name_logo{
-          display: flex;
-          align-items: center;
-          flex-shrink: 0;
-          height: unit(60, rpx);
-          padding-left: unit(20, rpx);
-
-          .logo{
-            margin-right: unit(20, rpx);
-            height: 100%;
-            max-width: 140px;
-            display: flex;
-            justify-content: center;
-            align-items: center;
-            image{
-              max-width: 100%;
-              max-height: 100%;
-            }
-          }
-          .name{
-            font-size: unit(28, rpx);
-          }
-        }
-
-        .search_wrap{
-          margin-left: unit(20, rpx);
-          flex: 1;
-          padding: 0rpx 20rpx;
-          height: 64rpx;
-          border-radius: unit(50, rpx);
-          display: flex;
-          align-items: center;
-          .header-city-in{
-            position: relative;
-            padding-right: 28rpx;
-            margin-right: 20rpx;
-            &::before{
-              content: " ";
-              position: absolute;
-              width: 2rpx;
-              height: 100%;
-              background-color: #CCCCCC;
-              right: -0rpx;
-              top: 0rpx;
-            }
-            ::v-deep .xd-city{
-              padding: 0;
-            }
-          }
-          .search_input{
-            flex: 1;
-            text-align: left;
-            font-size: unit(28,rpx);
-            padding-left: 20rpx;
-          }
-          .search_placeholder{
-            flex: 1;
-            width: 100%;
-            text-align: left;
-            font-size: unit(28, rpx);
-            padding-left: 20rpx;
-          }
-          .search_btn_in{
-            height: 48rpx;
-            display: flex;
-            align-items: center;
-            justify-content: center;
-            padding: 4rpx 32rpx;
-            font-size: 28rpx;
-            box-sizing: border-box;
-          }
-        }
-        .search_btn_out{
-          height: 64rpx;
-          margin-left: 4px;
-          padding: 8rpx 32rpx;
-          font-size: 28rpx;
-          box-sizing: border-box;
-          display: flex;
-          align-items: center;
-          justify-content: center;
-        }
-      }
-    }
-  }
-</style>

package/src/components/JfbBaseHeaderColumn/JfbBaseHeaderColumnLess.less

@@ -1,79 +0,0 @@
-/**
-* @desc 获取绝对路径完整地址
-* @param @path
-**/
-//例如：https://image.jufubao.cn/20220501010108/image/bg/default_gonghui_bg.png
-@basePath: 'business/';
-@doMain: '//sandbox-img.jufubao.cn/';
-
-.getBusinessImageUrl(@path, @size: 'size8') {
-  @url: "@{doMain}@{basePath}@{path}?x-oss-process=style/@{size}";
-  background-image: url(@url);
-}
-
-//start
-.jfb-base-header-column {
-  box-sizing: border-box;
-
-  &__body{
-      position: relative;
-      overflow: hidden;
-      z-index: 2
-  }
-
-  &.editx,&.editx:hover {
-    position: relative;
-    min-height: unit(100, rpx);
-    z-index: 3;
-    &::after {
-      border: 2rpx dashed blue;
-      content: " ";
-      position: absolute;
-      top:0;
-      left:0;
-      bottom:0;
-      right:0;
-      z-index: 4;
-      cursor: pointer;
-    }
-
-  }
-
-
-  &__edit {
-    cursor: pointer;
-    position: absolute;
-    right: unit(0, rpx);
-    top: unit(-52, rpx);
-    height: unit(50, rpx);
-    line-height: unit(50, rpx);
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    background: rgba(0, 0, 0, .6);
-    border-radius: unit(10, rpx);
-    box-shadow: 0 0 10px rbga(0, 0, 0, 0.3);
-    color: #fff;
-    font-size: unit(22, rpx);
-
-    &-icon{
-      padding: 0 unit(20, rpx);
-    }
-
-    &.editx {
-      box-sizing: border-box;
-
-    }
-  }
-}
-//end
-
-
-/**notPreview**/
-.jfb-base-header-column {
-  //&:before {
-    //content: " ";
-    //display: table;
-  //}
-}
-/**endNotPreview**/

package/src/components/JfbBaseHeaderColumn/JfbBaseHeaderColumnMixin.js

@@ -1,30 +0,0 @@
-'use strict';
-
-
-//@AttrImport
-import Attr from "./Attr";
-//@EndAttrImport
-
-
-export default {
-  data() {
-    return {
-      //#ifdef H5
-      
-      //@AttrData
-      Attr:{}, //对外开发编辑属性
-      //@EndAttrData
-      
-      // #endif
-      cssRoot: 'jfb-base-header-column'
-    }
-  },
-  created() {
-    
-    //@AttrDataCreated
-    this.Attr = this.$xdUniHelper.customClone(Attr);
-    //@EndAttrDataCreated
-    
-
-  },
-}

package/src/components/JfbBaseHeaderColumn/Mock.js

@@ -1,17 +0,0 @@
-'use strict';
-
-module.exports = {
-  getCityInfoByLocation: {
-    "data": {
-        "province_code": "110000",
-        "province_name": "北京",
-        "city_code": "110100",
-        "city_name": "北京市",
-        "area_code": "371525",
-        "area_name": "冠县",
-        "street_code": "371525002",
-        "street_name": "崇文街道"
-    },
-    "request_id": "6777935abebcfb20"
-  }
-}