1.测试优化
parent
67c073cbc2
commit
afeb4fe119
|
|
@ -1161,11 +1161,6 @@ button[disabled].bg-grey {
|
|||
margin-left: 12rpx;
|
||||
}
|
||||
|
||||
.goods-data-grid-list .item .error-msg,
|
||||
.goods-data-grid-list .item .goods-img {
|
||||
/* height: 341rpx !important; */
|
||||
}
|
||||
|
||||
.goods-data-grid-list .item .error-msg {
|
||||
line-height: 341rpx;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -29,7 +29,7 @@
|
|||
<view v-else>
|
||||
<block v-if="is_online_service_fixed == 1">
|
||||
<movable-area class="online-service-movable-container" :style="'height: calc(100% - '+height_dec+'rpx);top:'+top+'rpx;'">
|
||||
<movable-view direction="all" :x="x" :y="y" :animation="false" class="online-service-event-submit">
|
||||
<movable-view direction="all" :x="x" :y="y" :animation="false" class="online-service-event-submit breathe">
|
||||
<block v-if="is_chat == 1">
|
||||
<button type="default" :class="common_ent" @tap="chat_event">
|
||||
<image class="icon dis-block" :src="common_static_url+'online-service-icon.png'"></image>
|
||||
|
|
@ -153,12 +153,12 @@
|
|||
system: system,
|
||||
// 位置坐标
|
||||
x: width - 43,
|
||||
y: height - 380,
|
||||
y: height - 240,
|
||||
// 展示位置处理
|
||||
top: top_h,
|
||||
height_dec: top_h,
|
||||
// #ifdef H5 || APP
|
||||
top: 90,
|
||||
top: 10,
|
||||
height_dec: this.propIsBar ? 190 : 90,
|
||||
// #endif
|
||||
// 是否使用客服系统
|
||||
|
|
@ -248,19 +248,19 @@
|
|||
}
|
||||
.online-service-event-submit,
|
||||
.online-service-event-submit button {
|
||||
width: 31px;
|
||||
height: 31px;
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
border-radius: 50%;
|
||||
}
|
||||
.online-service-event-submit button {
|
||||
border: 0;
|
||||
padding: 5px;
|
||||
padding: 0;
|
||||
box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
|
||||
background: rgba(0, 0, 0, 0.6);
|
||||
}
|
||||
.online-service-event-submit .icon {
|
||||
width: 21px !important;
|
||||
height: 21px !important;
|
||||
width: 50px !important;
|
||||
height: 50px !important;
|
||||
}
|
||||
.goods-chat-container button {
|
||||
padding: 0;
|
||||
|
|
@ -289,4 +289,34 @@
|
|||
display: block;
|
||||
}
|
||||
/* #endif */
|
||||
|
||||
/**
|
||||
* 呼吸灯
|
||||
*/
|
||||
.breathe {
|
||||
background-color: rgb(238 73 70);
|
||||
border-radius: 100%;
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.breathe::before,
|
||||
.breathe::after {
|
||||
background-color: rgba(238, 73, 70, 0.3);
|
||||
}
|
||||
|
||||
.breathe::before {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.breathe::after {
|
||||
width: 55px;
|
||||
height: 55px;
|
||||
top: -2.5px;
|
||||
left: -2.5px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,15 +1,15 @@
|
|||
<template>
|
||||
<view>
|
||||
<!-- 开启事件 -->
|
||||
<movable-area v-if="quick_status == 1" :class="'quick-movable-container '+ common_ent" :style="'height: calc(100% - '+height_dec+'rpx);top:'+top+'rpx;'">
|
||||
<movable-view direction="all" :x="x" :y="y" :animation="false" class="quick-event-submit bg-main" @tap="quick_open_event">
|
||||
<image :src="common_static_url+'quick-icon.png'" mode="widthFix"></image>
|
||||
</movable-view>
|
||||
</movable-area>
|
||||
<view>
|
||||
<!-- 开启事件 -->
|
||||
<movable-area v-if="quick_status == 1" :class="'quick-movable-container ' + common_ent" :style="'height: calc(100% - ' + height_dec + 'rpx);top:' + top + 'rpx;'">
|
||||
<movable-view direction="all" :x="x" :y="y" :animation="false" class="quick-event-submit breathe" @tap="quick_open_event">
|
||||
<image :src="common_static_url + 'quick-icon.png'" mode="widthFix"></image>
|
||||
</movable-view>
|
||||
</movable-area>
|
||||
|
||||
<!-- 弹窗 -->
|
||||
<component-popup :propShow="popup_status" :propIsBar="propIsBar" propPosition="bottom" @onclose="quick_close_event">
|
||||
<view :class="'nav-popup-container '+common_ent">
|
||||
<view :class="'nav-popup-container ' + common_ent">
|
||||
<view class="close oh">
|
||||
<view class="icon-right" @tap.stop="quick_close_event">
|
||||
<uni-icons type="clear" size="46rpx" color="#999"></uni-icons>
|
||||
|
|
@ -18,238 +18,268 @@
|
|||
<view class="nav-popup-content">
|
||||
<view v-if="data_list.length > 0" class="nav-data-list">
|
||||
<view v-for="(item, index) in data_list" :key="index" class="item cp">
|
||||
<view :class="'item-content '+((item.bg_color || null) == null ? 'item-exposed' : '')" :data-value="item.event_value" :data-type="item.event_type" @tap="navigation_event" :style="((item.bg_color || null) == null ? '' : 'background-color:'+item.bg_color+';')">
|
||||
<image :src="item.images_url" mode="aspectFit"></image>
|
||||
</view>
|
||||
<view class="title">{{item.name}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-else>
|
||||
<!-- 提示信息 -->
|
||||
<component-no-data :propStatus="0"></component-no-data>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</component-popup>
|
||||
</view>
|
||||
<view :class="'item-content ' + ((item.bg_color || null) == null ? 'item-exposed' : '')" :data-value="item.event_value" :data-type="item.event_type" @tap="navigation_event" :style="(item.bg_color || null) == null ? '' : 'background-color:' + item.bg_color + ';'">
|
||||
<image :src="item.images_url" mode="aspectFit"></image>
|
||||
</view>
|
||||
<view class="title">{{ item.name }}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-else>
|
||||
<!-- 提示信息 -->
|
||||
<component-no-data :propStatus="0"></component-no-data>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</component-popup>
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
const app = getApp();
|
||||
import componentPopup from "../popup/popup";
|
||||
import componentNoData from "../no-data/no-data";
|
||||
var common_static_url = app.globalData.get_static_url('common');
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
common_static_url: common_static_url,
|
||||
popup_status: false,
|
||||
quick_status: 0,
|
||||
data_list: [],
|
||||
system: null,
|
||||
x: 0,
|
||||
y: 0,
|
||||
top: 0,
|
||||
height_dec: 0,
|
||||
is_first: 1,
|
||||
common_ent: ''
|
||||
};
|
||||
},
|
||||
components: {
|
||||
componentPopup,
|
||||
componentNoData
|
||||
},
|
||||
props: {
|
||||
propIsBar: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
propIsNav: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
propIsGrayscale: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
// 属性值改变监听
|
||||
watch: {
|
||||
// 是否灰度
|
||||
propIsGrayscale(value, old_value) {
|
||||
this.common_ent = value ? 'grayscale' : '';
|
||||
}
|
||||
},
|
||||
// 页面被展示
|
||||
created: function() {
|
||||
this.init_config();
|
||||
const app = getApp();
|
||||
import componentPopup from '../popup/popup';
|
||||
import componentNoData from '../no-data/no-data';
|
||||
var common_static_url = app.globalData.get_static_url('common');
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
common_static_url: common_static_url,
|
||||
popup_status: false,
|
||||
quick_status: 0,
|
||||
data_list: [],
|
||||
system: null,
|
||||
x: 0,
|
||||
y: 0,
|
||||
top: 0,
|
||||
height_dec: 0,
|
||||
is_first: 1,
|
||||
common_ent: '',
|
||||
};
|
||||
},
|
||||
components: {
|
||||
componentPopup,
|
||||
componentNoData,
|
||||
},
|
||||
props: {
|
||||
propIsBar: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
propIsNav: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
propIsGrayscale: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
},
|
||||
// 属性值改变监听
|
||||
watch: {
|
||||
// 是否灰度
|
||||
propIsGrayscale(value, old_value) {
|
||||
this.common_ent = value ? 'grayscale' : '';
|
||||
},
|
||||
},
|
||||
// 页面被展示
|
||||
created: function () {
|
||||
this.init_config();
|
||||
|
||||
// 页面是否定义导航
|
||||
var value = this.propIsNav ? 170 : 0;
|
||||
this.top = value
|
||||
this.height_dec = value;
|
||||
// #ifdef H5 || APP
|
||||
this.top = 90;
|
||||
this.height_dec = this.propIsBar ? 190 : 90;
|
||||
// #endif
|
||||
// 页面是否定义导航
|
||||
var value = this.propIsNav ? 170 : 0;
|
||||
this.top = value;
|
||||
this.height_dec = value;
|
||||
// #ifdef H5 || APP
|
||||
this.top = 20;
|
||||
this.height_dec = this.propIsBar ? 190 : 90;
|
||||
// #endif
|
||||
|
||||
// 非首次进入则重新初始化配置接口
|
||||
if (this.is_first == 0) {
|
||||
app.globalData.init_config();
|
||||
}
|
||||
// 非首次进入则重新初始化配置接口
|
||||
if (this.is_first == 0) {
|
||||
app.globalData.init_config();
|
||||
}
|
||||
|
||||
// 数据设置
|
||||
var system = app.globalData.get_system_info(null, null, true);
|
||||
var height = app.globalData.window_height_handle(system);
|
||||
this.setData({
|
||||
is_first: 0,
|
||||
system: system,
|
||||
x: 12,
|
||||
y: height - 280,
|
||||
// 是否灰度
|
||||
common_ent: this.propIsGrayscale ? 'grayscale' : ''
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
// 初始化配置
|
||||
init_config(status) {
|
||||
if ((status || false) == true) {
|
||||
this.setData({
|
||||
data_list: app.globalData.get_config('quick_nav') || [],
|
||||
quick_status: app.globalData.get_config('config.home_navigation_main_quick_status') || 0
|
||||
});
|
||||
} else {
|
||||
app.globalData.is_config(this, 'init_config');
|
||||
}
|
||||
},
|
||||
// 数据设置
|
||||
var system = app.globalData.get_system_info(null, null, true);
|
||||
var height = app.globalData.window_height_handle(system);
|
||||
var width = app.globalData.window_width_handle(system.windowWidth);
|
||||
this.setData({
|
||||
is_first: 0,
|
||||
system: system,
|
||||
x: width - 43,
|
||||
y: height - 120,
|
||||
// 是否灰度
|
||||
common_ent: this.propIsGrayscale ? 'grayscale' : '',
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
// 初始化配置
|
||||
init_config(status) {
|
||||
if ((status || false) == true) {
|
||||
this.setData({
|
||||
data_list: app.globalData.get_config('quick_nav') || [],
|
||||
quick_status: app.globalData.get_config('config.home_navigation_main_quick_status') || 0,
|
||||
});
|
||||
} else {
|
||||
app.globalData.is_config(this, 'init_config');
|
||||
}
|
||||
},
|
||||
|
||||
// 弹层开启
|
||||
quick_open_event(e) {
|
||||
this.setData({
|
||||
popup_status: true,
|
||||
data_list: app.globalData.get_config('quick_nav') || []
|
||||
});
|
||||
},
|
||||
// 弹层开启
|
||||
quick_open_event(e) {
|
||||
this.setData({
|
||||
popup_status: true,
|
||||
data_list: app.globalData.get_config('quick_nav') || [],
|
||||
});
|
||||
},
|
||||
|
||||
// 弹层关闭
|
||||
quick_close_event(e) {
|
||||
this.setData({
|
||||
popup_status: false
|
||||
});
|
||||
},
|
||||
// 弹层关闭
|
||||
quick_close_event(e) {
|
||||
this.setData({
|
||||
popup_status: false,
|
||||
});
|
||||
},
|
||||
|
||||
// 操作事件
|
||||
navigation_event(e) {
|
||||
app.globalData.operation_event(e);
|
||||
}
|
||||
}
|
||||
};
|
||||
// 操作事件
|
||||
navigation_event(e) {
|
||||
app.globalData.operation_event(e);
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style>
|
||||
/**
|
||||
/**
|
||||
* 按钮
|
||||
*/
|
||||
.quick-movable-container {
|
||||
position: fixed;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
top: 0;
|
||||
left: 0;
|
||||
background: transparent;
|
||||
pointer-events: none;
|
||||
z-index: 2;
|
||||
}
|
||||
.quick-movable-container {
|
||||
position: fixed;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
top: 0;
|
||||
left: 0;
|
||||
background: transparent;
|
||||
pointer-events: none;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.quick-event-submit {
|
||||
pointer-events: auto;
|
||||
width: 31px;
|
||||
height: 31px;
|
||||
border-radius: 50%;
|
||||
box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
|
||||
opacity: 0.8;
|
||||
}
|
||||
.quick-event-submit {
|
||||
pointer-events: auto;
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.quick-event-submit image {
|
||||
width: 17px !important;
|
||||
height: 17px !important;
|
||||
margin: 7px auto 7px auto;
|
||||
display: block;
|
||||
}
|
||||
.quick-event-submit image {
|
||||
width: 50px !important;
|
||||
height: 50px !important;
|
||||
display: block;
|
||||
position: relative;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
/**
|
||||
/**
|
||||
* 弹窗
|
||||
*/
|
||||
.nav-popup-container {
|
||||
padding: 20rpx 10rpx 0 10rpx;
|
||||
background: #fff;
|
||||
}
|
||||
.nav-popup-container {
|
||||
padding: 20rpx 10rpx 0 10rpx;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.nav-popup-container .close {
|
||||
overflow: hidden;
|
||||
}
|
||||
.nav-popup-container .close {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.nav-popup-container .close .icon-right {
|
||||
float: right;
|
||||
}
|
||||
.nav-popup-container .close .icon-right {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.nav-popup-content {
|
||||
max-height: 80vh;
|
||||
overflow-y: scroll;
|
||||
overflow-x: hidden;
|
||||
padding-bottom: 20rpx;
|
||||
}
|
||||
.nav-popup-content {
|
||||
max-height: 80vh;
|
||||
overflow-y: scroll;
|
||||
overflow-x: hidden;
|
||||
padding-bottom: 20rpx;
|
||||
}
|
||||
|
||||
/**
|
||||
/**
|
||||
* 内容
|
||||
*/
|
||||
.nav-data-list {
|
||||
overflow: hidden;
|
||||
background: #fff;
|
||||
}
|
||||
.nav-data-list {
|
||||
overflow: hidden;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.nav-data-list .item {
|
||||
width: calc(25% - 60rpx);
|
||||
float: left;
|
||||
padding: 30rpx;
|
||||
/* #ifdef H5 */
|
||||
cursor: pointer;
|
||||
/* #endif */
|
||||
}
|
||||
.nav-data-list .item {
|
||||
width: calc(25% - 60rpx);
|
||||
float: left;
|
||||
padding: 30rpx;
|
||||
/* #ifdef H5 */
|
||||
cursor: pointer;
|
||||
/* #endif */
|
||||
}
|
||||
|
||||
.nav-data-list .item-content {
|
||||
border-radius: 50%;
|
||||
padding: 20rpx;
|
||||
text-align: center;
|
||||
margin: 0 auto;
|
||||
-webkit-box-shadow: 0 2px 12px rgb(226 226 226 / 95%);
|
||||
box-shadow: 0 2px 12px rgb(226 226 226 / 95%);
|
||||
}
|
||||
.nav-data-list .item-content {
|
||||
border-radius: 50%;
|
||||
padding: 20rpx;
|
||||
text-align: center;
|
||||
margin: 0 auto;
|
||||
-webkit-box-shadow: 0 2px 12px rgb(226 226 226 / 95%);
|
||||
box-shadow: 0 2px 12px rgb(226 226 226 / 95%);
|
||||
}
|
||||
|
||||
.nav-data-list .item-content,
|
||||
.nav-data-list .item image {
|
||||
width: 70rpx !important;
|
||||
height: 70rpx !important;
|
||||
}
|
||||
.nav-data-list .item-content,
|
||||
.nav-data-list .item image {
|
||||
width: 70rpx !important;
|
||||
height: 70rpx !important;
|
||||
}
|
||||
|
||||
.nav-data-list .item .item-exposed {
|
||||
padding: 0;
|
||||
-webkit-box-shadow: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
.nav-data-list .item .item-exposed {
|
||||
padding: 0;
|
||||
-webkit-box-shadow: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.nav-data-list .item .item-exposed,
|
||||
.nav-data-list .item .item-exposed image {
|
||||
width: 110rpx !important;
|
||||
height: 110rpx !important;
|
||||
}
|
||||
.nav-data-list .item .item-exposed,
|
||||
.nav-data-list .item .item-exposed image {
|
||||
width: 110rpx !important;
|
||||
height: 110rpx !important;
|
||||
}
|
||||
|
||||
.nav-data-list .item .title {
|
||||
margin-top: 10rpx;
|
||||
font-size: 28rpx !important;
|
||||
text-align: center;
|
||||
-o-text-overflow: ellipsis;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
max-width: 100%;
|
||||
}
|
||||
</style>
|
||||
.nav-data-list .item .title {
|
||||
margin-top: 10rpx;
|
||||
font-size: 28rpx !important;
|
||||
text-align: center;
|
||||
-o-text-overflow: ellipsis;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
/**
|
||||
* 呼吸灯
|
||||
*/
|
||||
.breathe {
|
||||
background-color: rgb(89 181 255);
|
||||
border-radius: 100%;
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.breathe::before,
|
||||
.breathe::after {
|
||||
background-color: rgba(89, 181, 255, 0.3);
|
||||
}
|
||||
|
||||
.breathe::before {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.breathe::after {
|
||||
width: 55px;
|
||||
height: 55px;
|
||||
top: -2.5px;
|
||||
left: -2.5px;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
Loading…
Reference in New Issue