chore: 添加缺失的静态资源文件
添加多个前端界面所需的图片、字体、音频等静态资源文件,包括: - 管理员后台的图标、背景图、组件图片 - 移动端页面的商品图片、用户中心图片、活动图标 - 第三方库的示例图片和字体文件 - 浏览器兼容性配置文件 - 图标字体文件(eot、ttf、woff、woff2格式) 这些资源是前端界面正常显示所必需的,之前可能因版本控制忽略或遗漏而缺失。
This commit is contained in:
163
view/uniapp/components/BaseCode.vue
Normal file
163
view/uniapp/components/BaseCode.vue
Normal file
@@ -0,0 +1,163 @@
|
||||
<template>
|
||||
<view class="codePopup tui-modal__container" :class="[isShowCode ? 'tui-modal-show' : '']" @touchmove.stop.prevent="moveHandle">
|
||||
<view class="tui-modal-box" :class="[isShowCode ? 'tui-modal-normal' : 'tui-modal-scale', isShowCode ? 'tui-modal-show' : '']">
|
||||
<view class="header acea-row row-between-wrapper">
|
||||
<view class="title on">员工推广码</view>
|
||||
</view>
|
||||
<view>
|
||||
<view class="acea-row row-center-wrapper mb-20 mt-28">
|
||||
<!-- #ifndef MP -->
|
||||
<w-qrcode :options="config.qrc"></w-qrcode>
|
||||
<!-- #endif -->
|
||||
<!-- #ifdef MP -->
|
||||
<image class="code-img" :src="codeImg" show-menu-by-longpress></image>
|
||||
<!-- #endif -->
|
||||
</view>
|
||||
<view class="tip">如遇到扫码失败</view>
|
||||
<view class="tip">请将屏幕调至最亮重新扫码</view>
|
||||
</view>
|
||||
<view class="close">
|
||||
<view class="iconfont icon-ic_close1" @click="close"></view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="mark" v-if="isShowCode" @touchmove.stop.prevent="moveHandle"></view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'codeModal',
|
||||
props: {
|
||||
isShowCode: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
code: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
codeImg: {
|
||||
type: String,
|
||||
default: ''
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
config: {
|
||||
bar: {
|
||||
code: '',
|
||||
color: ['#000'],
|
||||
bgColor: '#FFFFFF', // 背景色
|
||||
width: 480, // 宽度
|
||||
height: 110 // 高度
|
||||
},
|
||||
qrc: {
|
||||
code: '123123',
|
||||
size: 380, // 二维码大小
|
||||
level: 3, //等级 0~4
|
||||
bgColor: '#FFFFFF', //二维码背景色 默认白色
|
||||
color: ['#333', '#333'] //边框颜色支持渐变色
|
||||
}
|
||||
}
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
code(newVal) {
|
||||
// #ifdef MP
|
||||
this.config.qrc.code = newVal;
|
||||
// #endif
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
console.log(this.code);
|
||||
// #ifndef MP
|
||||
this.config.qrc.code = this.code;
|
||||
// #endif
|
||||
},
|
||||
methods: {
|
||||
moveHandle() {},
|
||||
close() {
|
||||
this.$emit('update:isShowCode', false);
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.mark {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
z-index: 50;
|
||||
}
|
||||
.tui-modal__container {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
visibility: hidden;
|
||||
z-index: 51;
|
||||
}
|
||||
|
||||
.tui-modal-box {
|
||||
position: relative;
|
||||
opacity: 0;
|
||||
visibility: hidden;
|
||||
box-sizing: border-box;
|
||||
transition: all 0.3s ease-in-out;
|
||||
width: 600rpx;
|
||||
padding: 40rpx;
|
||||
border-radius: 32rpx;
|
||||
background-color: #fff;
|
||||
z-index: 9999;
|
||||
.tip {
|
||||
color: #999999;
|
||||
font-size: 26rpx;
|
||||
text-align: center;
|
||||
}
|
||||
.close {
|
||||
width: 520rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
position: fixed;
|
||||
bottom: -80rpx;
|
||||
.icon-ic_close1 {
|
||||
font-size: 52rpx;
|
||||
color: #cccccc;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.tui-modal-scale {
|
||||
transform: scale(0);
|
||||
}
|
||||
|
||||
.tui-modal-normal {
|
||||
transform: scale(1);
|
||||
}
|
||||
|
||||
.tui-modal-show {
|
||||
opacity: 1;
|
||||
visibility: visible;
|
||||
}
|
||||
|
||||
.codePopup .header .title {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
font-weight: 500;
|
||||
font-size: 32rpx;
|
||||
color: #333333;
|
||||
}
|
||||
.code-img{
|
||||
width: 380rpx;
|
||||
height: 380rpx;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user