Browse Source

style样式优化

dev_des
1054425342@qq.com 3 months ago
parent
commit
6d233d6a8d
  1. 7
      components/ProductSection.vue
  2. 4
      components/WaterfallLayout.vue
  3. 1693
      pages/index/iSoul.vue
  4. 20
      pages/index/index.vue
  5. 2
      pages/login/login.vue
  6. 1335
      subPackages/equityGoods/detail.vue
  7. 31
      subPackages/equityGoods/list.vue
  8. 73
      uni_modules/uni-transition/components/uni-transition/uni-transition.vue

7
components/ProductSection.vue

@ -184,18 +184,18 @@ export default {
// //
.title-section { .title-section {
padding: 18rpx 24rpx; padding: 14rpx 24rpx 8rpx ;
margin: 40rpx 16rpx 0rpx; margin: 40rpx 16rpx 0rpx;
display: inline-block; display: inline-block;
border-radius: 14rpx 14rpx 0 0; border-radius: 14rpx 14rpx 0 0;
.title { .title {
font-size: 36rpx; font-size: 36rpx;
font-weight: bold; font-weight: 500;
color: #4d4d4d; color: #4d4d4d;
} }
.more-btn { .more-btn {
font-size: 18rpx; font-size: 20rpx;
color: #999999; color: #999999;
margin-left: 35rpx; margin-left: 35rpx;
} }
@ -295,6 +295,7 @@ export default {
// //
.card-content { .card-content {
padding: 24rpx 0; padding: 24rpx 0;
padding-bottom: 0;
} }
.title-price-heart { .title-price-heart {

4
components/WaterfallLayout.vue

@ -27,7 +27,7 @@
<text class="username">{{ item.user.name }}</text> <text class="username">{{ item.user.name }}</text>
</view> </view>
<view class="like-info"> <view class="like-info">
<text class="like-icon"></text> <image :src="showImg('/uploads/20250731/0260884d7a44a483885a026da524e0b8.png')" style="height: 22rpx;width: 25rpx;"></image>
<text class="like-count">{{ item.likes }}</text> <text class="like-count">{{ item.likes }}</text>
</view> </view>
</view> </view>
@ -61,7 +61,7 @@
<text class="username">{{ item.user.name }}</text> <text class="username">{{ item.user.name }}</text>
</view> </view>
<view class="like-info"> <view class="like-info">
<text class="like-icon"></text> <image :src="showImg('/uploads/20250731/0260884d7a44a483885a026da524e0b8.png')" style="height: 22rpx;width: 25rpx;"></image>
<text class="like-count">{{ item.likes }}</text> <text class="like-count">{{ item.likes }}</text>
</view> </view>
</view> </view>

1693
pages/index/iSoul.vue

File diff suppressed because it is too large

20
pages/index/index.vue

@ -18,8 +18,6 @@
:productList="productList" :productList="productList"
moreUrl="/subPackages/equityGoods/index" moreUrl="/subPackages/equityGoods/index"
detailUrlPrefix="/subPackages/equityGoods/detail" detailUrlPrefix="/subPackages/equityGoods/detail"
@more-click="goToMore"
@product-click="goToDetail"
@like-toggle="handleLikeToggle" @like-toggle="handleLikeToggle"
/> />
<ProductSection <ProductSection
@ -31,8 +29,6 @@
:productList="productListFeeling" :productList="productListFeeling"
moreUrl="/pages/index/sensoryStore" moreUrl="/pages/index/sensoryStore"
detailUrlPrefix="/subPackages/techan/detail" detailUrlPrefix="/subPackages/techan/detail"
@more-click="goToMore"
@product-click="goToDetail"
@like-toggle="handleLikeToggle" @like-toggle="handleLikeToggle"
isFeel isFeel
/> />
@ -115,6 +111,9 @@ export default {
}, },
onShow() { onShow() {
this.browse_record({ type: "page", title: "首页" }); this.browse_record({ type: "page", title: "首页" });
this.$nextTick(() =>{
this.$refs.dynamicIsland.getUserInfo();
})
}, },
onPageScroll(e) { onPageScroll(e) {
// ID // ID
@ -166,12 +165,7 @@ export default {
encodeURIComponent(JSON.stringify(item)), encodeURIComponent(JSON.stringify(item)),
}); });
}, },
//
goToDetail(item) {
uni.navigateTo({
url: "/subPackages/techan/detail?id=" + item.id,
});
},
// //
handleLikeToggle({ item, index }) { handleLikeToggle({ item, index }) {
this.productList[index] = item; this.productList[index] = item;
@ -201,7 +195,11 @@ export default {
}, },
}; };
</script> </script>
<style>
page{
}
</style>
<style lang="scss" scoped> <style lang="scss" scoped>
.bg { .bg {
min-height: 100vh; min-height: 100vh;

2
pages/login/login.vue

@ -331,7 +331,7 @@ export default {
// //
.btn-container { .btn-container {
margin-top: auto; // margin-top: auto;
} }
// //

1335
subPackages/equityGoods/detail.vue

File diff suppressed because it is too large

31
subPackages/equityGoods/list.vue

@ -2,6 +2,14 @@
<view class="equity-goods-page"> <view class="equity-goods-page">
<image style="width: 100%;" mode="widthFix" <image style="width: 100%;" mode="widthFix"
:src="showImg('/uploads/20250728/748adc244fc7db313f569a6005344950.png')"></image> :src="showImg('/uploads/20250728/748adc244fc7db313f569a6005344950.png')"></image>
<view class="location-selector" >
<text class="location-text">扬州</text>
<image
class="dropdown-icon"
src="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTIiIGhlaWdodD0iOCIgdmlld0JveD0iMCAwIDEyIDgiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik0xIDFMNiA2TDExIDEiIHN0cm9rZT0iIzk5OTk5OSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9zdmc+"
mode="heightFix"
></image>
</view>
<!-- 顶部标题区域 --> <!-- 顶部标题区域 -->
<view class="header-section"> <view class="header-section">
<view class="title">扬州数字资产权益产品</view> <view class="title">扬州数字资产权益产品</view>
@ -338,4 +346,27 @@
justify-content: space-between; justify-content: space-between;
margin-bottom: 10rpx; margin-bottom: 10rpx;
} }
.location-selector {
position: absolute;
top: 20rpx;
left: 20rpx;
display: flex;
align-items: center;
padding: 8rpx 16rpx;
// border: 2rpx solid #e0e0e0;
border-radius: 20rpx;
min-width: 100rpx;
margin-right: 20rpx;
.location-text {
font-size: 30rpx;
color: white;
margin-right: 8rpx;
}
.dropdown-icon {
width: 24rpx;
height: 16rpx;
}
}
</style> </style>

73
uni_modules/uni-transition/components/uni-transition/uni-transition.vue

@ -132,10 +132,10 @@ export default {
* @param {Object} obj * @param {Object} obj
*/ */
step(obj, config = {}) { step(obj, config = {}) {
if (!this.animation) return if (!this.animation) return this
for (let i in obj) { for (let i in obj) {
try { try {
if (typeof this.animation[i] === 'function') { if (this.animation && typeof this.animation[i] === 'function') {
if(typeof obj[i] === 'object'){ if(typeof obj[i] === 'object'){
this.animation[i](...obj[i]) this.animation[i](...obj[i])
}else{ }else{
@ -143,11 +143,15 @@ export default {
} }
} }
} catch (e) { } catch (e) {
console.error(`方法 ${i} 不存在`) console.error(`方法 ${i} 不存在:`, e)
} }
} }
if (this.animation && typeof this.animation.step === 'function') { try {
this.animation.step(config) if (this.animation && typeof this.animation.step === 'function') {
this.animation.step(config)
}
} catch (e) {
console.error('动画step执行错误:', e)
} }
return this return this
}, },
@ -156,8 +160,12 @@ export default {
*/ */
run(fn) { run(fn) {
if (!this.animation) return if (!this.animation) return
if (typeof this.animation.run === 'function') { try {
this.animation.run(fn) if (this.animation && typeof this.animation.run === 'function') {
this.animation.run(fn)
}
} catch (e) {
console.error('动画执行错误:', e)
} }
}, },
// //
@ -174,12 +182,19 @@ export default {
this.$nextTick(() => { this.$nextTick(() => {
// TODO // TODO
this.timer = setTimeout(() => { this.timer = setTimeout(() => {
this.animation = createAnimation(this.config, this) try {
if (this.animation) { this.animation = createAnimation(this.config, this)
this.tranfromInit(false).step() if (this.animation) {
if (typeof this.animation.run === 'function') { let result = this.tranfromInit(false)
this.animation.run() if (result && typeof result.step === 'function') {
result.step()
if (typeof result.run === 'function') {
result.run()
}
}
} }
} catch (e) {
console.error('动画初始化错误:', e)
} }
this.$emit('change', { this.$emit('change', {
detail: this.isShow detail: this.isShow
@ -190,19 +205,27 @@ export default {
// //
close(type) { close(type) {
if (!this.animation) return if (!this.animation) return
this.tranfromInit(true) try {
.step() let result = this.tranfromInit(true)
.run(() => { if (result && typeof result.step === 'function') {
this.isShow = false result.step()
this.animationData = null if (typeof result.run === 'function') {
this.animation = null result.run(() => {
let { opacity, transform } = this.styleInit(false) this.isShow = false
this.opacity = opacity || 1 this.animationData = null
this.transform = transform this.animation = null
this.$emit('change', { let { opacity, transform } = this.styleInit(false)
detail: this.isShow this.opacity = opacity || 1
}) this.transform = transform
}) this.$emit('change', {
detail: this.isShow
})
})
}
}
} catch (e) {
console.error('动画关闭错误:', e)
}
}, },
// //
styleInit(type) { styleInit(type) {

Loading…
Cancel
Save