438 lines
11 KiB
Vue
438 lines
11 KiB
Vue
|
<template>
|
|||
|
|
<view class="my">
|
|||
|
|
<image src="https://v2.api-m.com/api/wallpaper?return=302" mode="aspectFill" class="my_bg"></image>
|
|||
|
|
<view class="header_cell">
|
|||
|
|
<view style="margin-top: 40rpx;" class="user_info">
|
|||
|
|
<view class="flex justify-center align-center">
|
|||
|
|
<image src="https://v2.api-m.com/api/head?return=302" mode="aspectFill" class="user_photo"></image>
|
|||
|
|
<view>
|
|||
|
|
<view class="text-black text-bold">
|
|||
|
|
<text class="text-xl" style="font-weight: bold;">微信用户</text>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
</view>
|
|||
|
|
<view style="margin-top: 90rpx;border-radius: 26rpx;" class="vip_cell flex justify-between align-center">
|
|||
|
|
<view>
|
|||
|
|
<view class="text-xl" style="font-weight: bold;color: rgb(241, 198, 142);">
|
|||
|
|
邀请朋友一起来搜索吧 !
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<button open-type="share" class="cu-btn round invate_btn">邀 请</button>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="cell_2 flex align-center mt30">
|
|||
|
|
<button @click="guanzhu(1)" class="kefu">
|
|||
|
|
<text style="color: #1382ff;font-size: 60rpx;" class=" cuIcon-appreciatefill"></text>
|
|||
|
|
<text style="display: block;margin-top: -60rpx;margin-bottom: 15rpx;font-size: 30rpx;">关于我们</text>
|
|||
|
|
</button>
|
|||
|
|
<!-- #ifdef H5 -->
|
|||
|
|
<button @click="imgShow(2)" class="kefu">
|
|||
|
|
<text style="color: #1382ff;font-size: 60rpx;" class=" cuIcon-servicefill"></text>
|
|||
|
|
<text style="display: block;margin-top: -60rpx;margin-bottom: 15rpx;font-size: 30rpx;">联系我们</text>
|
|||
|
|
</button>
|
|||
|
|
<!-- #endif -->
|
|||
|
|
<!-- #ifndef H5 -->
|
|||
|
|
<button open-type="contact" class="kefu">
|
|||
|
|
<text style="color: #1382ff;font-size: 60rpx;" class=" cuIcon-servicefill"></text>
|
|||
|
|
<text style="display: block;margin-top: -60rpx;margin-bottom: 15rpx;font-size: 30rpx;">联系我们</text>
|
|||
|
|
</button>
|
|||
|
|
<!-- #endif -->
|
|||
|
|
|
|||
|
|
</view>
|
|||
|
|
<!-- <view style="width: 100%; margin-top: 30rpx;">
|
|||
|
|
<ad-custom unit-id="adunit-ff28399b17818338" ad-intervals="30" ></ad-custom>
|
|||
|
|
</view> -->
|
|||
|
|
<view class="mt30 grid text-center col-4 bg-white"
|
|||
|
|
style="padding: 30rpx 0; border-radius: 15rpx;row-gap: 30rpx;">
|
|||
|
|
<!-- #ifdef H5 -->
|
|||
|
|
<view @click="modeImgShow(1)">
|
|||
|
|
<!-- #endif -->
|
|||
|
|
<!-- #ifndef H5 -->
|
|||
|
|
<view @click="myBlog()">
|
|||
|
|
<!-- #endif -->
|
|||
|
|
<view class="cell_3_icon flex justify-center align-center"><text
|
|||
|
|
class="text-olive cuIcon-choiceness"></text></view>
|
|||
|
|
<view>我的博客</view>
|
|||
|
|
</view>
|
|||
|
|
<!-- #ifdef H5 -->
|
|||
|
|
<view @click="modeImgShow(2)">
|
|||
|
|
<!-- #endif -->
|
|||
|
|
<!-- #ifndef H5 -->
|
|||
|
|
<view @click="shuiyin()">
|
|||
|
|
<!-- #endif -->
|
|||
|
|
<view class="cell_3_icon flex justify-center align-center"><text
|
|||
|
|
class="text-cyan cuIcon-selection"></text></view>
|
|||
|
|
<view>水印去除</view>
|
|||
|
|
</view>
|
|||
|
|
<!-- <view @click="imgShow(1)">
|
|||
|
|
<view class="cell_3_icon flex justify-center align-center"><text class="text-cyan cuIcon-copy"></text>
|
|||
|
|
</view>
|
|||
|
|
<view>最新动态</view>
|
|||
|
|
</view> -->
|
|||
|
|
<view @click="mzModalShow()">
|
|||
|
|
<view class="cell_3_icon flex justify-center align-center"><text
|
|||
|
|
class="text-olive cuIcon-creative"></text></view>
|
|||
|
|
<view>免责声明</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<!-- 功能列表 -->
|
|||
|
|
<view class="metergasis">
|
|||
|
|
<!-- #ifdef H5 -->
|
|||
|
|
<view style="line-height: 60rpx;width: 90%;height: 150rpx;background-color: #fff;color: #666666;margin: 20rpx;text-align: center;">
|
|||
|
|
<!-- #endif -->
|
|||
|
|
<!-- #ifndef H5 -->
|
|||
|
|
<view style="width: 90%;height: 300rpx;background-color: #fff;color: #666666;margin: 20rpx;text-align: center;">
|
|||
|
|
<!-- #endif -->
|
|||
|
|
求资源的，搜索不到的，点击下面，反馈客服 !
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<button @click="guanzhu(1)" class="select">
|
|||
|
|
反馈客服
|
|||
|
|
</button>
|
|||
|
|
<!--免责声明弹窗-->
|
|||
|
|
<view class="cu-modal" :class="modalName=='mzModal'?'show':''">
|
|||
|
|
<view style="border-radius: 30rpx;" class="cu-dialog">
|
|||
|
|
<view class="cu-bar bg-white justify-end">
|
|||
|
|
<view style="color: black;font-size: 38rpx;margin-top: 50rpx;" class="content">声明</view>
|
|||
|
|
</view>
|
|||
|
|
<view class=" bg-white">
|
|||
|
|
<view style="font-size: 33rpx;color: #6a6a6a;padding: 40rpx 60rpx 60rpx 60rpx;">
|
|||
|
|
创作者上传至《南音资源库》小程序的素材内容由创作者负责，部分来源于网络和他处购买如有侵权，请在界面中的联系我们进行删除处理 !
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<button @tap="hideModal" style="margin-bottom: 50rpx;width: 55%;height: 90rpx;font-size: 38rpx;"
|
|||
|
|
class="cu-btn bg-green">确认</button>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<!--弹窗-->
|
|||
|
|
<view class="cu-modal" :class="modalName=='imgModal'?'show':''">
|
|||
|
|
<view style="border-radius: 30rpx; background-color: white;" class="cu-dialog">
|
|||
|
|
<view class="cu-bar bg-white justify-end">
|
|||
|
|
<view style="color: black;font-size: 38rpx;margin-top: 40rpx;" class="content">{{modelTip}}</view>
|
|||
|
|
<view class="action" @tap="modalName = null">
|
|||
|
|
<text class="cuIcon-close text-red"></text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class=" bg-white">
|
|||
|
|
<image style="width: 75%;margin-top: 20rpx;" mode="widthFix" show-menu-by-longpress="true"
|
|||
|
|
:src="modelSrc"></image>
|
|||
|
|
<view class="tipinfo">Tip：长按图片识别 / 保存</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
import {
|
|||
|
|
|
|||
|
|
} from "@/api/app/index.js"
|
|||
|
|
let videoAd = null;
|
|||
|
|
export default {
|
|||
|
|
data() {
|
|||
|
|
return {
|
|||
|
|
modalName: null,
|
|||
|
|
modelTip: "",
|
|||
|
|
modelSrc: ""
|
|||
|
|
};
|
|||
|
|
},
|
|||
|
|
onShareAppMessage() {
|
|||
|
|
return {
|
|||
|
|
title: "南音资源库,有你想要的 !",
|
|||
|
|
imageUrl: "https://img.yidaima.cn/dj-share.png",
|
|||
|
|
path: 'pages/index',
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
onShareTimeline(){
|
|||
|
|
return {
|
|||
|
|
title: "南音资源库,有你想要的 !",
|
|||
|
|
query:{
|
|||
|
|
},
|
|||
|
|
imageUrl:'https://img.yidaima.cn/dj-share.png'
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
onShow() {
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
onLoad() {
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
methods: {
|
|||
|
|
imgShow(type) {
|
|||
|
|
this.$tab.navigateTo('/pages/mine/imgShow?type='+type)
|
|||
|
|
},
|
|||
|
|
modeImgShow(val){
|
|||
|
|
if(val == 1){
|
|||
|
|
this.modelTip="我的博客"
|
|||
|
|
this.modelSrc="http://imgs.emoboy.vip/appimg/%E5%B0%8F%E7%A8%8B%E5%BA%8F%E7%A0%81.jpg"
|
|||
|
|
}else{
|
|||
|
|
this.modelTip="去水印"
|
|||
|
|
this.modelSrc="http://imgs.emoboy.vip/appimg/%E6%B0%B4%E5%8D%B0.jpg"
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
this.modalName = 'imgModal'
|
|||
|
|
},
|
|||
|
|
shuiyin() {
|
|||
|
|
uni.navigateToMiniProgram({
|
|||
|
|
appId: 'wx17b46f75e762c184',
|
|||
|
|
path: 'pages/tool/shuiyin', //需要打开的目标路径
|
|||
|
|
extraData: {
|
|||
|
|
},
|
|||
|
|
envVersion: 'release', //小程序版本：develop（开发版），trial（体验版），release（正式版）
|
|||
|
|
success(res) {
|
|||
|
|
// 打开成功
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
myBlog(){
|
|||
|
|
uni.navigateToMiniProgram({
|
|||
|
|
appId: 'wx17b46f75e762c184',
|
|||
|
|
path: '', //需要打开的目标路径
|
|||
|
|
extraData: {
|
|||
|
|
},
|
|||
|
|
envVersion: 'release', //小程序版本：develop（开发版），trial（体验版），release（正式版）
|
|||
|
|
success(res) {
|
|||
|
|
// 打开成功
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
copy(){
|
|||
|
|
uni.showToast({
|
|||
|
|
title: '敬请期待',
|
|||
|
|
//将值设置为 success 或者直接不用写icon这个参数 error none
|
|||
|
|
icon: 'none',
|
|||
|
|
//显示持续时间为 2秒
|
|||
|
|
duration: 2000
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
mzModalShow() {
|
|||
|
|
this.modalName = "mzModal"
|
|||
|
|
},
|
|||
|
|
hideModal() {
|
|||
|
|
this.modalName = null
|
|||
|
|
},
|
|||
|
|
guanzhu(type) {
|
|||
|
|
this.$tab.navigateTo('/pages/mine/guanzhu?type=' + type)
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
};
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style lang="less" scoped>
|
|||
|
|
.tipinfo {
|
|||
|
|
width: 60%;
|
|||
|
|
height: 80rpx;
|
|||
|
|
border-radius: 60rpx;
|
|||
|
|
text-align: center;
|
|||
|
|
/* border: 3rpx solid #ae67d6; */
|
|||
|
|
margin-left: 20%;
|
|||
|
|
line-height: 80rpx;
|
|||
|
|
margin-bottom: 40rpx;
|
|||
|
|
color: #ae67d6;
|
|||
|
|
font-size: 30rpx;
|
|||
|
|
font-weight: 600;
|
|||
|
|
}
|
|||
|
|
.select {
|
|||
|
|
width: 60%;
|
|||
|
|
margin-left: 20%;
|
|||
|
|
height: 100rpx;
|
|||
|
|
line-height: 100rpx;
|
|||
|
|
text-align: center;
|
|||
|
|
background-color: #78B7E0;
|
|||
|
|
color: white;
|
|||
|
|
border-radius: 15rpx;
|
|||
|
|
font-size: 35rpx;
|
|||
|
|
font-weight: 600;
|
|||
|
|
margin-top: 40rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.kefu {
|
|||
|
|
width: 49%;
|
|||
|
|
background-color: white;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* 列表没有数据 */
|
|||
|
|
.no-list-data {
|
|||
|
|
text-align: center;
|
|||
|
|
margin-bottom: 100rpx;
|
|||
|
|
color: #b3b3b3;
|
|||
|
|
font-size: 24upx;
|
|||
|
|
margin: 40rpx 40rpx 0rpx 40rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.no-list-data2 {
|
|||
|
|
text-align: center;
|
|||
|
|
margin-bottom: 100rpx;
|
|||
|
|
color: #b3b3b3;
|
|||
|
|
font-size: 24upx;
|
|||
|
|
margin: 10rpx 40rpx 40rpx 40rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
button::after {
|
|||
|
|
border: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.blogui-img {
|
|||
|
|
height: 100%;
|
|||
|
|
width: 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* 功能列表 */
|
|||
|
|
.metergasis-li-rgth {
|
|||
|
|
width: 50upx;
|
|||
|
|
height: 50upx;
|
|||
|
|
overflow: hidden;
|
|||
|
|
flex-shrink: 0;
|
|||
|
|
position: absolute;
|
|||
|
|
right: 0upx;
|
|||
|
|
top: 50%;
|
|||
|
|
transform: translate(0%, -50%);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.metergasis-li-h {
|
|||
|
|
grid-row: 1;
|
|||
|
|
margin-left: 30upx;
|
|||
|
|
font-size: 30upx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.metergasis-li-h2 {
|
|||
|
|
grid-row: 1;
|
|||
|
|
margin-left: 30upx;
|
|||
|
|
font-size: 25upx;
|
|||
|
|
color: #ADADAD;
|
|||
|
|
margin-left: auto;
|
|||
|
|
margin-right: 10rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.metergasis-li-img {
|
|||
|
|
height: 52upx;
|
|||
|
|
width: 52upx;
|
|||
|
|
border-radius: 100upx;
|
|||
|
|
flex-shrink: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.metergasis-li {
|
|||
|
|
padding: 24upx 32upx;
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: flex-start;
|
|||
|
|
align-items: center;
|
|||
|
|
position: relative;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.metergasis {
|
|||
|
|
background-color: #FFFFFF;
|
|||
|
|
border-radius: 16upx;
|
|||
|
|
margin: 2upx 0upx;
|
|||
|
|
padding: 2upx;
|
|||
|
|
margin-top: 30rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.my {
|
|||
|
|
padding: 30rpx;
|
|||
|
|
|
|||
|
|
.mt30 {
|
|||
|
|
margin-top: 30rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.my_bg {
|
|||
|
|
position: absolute;
|
|||
|
|
left: 0;
|
|||
|
|
top: 0;
|
|||
|
|
z-index: -1;
|
|||
|
|
width: 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.header_cell {
|
|||
|
|
margin-top: 100rpx;
|
|||
|
|
|
|||
|
|
.user_info {
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
align-items: center;
|
|||
|
|
|
|||
|
|
.user_photo {
|
|||
|
|
width: 120rpx;
|
|||
|
|
height: 120rpx;
|
|||
|
|
box-shadow: 0px 0px 10rpx 1px rgba(0, 0, 0, 0.1);
|
|||
|
|
border-radius: 50%;
|
|||
|
|
background-color: white;
|
|||
|
|
margin-right: 20rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.auth_btn {
|
|||
|
|
margin: 50rpx auto;
|
|||
|
|
text-align: center;
|
|||
|
|
|
|||
|
|
&>button {
|
|||
|
|
box-shadow: 3px 3px 10rpx 1px rgba(0, 0, 0, 0.2);
|
|||
|
|
padding-left: 50rpx;
|
|||
|
|
padding-right: 50rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.vip_cell {
|
|||
|
|
margin-top: 40rpx;
|
|||
|
|
width: 690rpx;
|
|||
|
|
height: 150rpx;
|
|||
|
|
background-image: url('https://img.yidaima.cn/feast/bolang.gif');
|
|||
|
|
background-size: 100% 100%;
|
|||
|
|
color: white;
|
|||
|
|
padding: 0 30rpx;
|
|||
|
|
|
|||
|
|
.invate_btn {
|
|||
|
|
background-color: rgb(241, 198, 142);
|
|||
|
|
box-shadow: 3px 3px 10rpx 1px rgba(241, 198, 142, 0.5);
|
|||
|
|
width: 150rpx;
|
|||
|
|
color: rgb(99, 71, 56);
|
|||
|
|
font-weight: bold;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.cell_1_icon {
|
|||
|
|
width: 100rpx;
|
|||
|
|
height: 100rpx;
|
|||
|
|
background-color: #f4f2f7;
|
|||
|
|
border-radius: 50%;
|
|||
|
|
font-size: 50rpx;
|
|||
|
|
margin: 0 auto;
|
|||
|
|
margin-bottom: 15rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.cell_2 {
|
|||
|
|
&>view {
|
|||
|
|
background-color: white;
|
|||
|
|
border-radius: 15rpx;
|
|||
|
|
text-align: center;
|
|||
|
|
width: 48%;
|
|||
|
|
padding: 30rpx 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.cell_2_icon {
|
|||
|
|
font-size: 60rpx;
|
|||
|
|
margin-bottom: 15rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.cell_3_icon {
|
|||
|
|
font-size: 50rpx;
|
|||
|
|
margin-bottom: 20rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.cell_4 {
|
|||
|
|
|
|||
|
|
&>view,
|
|||
|
|
navigator {
|
|||
|
|
padding: 20rpx 0;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</style>
|