gxd-uni-library-editx 1.0.151 → 1.0.153

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "gxd-uni-library-editx",
-  "version": "1.0.151",
+  "version": "1.0.153",
   "private": false,
   "description": "聚福宝基础插件专用库",
   "main": "index.js",

package/src/components/XdButton/XdButton.vue

@@ -19,7 +19,7 @@
         boxShadow: getBoxShadow,
         border: uiType === 'default'? '2rpx solid #dcdfe6': 0,
         padding: '0 ' + btnPaddingtList[uiSize] + 'rpx'
-      },cusStyleComp]"
+      },cusStyleComp,plainStyle]"
       :class="getClassName"
       type="default"
       plain="true"
@@ -40,11 +40,11 @@
       boxShadow: getBoxShadow,
       border: uiType === 'default'? '2rpx solid #dcdfe6': 0,
       padding: '0 ' + btnPaddingtList[uiSize] + 'rpx'
-    },cusStyleComp]"
-      :class="getClassName"
-      type="default"
-      plain="true"
-    ><slot>按钮</slot></button>
+    }, plainStyle, cusStyleComp]"
+    :class="getClassName"
+    type="default"
+    plain="true"
+  ><slot>按钮</slot></button>
   </view>
 </template>
 
@@ -166,6 +166,10 @@
       isBoxShadow:{
         type: Boolean,
         default: false,
+      },
+      plain: {
+        type: Boolean,
+        default: false
       }
     },
     data(){
@@ -256,6 +260,19 @@
         if(this.boxShadow) return this.boxShadow;
         return `0 ${this.btnShadowList[this.uiSize]}rpx ${this.btnShadowList[this.uiSize] - 2}rpx  ${color}`;
       },
+      plainStyle(){
+        let color = this.getBgColor(this.uiType);
+        if(this.plain){
+          return {
+            background: 'transparent',
+            borderColor: color,
+            color: color,
+            borderWidth: '1rpx',
+            borderStyle: 'solid'
+          }
+        }
+        return {}
+      }
     },
     async created(){
       let pageStyle = this.systemStyle || {};

package/src/components/XdCardPay/XdCardPay.vue

@@ -427,16 +427,17 @@ export default {
     //选卡弹出项
     useCardPop(data){
       return new Promise((resolve, reject) => {
-        uni.showModal({
+        this.$xdConfirm({
           title: '提示',
           content: data.pop_message,
           confirmText: data.confirm_text,
           cancelText: data.cancel_text,
-          success: function (res) {
+          width: '85%',
+          isTitle: true,
+          success: (res) => {
             if (res.confirm) {
               resolve(2);
             } else if (res.cancel) {
-              // reject("取消支付");
               if(data.pop_type == 'confirm'){
                 resolve();
               }else{
@@ -554,10 +555,12 @@ export default {
         else if(!cardForm.card_number && !cardForm.card_password) err_tip = "票券和密码不能为空";
       }
       if(err_tip) {
-        return uni.showToast({
-          title: err_tip,
-          icon: "none"
-        })
+        return this.$xdAlert({
+          content: err_tip,
+          time: 2500,
+          isClose: false,
+          zIndex: 5000
+        });
       }
       let callThis = this;
       // #ifdef MP
@@ -650,17 +653,19 @@ export default {
         return Promise.reject("请选择兑换方式");
       }
       return new Promise((resolve, reject) => {
-        uni.showModal({
+        this.$xdConfirm({
           title: '提示',
           content: '您当前未使用票券，您将全部用微信支付',
           confirmText: "我知道了",
-          success: function (res) {
+          width: '85%',
+          isTitle: true,
+          success: (res) => {
             if (res.confirm) {
               resolve();
             } else if (res.cancel) {
               reject("取消支付");
             }
-          }
+          },
         });
       })
     },
@@ -668,10 +673,14 @@ export default {
     async doTicketPay(){
       const { total_price, submitCardList, needPayPrice } = this;
       if(!submitCardList.length){
-        if(this.isGift) return uni.showToast({
-          title: '请选择票券支付',
-          duration: 2000
-        });
+        if(this.isGift){
+          return this.$xdAlert({
+            content: '请选择票券支付',
+            time: 2500,
+            isClose: false,
+            zIndex: 5000
+          });
+        }
         else await this.handleConfirmAllWxPay();
       }
       let postData = {

package/src/components/XdCardPayChose/XdCardPayChose.vue

@@ -473,16 +473,17 @@ export default {
     //选卡弹出项
     useCardPop(data){
       return new Promise((resolve, reject) => {
-        uni.showModal({
+        this.$xdConfirm({
           title: '提示',
           content: data.pop_message,
           confirmText: data.confirm_text,
           cancelText: data.cancel_text,
-          success: function (res) {
+          width: '85%',
+          isTitle: true,
+          success: (res) => {
             if (res.confirm) {
               resolve(2);
             } else if (res.cancel) {
-              // reject("取消支付");
               if(data.pop_type == 'confirm'){
                 resolve();
               }else{
@@ -617,10 +618,12 @@ export default {
         else if(!cardForm.card_number && !cardForm.card_password) err_tip = "票券和密码不能为空";
       }
       if(err_tip) {
-        return uni.showToast({
-          title: err_tip,
-          icon: "none"
-        })
+        return this.$xdAlert({
+          content: err_tip,
+          time: 2500,
+          isClose: false,
+          zIndex: 5000
+        });
       }
       let callThis = this;
       // #ifdef MP

package/src/components/XdConfirm/XdConfirm.vue

@@ -10,6 +10,7 @@
         transform: isPreview ? 'translate(-50%, 0)': 'translate(-50%, -50%)'
       }"
     >
+      <view class="xd-input-confirm__body-cover" :style="[bodyCoverBoxStyle]"></view>
       <view class="xd-input-confirm__body-close" v-if="confirm.showClose">
         <xd-font-icon @click="close" icon="icondanchuangguanbi_xian" size="32"></xd-font-icon>
       </view>
@@ -55,6 +56,7 @@
         <view class="btn-wrapper" v-if="isBtnFull === false">
           <view :style="[cancelWidthComp]" v-if="confirm.cancel">
             <xd-button
+              :plain="isPlain"
               :font-size="32"
               style="padding: 0 30rpx; min-width: 200rpx"
               @click="handleConfirm('cancel')"
@@ -68,6 +70,7 @@
           </view>
           <view :style="[confirmWidthComp]" v-if="confirm.confirm">
             <xd-button
+              :plain="isPlain"
               style="padding: 0 30rpx; min-width: 200rpx"
               :font-size="32"
               @click="handleConfirm('confirm')"
@@ -116,6 +119,11 @@
   import {mapState, mapMutations} from 'vuex';
   import XdContentXss from "@/components/XdContentXss/XdContentXss";
   import XdFontIcon from "@/components/XdFontIcon/XdFontIcon";
+  import Color from "color"
+  import {
+    getParentsStyle, //获取页面风格单个键值值
+    getParentsStyles //获取页面风格列表
+  } from '@/utils/xd.base';
 
   export default {
     name: "XdConfirm",
@@ -134,6 +142,7 @@
       ...mapState([
         'xdInputConfirm',
         'styleCommon',
+        'brandInfo'
       ]),
       ...mapState({
         currentStyle:(state)=>{
@@ -163,7 +172,21 @@
       },
       cancelWidthComp(){
         return this.getWidth('btnCancelWidth');
-      }
+      },
+      isPlain(){
+        let type = this.brandInfo.base_style;
+        if(type === 'whiteConfirmPlain') return true;
+        return false;
+      },
+      bodyCoverBoxStyle(){
+        let type = this.brandInfo.base_style;
+        let style = {};
+        if(type === 'bgColorGradient'){
+          let color1 = Color(this.uiStyle.$mainColor).alpha(0.25).toString();
+          style.background = `linear-gradient(180deg, ${color1} 0%, rgba(255,255,255,0) 20%, rgba(255,255,255,0) 100%)`
+        }
+        return style;
+      },
 
     },
     data() {
@@ -217,12 +240,16 @@
           msgIcon:'',
           msgIconColor:'',
           msgIconSize:'70',
-        }
+        },
+        uiStyle: {},
       }
     },
     watch: {
       xdInputConfirm(value) {
         this.init(value);
+      },
+      styleCommon(val){
+        this.uiStyle = val;
       }
     },
     created() {
@@ -326,6 +353,14 @@
       padding: unit(30,rpx);
       box-sizing: border-box;
 
+      &-cover{
+        position: absolute;
+        left: 0;
+        top: 0;
+        width: 100%;
+        height: 100%;
+      }
+
       &-title {
         padding: 0 unit(30, rpx);
         font-size: unit(40, rpx);

package/src/components/XdCouponChose/XdCouponChose.vue

@@ -481,26 +481,27 @@ export default {
     //选卡弹出项
     useCardPop(data) {
       return new Promise((resolve, reject) => {
-        uni.showModal({
-          title: "提示",
+        this.$xdConfirm({
+          title: '提示',
           content: data.pop_message,
           confirmText: data.confirm_text,
           cancelText: data.cancel_text,
-          success: function (res) {
+          width: '85%',
+          isTitle: true,
+          success: (res) => {
             if (res.confirm) {
               resolve(2);
             } else if (res.cancel) {
-              // reject("取消支付");
-              if (data.pop_type == "confirm") {
+              if(data.pop_type == 'confirm'){
                 resolve();
-              } else {
+              }else{
                 resolve(3);
               }
             }
           },
           fail: function (res) {
             reject(res);
-          },
+          }
         });
       });
     },
@@ -658,9 +659,11 @@ export default {
           err_tip = "优惠券和密码不能为空";
       }
       if (err_tip) {
-        return uni.showToast({
-          title: err_tip,
-          icon: "none",
+        return this.$xdAlert({
+          content: err_tip,
+          time: 2500,
+          isClose: false,
+          zIndex: 5000
         });
       }
       let callThis = this;

package/src/components/XdDailog/XdDailog.vue

@@ -12,6 +12,7 @@
         transform: isPreview ? 'translate(-50%, 0)': 'translate(-50%, -50%)'
       }"
     >
+      <view class="xd-dailog__body-cover" :style="[bodyCoverBoxStyle]"></view>
       <view class="xd-dailog__body-title" v-if="showTitleComp">
         <slot name="title">
           {{title}}
@@ -58,6 +59,12 @@
 <script>
   import XdButton from "@/components/XdButton/XdButton";
   import XdFontIcon from "@/components/XdFontIcon/XdFontIcon";
+  import {mapState,  mapMutations} from 'vuex';
+  import Color from "color"
+  import {
+    getParentsStyle, //获取页面风格单个键值值
+    getParentsStyles //获取页面风格列表
+  } from '@/utils/xd.base';
 
   export default {
     name: "XdDailog",
@@ -151,10 +158,14 @@
         uiShow: false,
         uiRadius: 11.2,
         uiDisabled: false,
+        uiStyle: {}
       }
     },
 
     computed:{
+      ...mapState([
+        'brandInfo'
+      ]),
       showTitleComp(){
         let temp = true;
         // #ifdef MP-WEIXIN
@@ -165,7 +176,16 @@
         if(this.title === '' || this.title === null ||  this.title === undefined) temp = false;
         // #endif
         return temp;
-      }
+      },
+      bodyCoverBoxStyle(){
+        let type = this.brandInfo.base_style;
+        let style = {};
+        if(type === 'bgColorGradient'){
+          let color1 = Color(this.uiStyle.$mainColor).alpha(0.25).toString();
+          style.background = `linear-gradient(180deg, ${color1} 0%, rgba(255,255,255,0) 100%)`
+        }
+        return style;
+      },
     },
 
     watch:{
@@ -176,7 +196,12 @@
         this.uiDisabled = value;
       },
     },
-    created(){
+    async created(){
+      let pageStyle = this.systemStyle || {};
+      let style = await getParentsStyles();
+      style = Object.assign({}, JSON.parse(JSON.stringify(style)) , pageStyle);
+      this.uiStyle = style;
+      
       this.uiShow = this.show;
       this.uiDisabled = this.disabled;
       this.uiRadius = this.radius;
@@ -237,6 +262,14 @@
       position: absolute;
       left: 50%;
 
+      &-cover{
+        position: absolute;
+        left: 0;
+        top: 0;
+        width: 100%;
+        height: 100rpx;
+      }
+
       &-close {
         position: absolute;
         width:unit(52/@scale, rpx);

package/src/components/XdTips/XdTips.vue

@@ -3,25 +3,26 @@
     <view class="xd-tips__mask"></view>
     <view
       class="xd-tips__body"
-      :style="{
+      :style="[{
         borderRadius: tips.radius,
         background: tips.background,
         color: tips.contentColor,
         width: tips.width,
         top: isPreview ? '400rpx': '50%',
         transform: isPreview ? 'translate(-50%, 0)': 'translate(-50%, -50%)'
-      }"
+      }, bodyBoxStyle]"
     >
+      <view class="xd-tips__body-cover" :style="[bodyCoverBoxStyle]"></view>
       <view class="xd-tips__body-close" @click="close" v-if="tips.isClose">
         <xd-font-icon icon="iconguanbi" width="30" height="30" size="25" :color="tips.contentColor"></xd-font-icon>
       </view>
-      <view class="xd-tips__body-icon" v-if="tips.iconShow">
+      <!-- <view class="xd-tips__body-icon" v-if="tips.iconShow">
         <xd-font-icon :icon="tips.icon" :size="tips.iconSize" :color="tips.iconColor"></xd-font-icon>
-      </view>
-      <view class="xd-tips__body-content" v-if="tips.isHtml">
+      </view> -->
+      <view class="xd-tips__body-content" v-if="tips.isHtml" :style="[bodyContentStyle]">
         <xd-content-xss :html="tips.content"></xd-content-xss>
       </view>
-      <view v-else class="xd-tips__body-content">
+      <view v-else class="xd-tips__body-content" :style="[bodyContentStyle]">
         {{tips.content}}
       </view>
     </view>
@@ -32,6 +33,11 @@
 import XdFontIcon from "@/components/XdFontIcon/XdFontIcon";
 import {mapState,  mapMutations} from 'vuex';
 import XdContentXss from "@/components/XdContentXss/XdContentXss";
+import Color from "color"
+import {
+  getParentsStyle, //获取页面风格单个键值值
+  getParentsStyles //获取页面风格列表
+} from '@/utils/xd.base';
 
 export default {
   name: "XdTips",
@@ -47,8 +53,37 @@ export default {
   },
   computed: {
     ...mapState([
-      'xdTips'
-    ])
+      'xdTips',
+      'brandInfo',
+      'styleCommon',
+    ]),
+    bodyBoxStyle(){
+      let type = this.brandInfo.base_style;
+      let style = {};
+      if(type !== 'default'){
+        style.background = '#FFFFFF';
+      }
+      return style
+    },
+    bodyCoverBoxStyle(){
+      let type = this.brandInfo.base_style;
+      let color1 = Color(this.uiStyle.$mainColor).alpha(0.25).toString();
+      let style = {
+        background: '',
+      }
+      if(type === 'bgColorGradient'){
+        style.background = `linear-gradient(180deg, ${color1} 0%, rgba(255,255,255,0) 20%, rgba(255,255,255,0) 100%)`
+      }
+      return style
+    },
+    bodyContentStyle(){
+      let type = this.brandInfo.base_style;
+      let style = {};
+      if(type !== 'default'){
+        style.color = '#333';
+      }
+      return style
+    }
   },
   data(){
     return {
@@ -75,8 +110,8 @@ export default {
       tips: {},
 
       defaultTips: {
-        width: '300rpx',
-        isClose: true,
+        width: '500rpx',
+        isClose: false,
         zIndex: 1700,
         content: '',
         contentColor: '#eee',
@@ -90,12 +125,16 @@ export default {
         radius: '30rpx',
         close: null,
         type: 'success'
-      }
+      },
+      uiStyle: {}
     }
   },
   watch:{
     xdTips(value){
       this.init(value);
+    },
+    styleCommon(val){
+      this.uiStyle = val;
     }
   },
   created(){
@@ -175,6 +214,7 @@ export default {
 
   &__mask {
     position: absolute;
+    top: 0;
     bottom: 0;
     left: 0;
     right: 0;
@@ -190,6 +230,15 @@ export default {
     box-shadow: 0 0 unit(20,rpx) rgba(0,0,0,0.3);
     box-sizing: border-box;
     padding: unit(60,rpx) unit(30, rpx);
+    overflow: hidden;
+
+    &-cover{
+      position: absolute;
+      left: 0;
+      top: 0;
+      width: 100%;
+      height: 100%;
+    }
 
     &-close {
       position: absolute;
@@ -214,7 +263,8 @@ export default {
 
     &-content {
       text-align: center;
-      font-size: unit(40, rpx)
+      font-size: unit(32, rpx);
+      position: relative;
     }
 
   }