调整部分样式
This commit is contained in:
dftre
parent
df252d049e
commit
2e05794a09
@ -2,26 +2,13 @@
|
||||
|
||||
改自作者诗小柒的tki-qrcode二维码生成器
|
||||
|
||||
### 作者：董玉可
|
||||
### 作者：Dftre
|
||||
|
||||
1. H5、微信小程序、支付宝小程序、APP，其它平台的小程序没有测试
|
||||
2. 使用canvas生成
|
||||
3. 可设置二维码背景色，前景色，角标色
|
||||
4. 可设置二维码logo
|
||||
|
||||
## 重要的事情说3遍 重要的事情说3遍 重要的事情说3遍
|
||||
|
||||
1. IOS、Android真机都可以正常生成二维码
|
||||
2. 使用的时候出现无法生成二维码或空白的请先github直接打包下载，问题依旧，请github上直接提出问题并配图
|
||||
3. 有问题请说明问题原因，这样我才好定位，否则我也无法解决
|
||||
4. 如果此插件有帮助到你请打5分或赞赏我，你的支持是我更新的动力
|
||||
|
||||
+ 图片1 是微信小程序真机实测
|
||||
+ 图片2 是微信小程序模拟实测
|
||||
+ 图片3 是支付宝小程序模拟器实测
|
||||
+ 图片4 是安卓真机实测
|
||||
+ 图片5 H5
|
||||
|
||||
### 使用方法
|
||||
|
||||
在 `template` 中使用
|
||||
@ -88,3 +75,4 @@
|
||||
|
||||
[uni-app](https://uniapp.dcloud.io/ "uni-app")
|
||||
[qrcode](https://github.com/aralejs/qrcode "qrcode")
|
||||
tki-qrcode
|
||||
|
||||
@ -1,18 +1,3 @@
|
||||
<template>
|
||||
<view class="content">
|
||||
<image class="logo" src="@/static/logo.png"></image>
|
||||
<view class="text-area">
|
||||
<text class="title"> RuoYi-Geek-App</text>
|
||||
</view>
|
||||
<view class="text-area">
|
||||
<up-text type="primary" text="uview-plus"></up-text>
|
||||
</view>
|
||||
<view class="charts-box">
|
||||
<qiun-data-charts type="column" :chartData="chartData" />
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, onMounted } from 'vue';
|
||||
|
||||
@ -40,8 +25,21 @@ function getServerData() {
|
||||
}, 500);
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
<template>
|
||||
<view class="content">
|
||||
<image class="logo" src="@/static/logo.png"></image>
|
||||
<view class="text-area">
|
||||
<text class="title"> RuoYi-Geek-App</text>
|
||||
</view>
|
||||
<view class="text-area">
|
||||
<up-text type="primary" text="uview-plus"></up-text>
|
||||
</view>
|
||||
<view class="charts-box">
|
||||
<qiun-data-charts type="column" :chartData="chartData" />
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<style scoped lang="scss">
|
||||
.content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
@ -1,39 +1,3 @@
|
||||
<template>
|
||||
<view class="normal-login-container">
|
||||
<view class="logo-content align-center justify-center flex">
|
||||
<image style="width: 100rpx;height: 100rpx;" :src="globalConfig.appInfo.logo" mode="widthFix">
|
||||
</image>
|
||||
<text class="title">若依移动端登录</text>
|
||||
</view>
|
||||
<view class="login-form-content">
|
||||
<view class="input-item flex align-center">
|
||||
<view class="iconfont icon-user icon"></view>
|
||||
<input v-model="loginForm.username" class="input" type="text" placeholder="请输入账号" maxlength="30" />
|
||||
</view>
|
||||
<view class="input-item flex align-center">
|
||||
<view class="iconfont icon-password icon"></view>
|
||||
<input v-model="loginForm.password" type="password" class="input" placeholder="请输入密码" maxlength="20" />
|
||||
</view>
|
||||
<view class="input-item flex align-center" style="width: 60%;margin: 0px;" v-if="captchaEnabled">
|
||||
<view class="iconfont icon-code icon"></view>
|
||||
<input v-model="loginForm.code" type="number" class="input" placeholder="请输入验证码" maxlength="4" />
|
||||
<view class="login-code">
|
||||
<image :src="codeUrl" @click="getCode" class="login-code-img"></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="action-btn">
|
||||
<button @click="handleLogin" class="login-btn cu-btn block bg-blue lg round">登录</button>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="xieyi text-center">
|
||||
<text class="text-grey1">登录即代表同意</text>
|
||||
<text @click="handleUserAgrement" class="text-blue">《用户协议》</text>
|
||||
<text @click="handlePrivacy" class="text-blue">《隐私协议》</text>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import modal from '@/plugins/modal'
|
||||
import { getCodeImg } from '@/api/login'
|
||||
@ -58,8 +22,8 @@ const loginForm = ref({
|
||||
if (useWxLogin.value) {
|
||||
getWxCode().then(res => {
|
||||
console.log(res);
|
||||
wxLogin('miniapp',res).then(res => {
|
||||
if(res.token != null){
|
||||
wxLogin('miniapp', res).then(res => {
|
||||
if (res.token != null) {
|
||||
setToken(res.token);
|
||||
loginSuccess()
|
||||
}
|
||||
@ -130,8 +94,42 @@ function handleUserAgrement() {
|
||||
|
||||
getCode();
|
||||
</script>
|
||||
<template>
|
||||
<view class="normal-login-container">
|
||||
<view class="logo-content align-center justify-center flex">
|
||||
<image style="width: 100rpx;height: 100rpx;" :src="globalConfig.appInfo.logo" mode="widthFix">
|
||||
</image>
|
||||
<text class="title">若依移动端登录</text>
|
||||
</view>
|
||||
<view class="login-form-content">
|
||||
<view class="input-item flex align-center">
|
||||
<view class="iconfont icon-user icon"></view>
|
||||
<input v-model="loginForm.username" class="input" type="text" placeholder="请输入账号" maxlength="30" />
|
||||
</view>
|
||||
<view class="input-item flex align-center">
|
||||
<view class="iconfont icon-password icon"></view>
|
||||
<input v-model="loginForm.password" type="password" class="input" placeholder="请输入密码" maxlength="20" />
|
||||
</view>
|
||||
<view class="input-item flex align-center" style="width: 60%;margin: 0px;" v-if="captchaEnabled">
|
||||
<view class="iconfont icon-code icon"></view>
|
||||
<input v-model="loginForm.code" type="number" class="input" placeholder="请输入验证码" maxlength="4" />
|
||||
<view class="login-code">
|
||||
<image :src="codeUrl" @click="getCode" class="login-code-img"></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="action-btn">
|
||||
<button @click="handleLogin" class="login-btn cu-btn block bg-blue lg round">登录</button>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<style lang="scss">
|
||||
<view class="xieyi text-center">
|
||||
<text class="text-grey1">登录即代表同意</text>
|
||||
<text @click="handleUserAgrement" class="text-blue">《用户协议》</text>
|
||||
<text @click="handlePrivacy" class="text-blue">《隐私协议》</text>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<style lang="scss" scoped>
|
||||
page {
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
@ -1,97 +1,8 @@
|
||||
<template>
|
||||
<view class="mine-container" :style="{ height: `${windowHeight}px` }">
|
||||
<!--顶部个人信息栏-->
|
||||
<view class="header-section">
|
||||
<view class="flex padding justify-between">
|
||||
<view class="flex align-center">
|
||||
<view v-if="!avatar" class="cu-avatar xl round bg-white">
|
||||
<view class="iconfont icon-people text-gray icon"></view>
|
||||
</view>
|
||||
<image v-if="avatar" @click="handleToAvatar" :src="avatar" class="cu-avatar xl round" mode="widthFix">
|
||||
</image>
|
||||
<view v-if="!name" @click="handleToLogin" class="login-tip">
|
||||
点击登录
|
||||
</view>
|
||||
<view v-if="name" @click="handleToInfo" class="user-info">
|
||||
<view class="u_title">
|
||||
用户名：{{ name }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view @click="handleToInfo" class="flex align-center">
|
||||
<text>个人信息</text>
|
||||
<view class="iconfont icon-right"></view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="content-section">
|
||||
<view class="mine-actions grid col-4 text-center">
|
||||
<view class="action-item" @click="handleJiaoLiuQun">
|
||||
<view class="iconfont icon-friendfill text-pink icon"></view>
|
||||
<text class="text">交流群</text>
|
||||
</view>
|
||||
<view class="action-item" @click="handleBuilding">
|
||||
<view class="iconfont icon-service text-blue icon"></view>
|
||||
<text class="text">在线客服</text>
|
||||
</view>
|
||||
<view class="action-item" @click="handleBuilding">
|
||||
<view class="iconfont icon-community text-mauve icon"></view>
|
||||
<text class="text">反馈社区</text>
|
||||
</view>
|
||||
<view class="action-item" @click="handleBuilding">
|
||||
<view class="iconfont icon-dianzan text-green icon"></view>
|
||||
<text class="text">点赞我们</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="menu-list">
|
||||
<view class="list-cell list-cell-arrow" @click="handleToEditInfo">
|
||||
<view class="menu-item-box">
|
||||
<view class="iconfont icon-user menu-icon"></view>
|
||||
<view>编辑资料</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="list-cell list-cell-arrow" @click="handleHelp">
|
||||
<view class="menu-item-box">
|
||||
<view class="iconfont icon-help menu-icon"></view>
|
||||
<view>常见问题</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="list-cell list-cell-arrow" @click="handleAbout">
|
||||
<view class="menu-item-box">
|
||||
<view class="iconfont icon-aixin menu-icon"></view>
|
||||
<view>关于我们</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="list-cell list-cell-arrow" @click="handleToSetting">
|
||||
<view class="menu-item-box">
|
||||
<view class="iconfont icon-setting menu-icon"></view>
|
||||
<view>应用设置</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
<!-- <view>
|
||||
<uni-popup ref="popup" type="dialog">
|
||||
<uni-popup-dialog type="info" cancelText="关闭" confirmText="退出"
|
||||
title="通知" content="确定注销并退出系统吗"
|
||||
@confirm="dialogConfirm"
|
||||
@close="dialogClose">
|
||||
</uni-popup-dialog>
|
||||
</uni-popup>
|
||||
</view> -->
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref } from "vue";
|
||||
import config from '@/config.js'
|
||||
import useUserStore from '@/store/modules/user'
|
||||
const userStore = useUserStore()
|
||||
const name = userStore.name;
|
||||
const version = config.appInfo.version;
|
||||
|
||||
const avatar = ref(userStore.avatar);
|
||||
const windowHeight = ref(uni.getSystemInfoSync().windowHeight - 50);
|
||||
@ -169,8 +80,83 @@ function handleBuilding() {
|
||||
}
|
||||
|
||||
</script>
|
||||
<template>
|
||||
<view class="mine-container" :style="{ height: `${windowHeight}px` }">
|
||||
<!--顶部个人信息栏-->
|
||||
<view class="header-section">
|
||||
<view class="flex padding justify-between">
|
||||
<view class="flex align-center">
|
||||
<view v-if="!avatar" class="cu-avatar xl round bg-white">
|
||||
<view class="iconfont icon-people text-gray icon"></view>
|
||||
</view>
|
||||
<image v-if="avatar" @click="handleToAvatar" :src="avatar" class="cu-avatar xl round" mode="widthFix">
|
||||
</image>
|
||||
<view v-if="!name" @click="handleToLogin" class="login-tip">
|
||||
点击登录
|
||||
</view>
|
||||
<view v-if="name" @click="handleToInfo" class="user-info">
|
||||
<view class="u_title">
|
||||
用户名：{{ name }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view @click="handleToInfo" class="flex align-center">
|
||||
<text>个人信息</text>
|
||||
<view class="iconfont icon-right"></view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<style lang="scss">
|
||||
<view class="content-section">
|
||||
<view class="mine-actions grid col-4 text-center">
|
||||
<view class="action-item" @click="handleJiaoLiuQun">
|
||||
<view class="iconfont icon-friendfill text-pink icon"></view>
|
||||
<text class="text">交流群</text>
|
||||
</view>
|
||||
<view class="action-item" @click="handleBuilding">
|
||||
<view class="iconfont icon-service text-blue icon"></view>
|
||||
<text class="text">在线客服</text>
|
||||
</view>
|
||||
<view class="action-item" @click="handleBuilding">
|
||||
<view class="iconfont icon-community text-mauve icon"></view>
|
||||
<text class="text">反馈社区</text>
|
||||
</view>
|
||||
<view class="action-item" @click="handleBuilding">
|
||||
<view class="iconfont icon-dianzan text-green icon"></view>
|
||||
<text class="text">点赞我们</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="menu-list">
|
||||
<view class="list-cell list-cell-arrow" @click="handleToEditInfo">
|
||||
<view class="menu-item-box">
|
||||
<view class="iconfont icon-user menu-icon"></view>
|
||||
<view>编辑资料</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="list-cell list-cell-arrow" @click="handleHelp">
|
||||
<view class="menu-item-box">
|
||||
<view class="iconfont icon-help menu-icon"></view>
|
||||
<view>常见问题</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="list-cell list-cell-arrow" @click="handleAbout">
|
||||
<view class="menu-item-box">
|
||||
<view class="iconfont icon-aixin menu-icon"></view>
|
||||
<view>关于我们</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="list-cell list-cell-arrow" @click="handleToSetting">
|
||||
<view class="menu-item-box">
|
||||
<view class="iconfont icon-setting menu-icon"></view>
|
||||
<view>应用设置</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<style lang="scss" scoped>
|
||||
page {
|
||||
background-color: #f5f6f7;
|
||||
}
|
||||
|
||||
@ -1,7 +1,28 @@
|
||||
<script setup lang="ts">
|
||||
import tab from "@/plugins/tab";
|
||||
import list from "./template.config.js";
|
||||
|
||||
interface ListItem {
|
||||
groupName: string;
|
||||
list: FieldItem[];
|
||||
}
|
||||
|
||||
interface FieldItem {
|
||||
title: string;
|
||||
icon: string;
|
||||
path: string;
|
||||
}
|
||||
|
||||
const listData = list as ListItem[];
|
||||
const getIcon = (path: string) => `../static/uview/demo/${path}.png`;
|
||||
const openPage = (path: string) => tab.navigateTo(path)
|
||||
const getGroupTitle = (item: ListItem) => item.groupName;
|
||||
const getFieldTitle = (item: FieldItem) => item.title;
|
||||
</script>
|
||||
<template>
|
||||
<view class="wrap">
|
||||
<view class="list-wrap">
|
||||
<u-cell-group title-bg-color="rgb(243, 244, 246)" :title="getGroupTitle(item)" v-for="(item, index) in list"
|
||||
<u-cell-group title-bg-color="rgb(243, 244, 246)" :title="getGroupTitle(item)" v-for="(item, index) in listData"
|
||||
:key="index">
|
||||
<u-cell :titleStyle="{ fontWeight: 500 }" @click="openPage(item1.path)" :title="getFieldTitle(item1)"
|
||||
v-for="(item1, index1) in item.list" :key="index1">
|
||||
@ -12,54 +33,16 @@
|
||||
</u-cell-group>
|
||||
</view>
|
||||
<u-gap height="70"></u-gap>
|
||||
<!-- <u-tabbar :list="vuex_tabbar" :mid-button="true"></u-tabbar> -->
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import list from "./template.config.js";
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
list: list,
|
||||
// desc: '收集众多的常用页面和布局，减少开发者的重复工作，让你专注逻辑，事半功倍'
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
getIcon() {
|
||||
return path => {
|
||||
return '../static/uview/demo/' + path + '.png';
|
||||
return 'https://cdn.uviewui.com/uview/example/' + path + '.png';
|
||||
}
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
openPage(path) {
|
||||
this.$u.route({
|
||||
url: path
|
||||
})
|
||||
},
|
||||
getGroupTitle(item) {
|
||||
return item.groupName
|
||||
},
|
||||
getFieldTitle(item) {
|
||||
return item.title
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* page {
|
||||
</template>
|
||||
<style lang="scss" scoped>
|
||||
page {
|
||||
background-color: rgb(240, 242, 244);
|
||||
} */
|
||||
</style>
|
||||
}
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.u-cell-icon {
|
||||
.u-cell-icon {
|
||||
width: 36rpx;
|
||||
height: 36rpx;
|
||||
margin-right: 8rpx;
|
||||
}
|
||||
</style>
|
||||
|
||||
}
|
||||
</style>
|
||||
@ -75,63 +75,58 @@
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref } from "vue";
|
||||
import modal from "@/plugins/modal"
|
||||
const current=ref(0);
|
||||
const swiperDotIndex=ref(0);
|
||||
const data=ref([{
|
||||
image: '/static/images/banner/banner01.jpg'
|
||||
},
|
||||
{
|
||||
image: '/static/images/banner/banner02.jpg'
|
||||
},
|
||||
{
|
||||
image: '/static/images/banner/banner03.jpg'
|
||||
}
|
||||
]);
|
||||
import { ref } from "vue";
|
||||
import modal from "@/plugins/modal"
|
||||
const current = ref(0);
|
||||
const swiperDotIndex = ref(0);
|
||||
const data = ref([
|
||||
{ image: '/static/images/banner/banner01.jpg' },
|
||||
{ image: '/static/images/banner/banner02.jpg' },
|
||||
{ image: '/static/images/banner/banner03.jpg' }
|
||||
]);
|
||||
|
||||
function clickBannerItem(item) {
|
||||
function clickBannerItem(item) {
|
||||
console.info(item)
|
||||
};
|
||||
function changeSwiper(e) {
|
||||
};
|
||||
function changeSwiper(e) {
|
||||
current.value = e.detail.current
|
||||
}
|
||||
function changeGrid(e) {
|
||||
}
|
||||
function changeGrid(e) {
|
||||
modal.showToast({
|
||||
title: '模块建设中',
|
||||
mask: false,
|
||||
icon:'loading',
|
||||
icon: 'loading',
|
||||
duration: 1000
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
/* #ifndef APP-NVUE */
|
||||
page {
|
||||
/* #ifndef APP-NVUE */
|
||||
page {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
box-sizing: border-box;
|
||||
background-color: #fff;
|
||||
min-height: 100%;
|
||||
height: auto;
|
||||
}
|
||||
}
|
||||
|
||||
view {
|
||||
view {
|
||||
font-size: 14px;
|
||||
line-height: inherit;
|
||||
}
|
||||
}
|
||||
|
||||
/* #endif */
|
||||
/* #endif */
|
||||
|
||||
.text {
|
||||
.text {
|
||||
text-align: center;
|
||||
font-size: 26rpx;
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.grid-item-box {
|
||||
.grid-item-box {
|
||||
flex: 1;
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
@ -140,23 +135,23 @@
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 15px 0;
|
||||
}
|
||||
}
|
||||
|
||||
.uni-margin-wrap {
|
||||
.uni-margin-wrap {
|
||||
width: 690rpx;
|
||||
width: 100%;
|
||||
;
|
||||
}
|
||||
}
|
||||
|
||||
.swiper {
|
||||
.swiper {
|
||||
height: 300rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.swiper-box {
|
||||
.swiper-box {
|
||||
height: 150px;
|
||||
}
|
||||
}
|
||||
|
||||
.swiper-item {
|
||||
.swiper-item {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
@ -166,9 +161,9 @@
|
||||
color: #fff;
|
||||
height: 300rpx;
|
||||
line-height: 300rpx;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 500px) {
|
||||
@media screen and (min-width: 500px) {
|
||||
.uni-swiper-dot-box {
|
||||
width: 400px;
|
||||
/* #ifndef APP-NVUE */
|
||||
@ -180,5 +175,5 @@
|
||||
.image {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
136
src/pages_template/pages/coupon/components/jingdong-coupon.vue
Normal file
136
src/pages_template/pages/coupon/components/jingdong-coupon.vue
Normal file
@ -0,0 +1,136 @@
|
||||
<template>
|
||||
<view class="jingdong">
|
||||
<view class="left">
|
||||
<view class="sum">
|
||||
￥
|
||||
<text class="num">100</text>
|
||||
</view>
|
||||
<view class="type">满149元可用</view>
|
||||
</view>
|
||||
<view class="right">
|
||||
<view class="top">
|
||||
<view class="title">
|
||||
<text class="tag">限品类东券</text>
|
||||
<text>仅可购买个人护理部分商品</text>
|
||||
</view>
|
||||
<view class="bottom">
|
||||
<view class="date u-line-1">2020.01.01-2020.01.31</view>
|
||||
<view class="immediate-use">立即使用</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="tips">
|
||||
<view class="explain">
|
||||
<u-icon name="zhuanfa" class="transpond" :size="24"></u-icon>
|
||||
<text>可赠送</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<style scoped lang="scss">
|
||||
.jingdong {
|
||||
margin-top: 40rpx;
|
||||
width: 700rpx;
|
||||
height: auto;
|
||||
background-color: #ffffff;
|
||||
display: flex;
|
||||
|
||||
.left {
|
||||
padding: 0 30rpx;
|
||||
background-color: rgb(95, 148, 224); //rgb(94, 152, 225);
|
||||
text-align: center;
|
||||
font-size: 28rpx;
|
||||
color: #ffffff;
|
||||
|
||||
.sum {
|
||||
margin-top: 50rpx;
|
||||
font-weight: bold;
|
||||
font-size: 32rpx;
|
||||
|
||||
.num {
|
||||
font-size: 80rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.type {
|
||||
margin-bottom: 50rpx;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.right {
|
||||
padding: 20rpx 20rpx 0;
|
||||
font-size: 28rpx;
|
||||
|
||||
.top {
|
||||
border-bottom: 2rpx dashed $u-border-color;
|
||||
|
||||
.title {
|
||||
margin-right: 60rpx;
|
||||
line-height: 40rpx;
|
||||
|
||||
.tag {
|
||||
padding: 4rpx 20rpx;
|
||||
background-color: rgb(73, 154, 201);
|
||||
border-radius: 20rpx;
|
||||
color: #ffffff;
|
||||
font-weight: bold;
|
||||
font-size: 24rpx;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.bottom {
|
||||
display: flex;
|
||||
margin-top: 20rpx;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 10rpx;
|
||||
|
||||
.date {
|
||||
font-size: 20rpx;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.immediate-use {
|
||||
height: auto;
|
||||
padding: 0 20rpx;
|
||||
font-size: 24rpx;
|
||||
border-radius: 40rpx;
|
||||
line-height: 40rpx;
|
||||
color: rgb(117, 142, 165);
|
||||
border: 2rpx solid rgb(117, 142, 165);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.tips {
|
||||
width: 100%;
|
||||
line-height: 50rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
font-size: 24rpx;
|
||||
|
||||
.transpond {
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
|
||||
.explain {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.particulars {
|
||||
width: 30rpx;
|
||||
height: 30rpx;
|
||||
box-sizing: border-box;
|
||||
padding-top: 8rpx;
|
||||
border-radius: 50%;
|
||||
background-color: $u-info-disabled;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
127
src/pages_template/pages/coupon/components/meituan-coupon.vue
Normal file
127
src/pages_template/pages/coupon/components/meituan-coupon.vue
Normal file
@ -0,0 +1,127 @@
|
||||
<template>
|
||||
<view class="meituan">
|
||||
<view class="content">
|
||||
<view class="left">
|
||||
<view class="sum">
|
||||
￥<text class="num">8</text>
|
||||
</view>
|
||||
<view class="type">抵用券</view>
|
||||
</view>
|
||||
<view class="centre">
|
||||
<view class="title">【洗牙】8元无门槛红包</view>
|
||||
<view class="valid-date">今日到期</view>
|
||||
</view>
|
||||
<view class="right">
|
||||
<view size="mini" class="immediate-use" :round="true">立即使用</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="tips">
|
||||
<view class="circle-left"></view>
|
||||
<view class="circle-right"></view>
|
||||
<view class="explain u-line-1">满8.1元可用、限最新版本客户端使用</view>
|
||||
<view class="rule">
|
||||
<text>使用规则</text>
|
||||
<u-icon name="arrow-right" color="" :size="20" @click=""></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<style scoped lang="scss">
|
||||
.meituan {
|
||||
margin: 30rpx auto;
|
||||
background-color: #ffffff;
|
||||
width: 700rpx;
|
||||
// border: 10rpx;
|
||||
color: $u-warning;
|
||||
font-size: 28rpx;
|
||||
|
||||
.content {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 80rpx 20rpx;
|
||||
border: 10rpx;
|
||||
background-color: #fff5f4;
|
||||
|
||||
.left {
|
||||
.sum {
|
||||
font-size: 32rpx;
|
||||
|
||||
.num {
|
||||
font-size: 60rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.centre {
|
||||
margin-left: 40rpx;
|
||||
|
||||
.title {
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
color: $u-main-color;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.right {
|
||||
margin-left: 30rpx;
|
||||
|
||||
.immediate-use {
|
||||
padding: 0 20rpx;
|
||||
height: 50rpx;
|
||||
border-radius: 25rpx;
|
||||
line-height: 50rpx;
|
||||
background-color: $u-warning !important;
|
||||
color: #ffffff !important;
|
||||
font-size: 24rpx;
|
||||
border: none;
|
||||
word-break: keep-all;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.tips {
|
||||
padding: 0 20rpx;
|
||||
border: 10rpx;
|
||||
background-color: $u-info-light;
|
||||
position: relative;
|
||||
color: $u-tips-color;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
line-height: 60rpx;
|
||||
font-size: 24rpx;
|
||||
|
||||
.circle-left,
|
||||
.circle-right {
|
||||
position: absolute;
|
||||
height: 36rpx;
|
||||
width: 18rpx;
|
||||
background-color: #f2f2f2;
|
||||
}
|
||||
|
||||
.circle-right {
|
||||
border-radius: 40rpx 0 0 40rpx;
|
||||
right: 0;
|
||||
top: -18rpx;
|
||||
}
|
||||
|
||||
.circle-left {
|
||||
border-radius: 0 40rpx 40rpx 0;
|
||||
left: 0;
|
||||
top: -18rpx;
|
||||
}
|
||||
|
||||
.rule {
|
||||
font-size: 24rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
text {
|
||||
margin-right: 10rpx;
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
140
src/pages_template/pages/coupon/components/taobao-coupon.vue
Normal file
140
src/pages_template/pages/coupon/components/taobao-coupon.vue
Normal file
@ -0,0 +1,140 @@
|
||||
<script setup lang="ts">
|
||||
import logo from '@/static/logo.png';
|
||||
</script>
|
||||
<template>
|
||||
<view class="taobao">
|
||||
<view class="title">
|
||||
<view class="left">
|
||||
<image class="buddha" :src="logo" mode="aspectFill"></image>
|
||||
<view class="store">袜子精保护协会</view>
|
||||
</view>
|
||||
<view class="entrance">进店</view>
|
||||
</view>
|
||||
<view class="ticket">
|
||||
<view class="left">
|
||||
<image class="picture" :src="logo" mode="widthFix"></image>
|
||||
<view class="introduce">
|
||||
<view class="top">
|
||||
￥
|
||||
<text class="big">3</text>
|
||||
满88减3
|
||||
</view>
|
||||
<view class="type">店铺优惠券</view>
|
||||
<view class="date u-line-1">2019.11.28-2020.1.24</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="right">
|
||||
<view class="use immediate-use" :round="true">去使用</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<style scoped lang="scss">
|
||||
.taobao {
|
||||
margin-top: 40rpx;
|
||||
width: 700rpx;
|
||||
background-color: white;
|
||||
padding: 30rpx 20rpx 20rpx;
|
||||
border-radius: 20rpx;
|
||||
|
||||
.title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 20rpx;
|
||||
font-size: 30rpx;
|
||||
|
||||
.left {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.store {
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.buddha {
|
||||
width: 70rpx;
|
||||
height: 70rpx;
|
||||
border-radius: 10rpx;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
|
||||
.entrance {
|
||||
color: $u-info;
|
||||
border: solid 2rpx $u-info;
|
||||
line-height: 48rpx;
|
||||
padding: 0 30rpx;
|
||||
background: none;
|
||||
border-radius: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
.ticket {
|
||||
display: flex;
|
||||
|
||||
.left {
|
||||
width: 70%;
|
||||
padding: 30rpx 20rpx;
|
||||
background-color: rgb(255, 245, 244);
|
||||
border-radius: 20rpx;
|
||||
border-right: dashed 2rpx rgb(224, 215, 211);
|
||||
display: flex;
|
||||
|
||||
.picture {
|
||||
width: 172rpx;
|
||||
height: 172rpx;
|
||||
border-radius: 20rpx;
|
||||
}
|
||||
|
||||
.introduce {
|
||||
margin-left: 10rpx;
|
||||
|
||||
.top {
|
||||
color: $u-warning;
|
||||
font-size: 28rpx;
|
||||
|
||||
.big {
|
||||
font-size: 60rpx;
|
||||
font-weight: bold;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.type {
|
||||
font-size: 28rpx;
|
||||
color: $u-info-dark;
|
||||
}
|
||||
|
||||
.date {
|
||||
margin-top: 10rpx;
|
||||
font-size: 20rpx;
|
||||
color: $u-info-dark;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.right {
|
||||
width: 30%;
|
||||
padding: 40rpx 20rpx;
|
||||
background-color: rgb(255, 245, 244);
|
||||
border-radius: 20rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.use {
|
||||
height: auto;
|
||||
padding: 0 20rpx;
|
||||
font-size: 24rpx;
|
||||
border-radius: 40rpx;
|
||||
color: #ffffff !important;
|
||||
background-color: $u-warning !important;
|
||||
line-height: 40rpx;
|
||||
color: rgb(117, 142, 165);
|
||||
margin-left: 20rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -1,92 +1,13 @@
|
||||
<script setup>
|
||||
import MeituanCoupon from './components/meituan-coupon.vue';
|
||||
import JingdongCoupon from './components/jingdong-coupon.vue';
|
||||
import TaobaoCoupon from './components/taobao-coupon.vue';
|
||||
</script>
|
||||
<template>
|
||||
<view class="u-wrap">
|
||||
<view class="meituan">
|
||||
<view class="content">
|
||||
<view class="left">
|
||||
<view class="sum">
|
||||
￥
|
||||
<text class="num">8</text>
|
||||
</view>
|
||||
<view class="type">抵用券</view>
|
||||
</view>
|
||||
<view class="centre">
|
||||
<view class="title">【洗牙】8元无门槛红包</view>
|
||||
<view class="valid-date">今日到期</view>
|
||||
</view>
|
||||
<view class="right">
|
||||
<view size="mini" class="immediate-use" :round="true">立即使用</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="tips">
|
||||
<view class="circle-left"></view>
|
||||
<view class="circle-right"></view>
|
||||
<view class="explain u-line-1">满8.1元可用、限最新版本客户端使用</view>
|
||||
<view class="rule" @tap="xxx122">
|
||||
<text>使用规则</text>
|
||||
<u-icon name="arrow-right" color="" :size="20" @click=""></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="jingdong">
|
||||
<view class="left">
|
||||
<view class="sum">
|
||||
￥
|
||||
<text class="num">100</text>
|
||||
</view>
|
||||
<view class="type">满149元可用</view>
|
||||
</view>
|
||||
<view class="right">
|
||||
<view class="top">
|
||||
<view class="title">
|
||||
<text class="tag">限品类东券</text>
|
||||
<text>仅可购买个人护理部分商品</text>
|
||||
</view>
|
||||
<view class="bottom">
|
||||
<view class="date u-line-1">2020.01.01-2020.01.31</view>
|
||||
<view class="immediate-use">立即使用</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="tips">
|
||||
<view class="explain">
|
||||
<u-icon name="zhuanfa" class="transpond" :size="24"></u-icon>
|
||||
<text>可赠送</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="taobao">
|
||||
<view class="title">
|
||||
<view class="left">
|
||||
<image class="buddha"
|
||||
src="https://ss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=1975388697,1068670603&fm=26&gp=0.jpg"
|
||||
mode="aspectFill"></image>
|
||||
<view class="store">袜子精保护协会</view>
|
||||
</view>
|
||||
<view class="entrance">进店</view>
|
||||
</view>
|
||||
<view class="ticket">
|
||||
<view class="left">
|
||||
<image class="picture"
|
||||
src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1578059523488&di=5f592ac19c1b983005d3e85add469756&imgtype=0&src=http%3A%2F%2Fimg010.hc360.cn%2Fg7%2FM00%2F2D%2FB9%2FwKhQs1QfUo6EdeM-AAAAALwk1hM072.jpg"
|
||||
mode="widthFix"></image>
|
||||
<view class="introduce">
|
||||
<view class="top">
|
||||
￥
|
||||
<text class="big">3</text>
|
||||
满88减3
|
||||
</view>
|
||||
<view class="type">店铺优惠券</view>
|
||||
<view class="date u-line-1">2019.11.28-2020.1.24</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="right">
|
||||
<view class="use immediate-use" :round="true">去使用</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
<MeituanCoupon />
|
||||
<JingdongCoupon />
|
||||
<TaobaoCoupon />
|
||||
</view>
|
||||
</template>
|
||||
|
||||
@ -99,315 +20,4 @@ page {
|
||||
.u-wrap {
|
||||
padding: 24rpx;
|
||||
}
|
||||
|
||||
.meituan {
|
||||
margin: 30rpx auto;
|
||||
background-color: #ffffff;
|
||||
width: 700rpx;
|
||||
// border: 10rpx;
|
||||
color: $u-warning;
|
||||
font-size: 28rpx;
|
||||
|
||||
.content {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 80rpx 20rpx;
|
||||
border: 10rpx;
|
||||
background-color: #fff5f4;
|
||||
|
||||
.left {
|
||||
.sum {
|
||||
font-size: 32rpx;
|
||||
|
||||
.num {
|
||||
font-size: 60rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.centre {
|
||||
margin-left: 40rpx;
|
||||
|
||||
.title {
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
color: $u-main-color;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.right {
|
||||
margin-left: 30rpx;
|
||||
|
||||
.immediate-use {
|
||||
padding: 0 20rpx;
|
||||
height: 50rpx;
|
||||
border-radius: 25rpx;
|
||||
line-height: 50rpx;
|
||||
background-color: $u-warning !important;
|
||||
color: #ffffff !important;
|
||||
font-size: 24rpx;
|
||||
border: none;
|
||||
word-break: keep-all;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.tips {
|
||||
padding: 0 20rpx;
|
||||
border: 10rpx;
|
||||
background-color: $u-info-light;
|
||||
position: relative;
|
||||
color: $u-tips-color;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
line-height: 60rpx;
|
||||
font-size: 24rpx;
|
||||
|
||||
.circle-left,
|
||||
.circle-right {
|
||||
position: absolute;
|
||||
height: 36rpx;
|
||||
width: 18rpx;
|
||||
background-color: #f2f2f2;
|
||||
}
|
||||
|
||||
.circle-right {
|
||||
border-radius: 40rpx 0 0 40rpx;
|
||||
right: 0;
|
||||
top: -18rpx;
|
||||
}
|
||||
|
||||
.circle-left {
|
||||
border-radius: 0 40rpx 40rpx 0;
|
||||
left: 0;
|
||||
top: -18rpx;
|
||||
}
|
||||
|
||||
.rule {
|
||||
font-size: 24rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
text {
|
||||
margin-right: 10rpx;
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.jingdong {
|
||||
margin-top: 40rpx;
|
||||
width: 700rpx;
|
||||
height: auto;
|
||||
background-color: #ffffff;
|
||||
display: flex;
|
||||
|
||||
.left {
|
||||
padding: 0 30rpx;
|
||||
background-color: rgb(95, 148, 224); //rgb(94, 152, 225);
|
||||
text-align: center;
|
||||
font-size: 28rpx;
|
||||
color: #ffffff;
|
||||
|
||||
.sum {
|
||||
margin-top: 50rpx;
|
||||
font-weight: bold;
|
||||
font-size: 32rpx;
|
||||
|
||||
.num {
|
||||
font-size: 80rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.type {
|
||||
margin-bottom: 50rpx;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.right {
|
||||
padding: 20rpx 20rpx 0;
|
||||
font-size: 28rpx;
|
||||
|
||||
.top {
|
||||
border-bottom: 2rpx dashed $u-border-color;
|
||||
|
||||
.title {
|
||||
margin-right: 60rpx;
|
||||
line-height: 40rpx;
|
||||
|
||||
.tag {
|
||||
padding: 4rpx 20rpx;
|
||||
background-color: rgb(73, 154, 201);
|
||||
border-radius: 20rpx;
|
||||
color: #ffffff;
|
||||
font-weight: bold;
|
||||
font-size: 24rpx;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.bottom {
|
||||
display: flex;
|
||||
margin-top: 20rpx;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 10rpx;
|
||||
|
||||
.date {
|
||||
font-size: 20rpx;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.immediate-use {
|
||||
height: auto;
|
||||
padding: 0 20rpx;
|
||||
font-size: 24rpx;
|
||||
border-radius: 40rpx;
|
||||
line-height: 40rpx;
|
||||
color: rgb(117, 142, 165);
|
||||
border: 2rpx solid rgb(117, 142, 165);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.tips {
|
||||
width: 100%;
|
||||
line-height: 50rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
font-size: 24rpx;
|
||||
|
||||
.transpond {
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
|
||||
.explain {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.particulars {
|
||||
width: 30rpx;
|
||||
height: 30rpx;
|
||||
box-sizing: border-box;
|
||||
padding-top: 8rpx;
|
||||
border-radius: 50%;
|
||||
background-color: $u-info-disabled;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.taobao {
|
||||
margin-top: 40rpx;
|
||||
width: 700rpx;
|
||||
background-color: white;
|
||||
padding: 30rpx 20rpx 20rpx;
|
||||
border-radius: 20rpx;
|
||||
|
||||
.title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 20rpx;
|
||||
font-size: 30rpx;
|
||||
|
||||
.left {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.store {
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.buddha {
|
||||
width: 70rpx;
|
||||
height: 70rpx;
|
||||
border-radius: 10rpx;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
|
||||
.entrance {
|
||||
color: $u-info;
|
||||
border: solid 2rpx $u-info;
|
||||
line-height: 48rpx;
|
||||
padding: 0 30rpx;
|
||||
background: none;
|
||||
border-radius: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
.ticket {
|
||||
display: flex;
|
||||
|
||||
.left {
|
||||
width: 70%;
|
||||
padding: 30rpx 20rpx;
|
||||
background-color: rgb(255, 245, 244);
|
||||
border-radius: 20rpx;
|
||||
border-right: dashed 2rpx rgb(224, 215, 211);
|
||||
display: flex;
|
||||
|
||||
.picture {
|
||||
width: 172rpx;
|
||||
height: 172rpx;
|
||||
border-radius: 20rpx;
|
||||
}
|
||||
|
||||
.introduce {
|
||||
margin-left: 10rpx;
|
||||
|
||||
.top {
|
||||
color: $u-warning;
|
||||
font-size: 28rpx;
|
||||
|
||||
.big {
|
||||
font-size: 60rpx;
|
||||
font-weight: bold;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.type {
|
||||
font-size: 28rpx;
|
||||
color: $u-info-dark;
|
||||
}
|
||||
|
||||
.date {
|
||||
margin-top: 10rpx;
|
||||
font-size: 20rpx;
|
||||
color: $u-info-dark;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.right {
|
||||
width: 30%;
|
||||
padding: 40rpx 20rpx;
|
||||
background-color: rgb(255, 245, 244);
|
||||
border-radius: 20rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.use {
|
||||
height: auto;
|
||||
padding: 0 20rpx;
|
||||
font-size: 24rpx;
|
||||
border-radius: 40rpx;
|
||||
color: #ffffff !important;
|
||||
background-color: $u-warning !important;
|
||||
line-height: 40rpx;
|
||||
color: rgb(117, 142, 165);
|
||||
margin-left: 20rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -1,13 +1,9 @@
|
||||
<script setup>
|
||||
import { ref } from 'vue'
|
||||
import { onLoad } from '@dcloudio/uni-app'
|
||||
|
||||
const show = ref(false)
|
||||
const password = ref('')
|
||||
|
||||
onLoad(() => {
|
||||
})
|
||||
|
||||
const onChange = (val) => {
|
||||
if (password.value.length < 6) {
|
||||
password.value += val
|
||||
@ -25,10 +21,7 @@ const onBackspace = () => {
|
||||
}
|
||||
|
||||
const pay = () => {
|
||||
uni.showLoading({
|
||||
title: '支付中'
|
||||
})
|
||||
|
||||
uni.showLoading({ title: '支付中' })
|
||||
setTimeout(() => {
|
||||
uni.hideLoading()
|
||||
show.value = false
|
||||
|
||||
@ -22,7 +22,7 @@
|
||||
}
|
||||
|
||||
.list-cell-arrow::before {
|
||||
content: ' ';
|
||||
content: " ";
|
||||
height: 10px;
|
||||
width: 10px;
|
||||
border-width: 2px 2px 0 0;
|
||||
@ -34,27 +34,27 @@
|
||||
top: 50%;
|
||||
margin-top: -6px;
|
||||
right: 30rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.list-cell {
|
||||
.list-cell {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
background-color: #fff;
|
||||
color: #333;
|
||||
padding: 26rpx 30rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.list-cell:first-child {
|
||||
.list-cell:first-child {
|
||||
border-radius: 8rpx 8rpx 0 0;
|
||||
}
|
||||
}
|
||||
|
||||
.list-cell:last-child {
|
||||
.list-cell:last-child {
|
||||
border-radius: 0 0 8rpx 8rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.list-cell::after {
|
||||
content: '';
|
||||
.list-cell::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
border-bottom: 1px solid #eaeef1;
|
||||
-webkit-transform: scaleY(0.5) translateZ(0);
|
||||
@ -64,10 +64,9 @@
|
||||
right: 0;
|
||||
left: 0;
|
||||
pointer-events: none;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.menu-list {
|
||||
.menu-list {
|
||||
margin: 15px 15px;
|
||||
|
||||
.menu-item-box {
|
||||
@ -76,7 +75,7 @@
|
||||
align-items: center;
|
||||
|
||||
.menu-icon {
|
||||
color: #007AFF;
|
||||
color: #007aff;
|
||||
font-size: 16px;
|
||||
margin-right: 5px;
|
||||
}
|
||||
@ -87,4 +86,4 @@
|
||||
color: #999;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -46,7 +46,7 @@ const useUserStore = defineStore("user", {
|
||||
const avatar =
|
||||
user.avatar == "" || user.avatar == null
|
||||
? defAva
|
||||
: import.meta.env.VITE_APP_BASE_API + user.avatar;
|
||||
: user.avatar;
|
||||
|
||||
if (res.roles && res.roles.length > 0) {
|
||||
// 验证返回的roles是否是一个非空数组
|
||||
|
||||
Loading…
Reference in New Issue
Block a user