关于vue.js:crmeb单商户pro15一键换色

31次阅读

共计 1203 个字符,预计需要花费 4 分钟才能阅读完成。

在原有的五套主题色调上减少:

一、后盾设置:

门路:crmeb1.5\src\pages\setting\themeStyle

例如:增加一个青色主题色调的

<Radio :label=”6″ border class=”box orange”> 青色 </Radio>

对应上面显示的效果图你能够在前台截取,在 data 外面提前定义,如图:

对应的切换成果定义(将你 data 外面新定义的增加进去):

changeColor(e){

switch(e){
    case 1:
        this.picList = this.picListBule;
        break;
    case 2:
        this.picList = this.picListGreen;
        break;
    case 3:
        this.picList = this.picListRed;
        break;
    case 4:
        this.picList = this.picListPink;
        break;
    case 5:
        this.picList = this.picListOrange;
        break;
    default:
        break
}

}

注:数据配置(后盾 crmeb1.5\src\pages\system\group)、集体核心也是相似办法(后盾 crmeb1.5\src\pages\setting\devise)

二、挪动端设置:

门路:crmebPro1.5/App.vue

定义你的主题色调:

增加主色调:

阐明:

–view-theme:主题色;–view-priceColor:价格色;–view-minorColor 和 –view-minorColorT:辅助色;–view-bntColor:按钮色;

注:

首先主题色与价格色调定义好,–view-minorColorT 色值为主题色的 0.1 的透明度;

–view-minorColor 色值也是在主题色的根底上淡化,–view-bntColor 次要用于有左右按钮的,个别左边为主题色,右边按钮为此色彩;

对于砍价列表和砍价详情图片(因为此图片没方法用代码写,需自行添加):

门路:crmebPro1.5/pages/activity/goods_bargain/index.vue

  crmebPro1.5/pages/activity/goods_bargain_details/index.vue

要是想要用现有的图片也是能够的,目前除了现有的五套对应的图片,在不没有对应图片的前提下,默认的是激情红,你也能够进行批改

例如:

默认(激情红):

default:

this.picUrl = picList[2]

Break

批改(天空蓝):

default:

this.picUrl = picList[0]

break

要是想要批改成最新增加的主题色调,一下为次要做法:

注:我这外面图片是在本地存储,因为图片过大小程序没方法辨认,请自行转化为 base64 或是你也能够贮存在服务器,调用线上图片

增加办法:

onLoad 外面定义:

增加定义图片

正文完
 0