Browse Source

灵动岛

dev_des
1054425342@qq.com 2 months ago
parent
commit
0d170b8380
  1. 14
      App.vue
  2. 282
      components/DynamicIsland.vue
  3. 450
      pages/index/iSoul.vue
  4. 5
      subPackages/orderQy/detail.vue

14
App.vue

@ -1,6 +1,5 @@
<script>
import store from './store'
import store from "./store";
export default {
globalData: {
mainSliderIndex: 0,
@ -34,7 +33,7 @@ export default {
onShow: function () {
//
this.recordAppShow();
this.getUserInfo()
this.getUserInfo();
},
onHide: function () {
// 退
@ -42,11 +41,10 @@ export default {
},
methods: {
getUserInfo() {
if(!this.getUserId())return
this.Post({}, "/framework/user/getInfo", "DES")
.then((res) => {
uni.setStorageSync('userInfo', JSON.stringify(res.data))
})
if (!this.getUserId()) return;
this.Post({}, "/framework/user/getInfo", "DES").then((res) => {
uni.setStorageSync("userInfo", JSON.stringify(res.data));
});
},
// 使
initUserUsageStats() {

282
components/DynamicIsland.vue

@ -16,48 +16,64 @@
>
<!-- 展开状态 -->
<view v-if="!actualCompactState" class="expanded-content">
<!-- <view style="display: flex;align-items: center;justify-content: center;color: white;" v-if="!(userInfo&&userInfo.token)">
去登录
</view> -->
<template>
<template v-if="styleType != 'timeShop'">
<view class="top-section">
<text class="welcome-text" v-if="userInfo && userInfo.token">{{
title
}}</text>
<text class="welcome-text" v-else @click="toLogin"
>hi 快去登录 ></text
<!-- 三栏布局 -->
<view class="three-column-layout">
<!-- 左侧欢迎信息 -->
<view class="left-section">
<view class="welcome-message">
<text class="welcome-text"
>Hi!{{
userInfo && userInfo.token ? userInfo.nickname : "用户"
}}</text
>
<view class="qr-code">
<image
style="width: 39rpx; height: 39rpx"
src="https://epic.js-dyyj.com/uploads/20250728/88e0991e58e692c86c25e42537edc6ca.png"
></image>
<text class="welcome-subtitle">欢迎回来~</text>
</view>
<view class="stats-info">
<text class="stats-number">2</text>
<text class="stats-unit"></text>
</view>
<view class="bottom-section">
<view class="stats-section">
<view class="stat-item">
<text class="stat-number">{{ getStatNumber("权益") }}</text>
<text class="stat-label">权益</text>
<view class="stats-label">文旅权益</view>
</view>
<view class="stat-item">
<text class="stat-number">{{
getStatNumber("时间银行")
}}</text>
<text class="stat-label">时间银行</text>
<!-- 左侧分隔线 -->
<view class="column-divider"></view>
<!-- 中间时间奖励 -->
<view class="middle-section">
<view class="time-reward-container">
<text class="time-reward-title">时间奖励</text>
<view class="time-reward-stats">
<text class="time-reward-number">120</text>
<text class="time-reward-unit"></text>
</view>
<text class="time-reward-label">文旅时间银行</text>
</view>
<view class="divider"></view>
<view class="action-section">
<text class="action-text">{{ actionText }}</text>
</view>
<!-- 右侧分隔线 -->
<view class="column-divider"></view>
<!-- 右侧头像和链接 -->
<view class="right-section">
<view class="avatar-container">
<image
@click="toWebView"
class="avatar"
src="https://epic.js-dyyj.com/uploads/20250728/7d9ba1fe109643681396cb03f60f3218.png"
mode="aspectFill"
></image>
</view>
<view class="">
<view class="profile-info">
<text class="profile-title">文化工厂主理人</text>
<text class="profile-name">EVITA</text>
</view>
<view class="platform-link" @click="toWebView">
<text class="link-text">平台简介 >></text>
</view>
</view>
</view>
</view>
</template>
<template v-if="styleType == 'timeShop'">
@ -169,6 +185,7 @@ export default {
currentAvatar: "https://picsum.photos/80/80",
currentAction: "激活你的Agent",
userInfo: {},
JDSU_IMG_URL: "https://epic.js-dyyj.com",
};
},
computed: {
@ -332,6 +349,16 @@ export default {
"https://des.js-dyyj.com/dist/#/",
});
},
//
showImg(img) {
if (!img) return;
if (img.indexOf("https://") != -1 || img.indexOf("http://") != -1) {
return img;
} else {
return this.JDSU_IMG_URL + img;
}
},
},
};
</script>
@ -344,7 +371,7 @@ export default {
position: relative;
opacity: 1;
transition: opacity 0.3s ease;
padding:24rpx 0
padding: 24rpx 0;
}
.dynamic-island-placeholder.visible {
@ -362,13 +389,12 @@ export default {
margin: 0 auto;
z-index: 100;
background: rgba(0, 0, 0, 0.75);
background: linear-gradient(180deg, #fffdb7 0%, #97fffa 100%);
backdrop-filter: blur(20rpx);
-webkit-backdrop-filter: blur(20rpx);
border: 1rpx solid rgba(255, 255, 255, 0.1);
border-radius: 40rpx;
box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.3),
0 0 0 1rpx rgba(255, 255, 255, 0.05) inset;
box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.1),
0 0 0 1rpx rgba(255, 255, 255, 0.2) inset;
transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
overflow: hidden;
@ -414,54 +440,182 @@ export default {
display: flex;
flex-direction: column;
height: 100%;
padding: 24rpx 32rpx;
padding: 24rpx 20rpx;
opacity: 1;
visibility: visible;
transition: opacity 0.2s ease-in 0.1s, visibility 0s linear 0s;
}
.top-section {
/* 三栏布局样式 */
.three-column-layout {
display: flex;
align-items: flex-end;
justify-content: space-between;
align-items: center;
height: 100%;
width: 100%;
}
/* 列分隔线 */
.column-divider {
width: 2rpx;
height: 60rpx;
background: rgba(0, 0, 0, 0.1);
margin: 35rpx 16rpx;
flex-shrink: 0;
}
/* 左侧区域 */
.left-section {
display: flex;
flex-direction: column;
align-items: flex-start;
color: #333;
width: 140rpx;
}
.welcome-message {
display: flex;
flex-direction: column;
margin-bottom: 16rpx;
}
.welcome-text {
font-size: 28rpx;
color: #ffffff;
font-weight: 500;
font-size: 24rpx;
color: #000000;
font-weight: bold;
line-height: 1.2;
}
.welcome-subtitle {
font-size: 24rpx;
color: #000000;
margin-top: 4rpx;
font-weight: bold;
}
.stats-info {
display: flex;
align-items: baseline;
margin-bottom: 8rpx;
}
.stats-number {
font-size: 40rpx;
color: #333;
font-weight: bold;
line-height: 1;
}
.stats-unit {
font-size: 24rpx;
color: #000000;
margin-left: 4rpx;
}
.stats-label {
font-size: 22rpx;
color: #000000;
}
/* 中间区域 */
.middle-section {
display: flex;
justify-content: flex-start;
align-items: center;
flex: 1;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.time-reward-container {
display: flex;
flex-direction: column;
justify-content: flex-end;
align-items: flex-start;
padding: 0 10rpx;
width: 160rpx;
}
.time-reward-title {
font-size: 22rpx;
color: #000000;
font-weight: 500;
margin-bottom: 12rpx;
}
.time-reward-stats {
display: flex;
align-items: baseline;
margin-bottom: 8rpx;
}
.time-reward-number {
font-size: 40rpx;
color: #000000;
font-weight: bold;
line-height: 1;
}
.time-reward-unit {
font-size: 24rpx;
color: #000000;
margin-left: 4rpx;
}
.qr-code {
width: 32rpx;
height: 32rpx;
.time-reward-label {
font-size: 22rpx;
color: #000000;
}
.qr-icon {
width: 24rpx;
height: 24rpx;
background: rgba(255, 255, 255, 0.8);
border-radius: 4rpx;
/* 右侧区域 */
.right-section {
display: flex;
align-items: flex-end;
width: 375rpx;
}
.avatar-container {
position: relative;
margin-right: 10rpx;
width: 140rpx;
height: 140rpx;
}
.avatar {
width: 140rpx;
height: 140rpx;
border-radius: 50%;
}
.profile-info {
display: flex;
flex-direction: column;
align-items: flex-start;
justify-content: flex-start;
}
.profile-title {
font-size: 24rpx;
color: #000000;
margin-bottom: 4rpx;
font-weight: bold;
}
.profile-name {
font-size: 24rpx;
color: #000000;
font-weight: bold;
}
&::before {
content: "";
position: absolute;
top: 2rpx;
left: 2rpx;
right: 2rpx;
bottom: 2rpx;
background: rgba(0, 0, 0, 0.6);
border-radius: 2rpx;
.platform-link {
cursor: pointer;
}
.link-text {
font-size: 22rpx;
color: #000000;
text-decoration: underline;
}
/* 保留原有的底部区域样式用于timeShop模式 */
.bottom-section {
display: flex;
align-items: center;
@ -521,12 +675,6 @@ export default {
max-width: 200rpx;
}
.avatar {
width: 113rpx;
height: 113rpx;
border-radius: 50%;
}
//
.dynamic-island:active {
transform: scale(0.98);
@ -561,7 +709,7 @@ export default {
.compact-name {
font-size: 27rpx;
color: #ffffff;
color: #333;
font-weight: bold;
flex: 1;
text-align: left;
@ -575,7 +723,7 @@ export default {
width: 48rpx;
height: 48rpx;
border-radius: 50%;
border: 2rpx solid rgba(255, 255, 255, 0.3);
border: 2rpx solid rgba(0, 0, 0, 0.2);
flex-shrink: 0;
}

450
pages/index/iSoul.vue

@ -1,10 +1,13 @@
<template>
<view class="profile-container">
<view class="user-top" :style="{
<view
class="user-top"
:style="{
backgroundImage: `url(${showImg(
'/uploads/20250728/4ad18fba010760a527d0cf5e24bcf467.png'
)})`,
}">
}"
>
<!-- 状态栏占位 -->
<view class="status-bar-placeholder"></view>
<!-- 顶部导航 -->
@ -19,12 +22,24 @@
<!-- 用户信息区域 -->
<view class="user-section" @click="gotoProfile">
<view class="user-avatar">
<image :src="userInfo.avatar ? showImg(userInfo.avatar) : defaultAvatar" mode="aspectFill"
class="avatar-img"></image>
<image
:src="userInfo.avatar ? showImg(userInfo.avatar) : defaultAvatar"
mode="aspectFill"
class="avatar-img"
></image>
</view>
<view class="user-info">
<view class="username">{{ userInfo.nickname || "去登录" }}<uni-icons type="right" size="16" style="margin-left: 10rpx;" color="#ffffff" /></view>
<view class="user-id" v-if="userInfo.redBookId">ID{{ userInfo.redBookId || "123456" }}</view>
<view class="username"
>{{ userInfo.nickname || "去登录"
}}<uni-icons
type="right"
size="16"
style="margin-left: 10rpx"
color="#ffffff"
/></view>
<view class="user-id" v-if="userInfo.redBookId"
>ID{{ userInfo.redBookId || "123456" }}</view
>
<!-- <view class="location">
<text class="location-icon">📍</text>
<text>IP属地{{ userInfo.location || "上海" }}</text>
@ -72,10 +87,23 @@
<view class="agent-title">待激活的Agent</view>
</view>
<view class="agent-content">
<scroll-view class="agent-scroll" scroll-x="true" :show-scrollbar="false" :enhanced="true">
<scroll-view
class="agent-scroll"
scroll-x="true"
:show-scrollbar="false"
:enhanced="true"
>
<view class="agent-avatars">
<view class="agent-avatar" v-for="(agent, index) in agentList" :key="index">
<image :src="agent.avatar" mode="aspectFill" class="agent-img"></image>
<view
class="agent-avatar"
v-for="(agent, index) in agentList"
:key="index"
>
<image
:src="agent.avatar"
mode="aspectFill"
class="agent-img"
></image>
</view>
</view>
</scroll-view>
@ -93,11 +121,58 @@
<!-- 数字资产权益 -->
<view class="digital-assets">
<view class="asset-card">
<image @click="handleAssetAction()" :src="
<!-- 有数据时显示滑动卡片 -->
<view v-if="assetList.length > 0" class="asset-scroll-container">
<scroll-view
class="asset-scroll"
scroll-x="true"
:show-scrollbar="false"
:enhanced="true"
>
<view class="asset-cards">
<view
class="asset-card"
v-for="(asset, index) in assetList"
:key="index"
@click="handleAction(asset)"
>
<view class="asset-card-wrapper">
<image
:src="showImgJdsz(asset.image)"
mode="aspectFill"
class="asset-img"
></image>
<view class="asset-overlay">
<view class="asset-badge">{{ asset.badge }}</view>
<view class="asset-name">{{ asset.name }}</view>
<view class="asset-desc">{{ asset.desc }}</view>
<view
class="asset-action"
style="flex-direction: row; padding: 20rpx"
>
<text class="action-text">{{ asset.actionText }}</text>
<text class="action-arrow"></text>
</view>
</view>
</view>
</view>
</view>
</scroll-view>
</view>
<!-- 无数据时显示原来的图片风格 -->
<view v-else class="asset-card-old">
<image
@click="handleAssetAction('待使用')"
:src="
showImg('/uploads/20250729/42598a2dcf4c9a6f8c6e122e54b65c4f.png')
" mode="aspectFill" class="digital-img"></image>
"
mode="aspectFill"
class="digital-img"
></image>
</view>
<!-- 底部操作按钮 -->
<view class="asset-actions">
<view class="asset-action active" @click="handleAssetAction('待使用')">
<view class="action-icon red"></view>
@ -117,16 +192,22 @@
</view>
</view>
</view>
</view>
<!-- 有感商品 -->
<view class="feeling-goods">
<view class="goods-card">
<image :src="
<image
:src="
showImg('/uploads/20250729/a010feb51e3f195563fb440f9235cc8b.png')
" mode="aspectFill" class="digital-img"></image>
"
mode="aspectFill"
class="digital-img"
></image>
<view class="goods-actions">
<view class="goods-action active" @click="handleGoodsAction('购物车')">
<view
class="goods-action active"
@click="handleGoodsAction('购物车')"
>
<view class="action-icon red"></view>
<text>购物车</text>
</view>
@ -154,15 +235,25 @@
<view class="divider-line"></view>
</view>
<!-- 有数据时显示 -->
<view class="memorial-cards" v-if="memorialItems.length > 0" :class="{'single-item': memorialItems.length === 1}">
<view
class="memorial-cards"
v-if="memorialItems.length > 0"
:class="{ 'single-item': memorialItems.length === 1 }"
>
<!-- 单条数据特殊展示 -->
<template v-if="memorialItems.length === 1">
<view class="memorial-card-single" @click="handleMemorialClick(0)">
<view class="single-card-wrapper">
<image :src="showImg(memorialItems[0].goodsImg )" mode="aspectFill" class="memorial-img-single"></image>
<image
:src="showImg(memorialItems[0].goodsImg)"
mode="aspectFill"
class="memorial-img-single"
></image>
<view class="single-overlay">
<view class="single-badge">专属纪念册</view>
<view class="single-title">{{ memorialItems[0].goodsTitle || '数字资产纪念册' }}</view>
<view class="single-title">{{
memorialItems[0].goodsTitle || "数字资产纪念册"
}}</view>
<view class="single-desc">{{ memorialItems[0].code }}</view>
<view class="single-action">
<text class="action-text">立即查看</text>
@ -174,10 +265,21 @@
</template>
<!-- 多条数据正常展示 -->
<template v-else>
<view class="memorial-card" v-for="(item, index) in memorialItems" :key="index" @click="handleMemorialClick(index)">
<image :src="showImg(item.goodsImg )" mode="aspectFill" class="memorial-img"></image>
<view
class="memorial-card"
v-for="(item, index) in memorialItems"
:key="index"
@click="handleMemorialClick(index)"
>
<image
:src="showImg(item.goodsImg)"
mode="aspectFill"
class="memorial-img"
></image>
<view class="memorial-info">
<text class="memorial-title">{{ item.goodsTitle || '数字资产纪念册' }}</text>
<text class="memorial-title">{{
item.goodsTitle || "数字资产纪念册"
}}</text>
<text class="memorial-more">MORE</text>
</view>
</view>
@ -196,7 +298,12 @@
<!-- 底部菜单 -->
<view class="bottom-menu">
<view class="menu-item" v-for="(item, index) in menuItems" :key="index" @click="handleMenuClick(item)">
<view
class="menu-item"
v-for="(item, index) in menuItems"
:key="index"
@click="handleMenuClick(item)"
>
<text>{{ item.title }}</text>
</view>
</view>
@ -214,7 +321,11 @@
<view class="popup-content">
<view class="input-section">
<text class="input-label">请输入兑换码</text>
<input class="exchange-input" v-model="exchangeCode" placeholder="请输入兑换码" />
<input
class="exchange-input"
v-model="exchangeCode"
placeholder="请输入兑换码"
/>
</view>
<view class="popup-actions">
<button class="cancel-btn" @click="closeExchangePopup">取消</button>
@ -240,26 +351,33 @@
data() {
return {
userInfo: {},
defaultAvatar: "https://changshu.js-dyyj.com/uploads/20250326/516242619f0772bee371a60684618c01.png",
defaultAvatar:
"https://changshu.js-dyyj.com/uploads/20250326/516242619f0772bee371a60684618c01.png",
userStats: {
following: "140",
followers: "2462",
likes: "5.4万",
},
agentList: [{
avatar: "https://epic.js-dyyj.com/uploads/20250728/d27ef6e6c26877da7775664fed376c6f.png",
agentList: [
{
avatar:
"https://epic.js-dyyj.com/uploads/20250728/d27ef6e6c26877da7775664fed376c6f.png",
},
{
avatar: "https://epic.js-dyyj.com/uploads/20250728/d7bf0dd2f3f272afba687b525a7c575c.png",
avatar:
"https://epic.js-dyyj.com/uploads/20250728/d7bf0dd2f3f272afba687b525a7c575c.png",
},
{
avatar: "https://epic.js-dyyj.com/uploads/20250728/d27ef6e6c26877da7775664fed376c6f.png",
avatar:
"https://epic.js-dyyj.com/uploads/20250728/d27ef6e6c26877da7775664fed376c6f.png",
},
{
avatar: "https://epic.js-dyyj.com/uploads/20250728/d7bf0dd2f3f272afba687b525a7c575c.png",
avatar:
"https://epic.js-dyyj.com/uploads/20250728/d7bf0dd2f3f272afba687b525a7c575c.png",
},
],
menuItems: [{
menuItems: [
{
title: "账号与安全",
icon: "🔒",
},
@ -283,10 +401,12 @@
title: "帮助与客服",
icon: "💬",
},
],
exchangeCode: "", //
memorialItems:[]
memorialItems: [],
assetList: [
],
};
},
onLoad() {
@ -297,21 +417,20 @@
this.userInfo =
(uni.getStorageSync("userInfo") &&
JSON.parse(uni.getStorageSync("userInfo"))) ||
this.$store.state.user.userInfo || {};
this.$store.state.user.userInfo ||
{};
console.log(this.userInfo);
if (this.userInfo && this.userInfo.token) {
this.getListIp()
this.getListIp();
this.getOrderChildList();
}
},
methods: {
getListIp() {
this.Post({},
"/framework/order/ipOrderList",
"DES"
).then((res) => {
this.Post({}, "/framework/order/ipOrderList", "DES").then((res) => {
if (res.code == 200) {
if (res.data) {
this.memorialItems = res.data.slice(0,2)
this.memorialItems = res.data.slice(0, 2);
}
} else {
uni.showToast({
@ -321,6 +440,47 @@
}
});
},
// 使
getOrderChildList() {
this.Post({}, "/framework/order/orderChildList", "DES")
.then((res) => {
if (res.code == 200) {
if (res.data && res.data.length > 0) {
// assetList
this.assetList = res.data.map((item) => ({
image:
item.goodsImg ||
"/uploads/20250729/42598a2dcf4c9a6f8c6e122e54b65c4f.png",
badge: "待使用",
name: item.goodsTitle || "数字资产权益",
desc: item.type==1?'您的专属数字资产':item.type==2?'IP资源商品': item.skuName,
actionText:item.type==1?'去查看':item.type==2?'去预约': "去核销",
status: "待使用",
...item, //
}));
} else {
// assetList
this.assetList = [];
}
} else {
uni.showToast({
title: res.msg || "获取商品列表失败",
icon: "none",
});
//
this.assetList = [];
}
})
.catch((error) => {
console.error("获取商品列表失败:", error);
uni.showToast({
title: "获取商品列表失败",
icon: "none",
});
this.assetList = [];
});
},
//
goBack() {
uni.navigateBack();
@ -369,7 +529,8 @@
case "帮助与客服":
uni.showModal({
title: "客服电话",
content: "0515-69186109\n服务时间:周一至周五\n9:00-12:00,13:00-18:00",
content:
"0515-69186109\n服务时间:周一至周五\n9:00-12:00,13:00-18:00",
confirmText: "拨打",
success: (res) => {
if (res.confirm) {
@ -400,9 +561,36 @@
});
}
},
handleAction(item){
if(item.type==1){
uni.navigateTo({
url: "/subPackages/memorialAlbum/detail?id=" + item.childId,
});
}else if(item.type==2){
uni.navigateTo({
url: `/subPackages/orderQy/confrim?goodsId=${item.goodsId}&orderChildId=${item.childId}`,
});
}else{
uni.showToast({
title: "使用门票",
icon: "none",
});
}
},
//
handleAssetAction(action) {
handleAssetAction(action, asset = null) {
// asset
if (asset && asset.orderId) {
//
uni.navigateTo({
url: `/subPackages/orderQy/detail?id=${asset.orderId}`,
});
return;
}
//
switch (action) {
case "待使用":
uni.navigateTo({
@ -429,7 +617,14 @@
url: "/subPackages/orderQy/list",
});
break;
}
},
showImgJdsz(img) {
if (!img) return;
if (img.indexOf("https://") != -1 || img.indexOf("http://") != -1) {
return img;
} else {
return this.JDSU_IMG_URL + img;
}
},
//
@ -486,9 +681,8 @@
return;
}
this.Post({
this.Post(
{
activeCode: this.exchangeCode.trim(),
},
"/framework/order/active",
@ -498,15 +692,13 @@
uni.showToast({
title: "兑换成功,为您跳转订单页~",
icon: "none",
});
this.closeExchangePopup()
this.closeExchangePopup();
setTimeout(() => {
uni.navigateTo({
url: "/subPackages/orderQy/list"
})
}, 2000)
url: "/subPackages/orderQy/list",
});
}, 2000);
} else {
uni.showToast({
title: res.msg,
@ -514,7 +706,6 @@
});
}
});
},
},
};
@ -740,7 +931,7 @@
.agent-section {
margin: 0 47rpx;
border-radius: 20rpx;
margin-bottom: 30rpx;
margin-bottom: 0rpx;
overflow: hidden;
display: flex;
align-items: center;
@ -800,45 +991,164 @@
/* 数字资产权益 */
.digital-assets {
margin: 0 30rpx 0rpx;
margin: 0 30rpx 30rpx;
}
.asset-header {
margin-bottom: 20rpx;
}
.asset-title {
font-size: 28rpx;
color: #000000;
font-weight: 500;
}
.asset-scroll-container {
}
.asset-scroll {
width: 100%;
white-space: nowrap;
overflow: hidden;
/* 微信小程序隐藏横向滚动条 */
&::-webkit-scrollbar {
display: none !important;
width: 0 !important;
height: 0 !important;
}
/* Firefox */
scrollbar-width: none;
/* IE和Edge */
-ms-overflow-style: none;
}
.asset-cards {
display: inline-flex;
gap: 20rpx;
padding: 30rpx 10rpx;
}
.asset-card {
width: 500rpx;
border-radius: 20rpx;
overflow: hidden;
box-shadow: 0 15rpx 12rpx rgba(0, 0, 0, 0.15);
transition: all 0.3s ease;
position: relative;
flex-shrink: 0;
}
.asset-bg {
padding: 40rpx 30rpx 30rpx;
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
.asset-card:active {
transform: scale(0.98);
box-shadow: 0 8rpx 30rpx rgba(0, 0, 0, 0.2);
}
.asset-card-wrapper {
position: relative;
width: 100%;
height: 300rpx;
overflow: hidden;
}
.asset-bg::before {
content: "";
.asset-img {
width: 100%;
height: 100%;
transition: transform 0.3s ease;
}
.asset-card:active .asset-img {
transform: scale(1.05);
}
.asset-overlay {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
bottom: 0;
background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><circle cx="85" cy="15" r="8" fill="rgba(255,255,255,0.1)"/><circle cx="15" cy="85" r="6" fill="rgba(255,255,255,0.08)"/><circle cx="70" cy="70" r="4" fill="rgba(255,255,255,0.06)"/></svg>');
pointer-events: none;
background: linear-gradient(transparent, rgba(0, 0, 0, 0.7));
padding: 40rpx 30rpx 30rpx;
color: white;
backdrop-filter: blur(10rpx);
border: 1rpx solid rgba(255, 255, 255, 0.1);
}
.asset-title {
font-size: 32rpx;
.asset-badge {
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
color: white;
font-weight: 600;
position: relative;
z-index: 1;
font-size: 20rpx;
padding: 6rpx 12rpx;
border-radius: 16rpx;
display: inline-block;
margin-bottom: 12rpx;
font-weight: 500;
box-shadow: 0 4rpx 12rpx rgba(102, 126, 234, 0.3);
}
.asset-name {
font-size: 28rpx;
font-weight: bold;
margin-bottom: 6rpx;
line-height: 1.3;
}
.asset-desc {
font-size: 22rpx;
color: rgba(255, 255, 255, 0.8);
margin-bottom: 16rpx;
line-height: 1.4;
}
.asset-action {
display: flex;
align-items: center;
justify-content: space-between;
background: rgba(255, 255, 255, 0.1);
border-radius: 20rpx;
padding: 10rpx 16rpx;
backdrop-filter: blur(10rpx);
border: 1rpx solid rgba(255, 255, 255, 0.2);
white-space: nowrap;
min-width: 0;
}
.action-text {
font-size: 24rpx;
font-weight: 500;
color: white;
flex-shrink: 0;
overflow: hidden;
text-overflow: ellipsis;
}
.action-arrow {
font-size: 26rpx;
font-weight: bold;
color: white;
transition: transform 0.3s ease;
flex-shrink: 0;
margin-left: 8rpx;
}
.asset-card:active .action-arrow {
transform: translateX(6rpx);
}
/* 原来的图片风格 */
.asset-card-old {
border-radius: 20rpx;
overflow: hidden;
margin-bottom: 20rpx;
}
/* 底部操作按钮 */
.asset-actions {
display: flex;
padding: 20rpx 0;
background: white;
border-radius: 20rpx;
font-size: 25rpx;
}

5
subPackages/orderQy/detail.vue

@ -618,10 +618,7 @@ export default {
//
viewDigitalAsset(goods) {
//
uni.showToast({
title: "查看数字资产",
icon: "none",
});
uni.navigateTo({
url: "/subPackages/memorialAlbum/detail?id=" + goods.childId,
});

Loading…
Cancel
Save