Browse Source

轮播图预览

master
congzc 1 year ago
parent
commit
8db4a327d2
8 changed files with 96 additions and 98 deletions
  1. +1
    -1
      package.json
  2. +6
    -20
      src/pages/closeStyle/goCreatePhoto.vue
  3. +6
    -20
      src/pages/closeStyle/multiplayer.vue
  4. +47
    -39
      src/pages/lookPhoto/index.vue
  5. +8
    -6
      src/store/index.js
  6. +3
    -2
      src/store/modules/userInfo.js
  7. +6
    -6
      src/utils/request.js
  8. +19
    -4
      yarn.lock

+ 1
- 1
package.json View File

@@ -56,7 +56,6 @@
"dayjs": "^1.11.9",
"js-audio-recorder": "^1.0.7",
"pinia": "2.0.33",
"pinia-plugin-persistedstate": "^3.2.0",
"uview-plus": "^3.1.34",
"vue": "^3.2.45",
"vue-i18n": "^9.1.9"
@@ -67,6 +66,7 @@
"@dcloudio/uni-cli-shared": "3.0.0-3081220230817001",
"@dcloudio/uni-stacktracey": "3.0.0-3081220230817001",
"@dcloudio/vite-plugin-uni": "3.0.0-3081220230817001",
"pinia-plugin-unistorage": "^0.0.17",
"sass": "^1.64.2",
"sass-loader": "13.2.2",
"vite": "4.1.4"


+ 6
- 20
src/pages/closeStyle/goCreatePhoto.vue View File

@@ -11,7 +11,6 @@
<view class="orangeBtn" @click="createing(styleData.id)"
>开始制作写真
<view class="free">
<image src="../../assets/icon/blackBG.png" mode="aspectFit" />
<text>耗金币{{ needCoin }}枚</text>
</view>
</view>
@@ -142,25 +141,12 @@ async function createing(id) {
right: -70rpx;
width: 142rpx;
height: 50rpx;
image {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 1;
}
text {
position: absolute;
top: 0rpx;
left: 0;
line-height: 49rpx;
width: 100%;
height: 100%;
font-size: 22rpx;
font-weight: 900;
z-index: 2;
}
background-color: #000;
border-radius: 25rpx 25rpx 25rpx 0;
font-size: 22rpx;
font-weight: 900;
line-height: 50rpx;
text-align: center;
}
}
.balance {


+ 6
- 20
src/pages/closeStyle/multiplayer.vue View File

@@ -31,7 +31,6 @@
<view class="orangeBtn" @click="createing(styleData.id)"
>开始制作写真
<view class="free">
<image src="../../assets/icon/blackBG.png" mode="aspectFit" />
<text>耗金币2枚</text>
</view>
</view>
@@ -174,25 +173,12 @@ async function createing(id) {
right: -70rpx;
width: 142rpx;
height: 50rpx;
image {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 1;
}
text {
position: absolute;
top: 0rpx;
left: 0;
line-height: 49rpx;
width: 100%;
height: 100%;
font-size: 22rpx;
font-weight: 900;
z-index: 2;
}
background-color: #000;
border-radius: 25rpx 25rpx 25rpx 0;
font-size: 22rpx;
font-weight: 900;
line-height: 50rpx;
text-align: center;
}
}
.balance {


+ 47
- 39
src/pages/lookPhoto/index.vue View File

@@ -9,12 +9,11 @@
:list="swiperList"
keyName="image"
@change="getSwiperIndex"
@click="click"
@click="previewImage"
></u-swiper>
<view class="uploadBtn grayBtn">
<text>我要让照片说话</text>
<view class="free">
<image src="../../assets/icon/blackBG.png" mode="aspectFit" />
<text>耗金币2枚</text>
</view>
</view>
@@ -24,7 +23,6 @@
<!-- 底部 -->
<view class="bottomBox">
<view class="tips">
<image src="../../assets/icon/blackBG.png" mode="" />
<text>邀请匿名好友可获得2枚金币</text>
</view>
<view class="shareBtn" @click="share">分享</view>
@@ -80,11 +78,16 @@ onLoad((options) => {
workId.value = options.id;
getSwiperList();
});
const swiperList = ref([]);
const swiperList = ref([]); //轮播图
const previewImageList = ref([]); //预览图片列表
async function getSwiperList() {
const res = await getPhotoListApi(workId.value);
console.log(res.data.photoList);
swiperList.value = res.data.photoList;
swiperList.value.forEach((item) => {
previewImageList.value.push(item.image);
});
}
//#endregion ---------------------
@@ -157,6 +160,16 @@ function downloadImg() {
}
//#endregion ---------------------
//#region
function previewImage(index) {
uni.previewImage({
current: index, //预览图片的下标
urls: previewImageList.value, //预览图片的地址,必须要数组形式,如果不是数组形式就转换成数组形式就可以
loop: true,
});
}
//#endregion ---------------------
//#region 分享
function share() {
uni.share({
@@ -264,25 +277,31 @@ function buyCoin() {
right: -70rpx;
width: 142rpx;
height: 50rpx;
image {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 1;
}
text {
position: absolute;
top: 0rpx;
left: 0;
line-height: 49rpx;
width: 100%;
height: 100%;
font-size: 22rpx;
font-weight: 900;
z-index: 2;
}
background-color: #000;
border-radius: 25rpx 25rpx 25rpx 0;
font-size: 22rpx;
font-weight: 900;
line-height: 50rpx;
text-align: center;
// image {
// position: absolute;
// top: 0;
// left: 0;
// width: 100%;
// height: 100%;
// z-index: 1;
// }
// text {
// position: absolute;
// top: 0rpx;
// left: 0;
// line-height: 49rpx;
// width: 100%;
// height: 100%;
// font-size: 22rpx;
// font-weight: 900;
// z-index: 2;
// }
}
}
.grayBtn {
@@ -300,27 +319,16 @@ function buyCoin() {
padding: 65rpx 50rpx 0;
.tips {
position: absolute;
top: 0;
top: 0rpx;
right: 60rpx;
width: 313rpx;
height: 50rpx;
background-color: #000;
border-radius: 25rpx 25rpx 25rpx 0;
font-size: 22rpx;
font-weight: 900;
line-height: 50rpx;
text-align: center;
z-index: 2;
image {
position: absolute;
top: 0;
width: 313rpx;
height: 50rpx;
z-index: -2;
}
text {
display: inline-block;
width: 313rpx;
height: 50rpx;
font-size: 22rpx;
z-index: 3;
}
}
.shareBtn {
width: 200rpx;


+ 8
- 6
src/store/index.js View File

@@ -1,7 +1,9 @@
import { createPinia } from 'pinia'
import piniaPluginPersistedstate from 'pinia-plugin-persistedstate'
import { findImageApi, findGlodApi } from "../api/home"
// import { createPinia } from 'pinia'
import * as Pinia from 'pinia'
import { createUnistorage } from 'pinia-plugin-unistorage'
const store = createPinia();
store.use(piniaPluginPersistedstate)
export { store };
// const store = createPinia();
const store = Pinia.createPinia()
store.use(createUnistorage())
export { store, Pinia };

+ 3
- 2
src/store/modules/userInfo.js View File

@@ -43,5 +43,6 @@ export const userInfoModules = defineStore("userInfoStore", () => {
return { userInfo, openId, token, myAvatar, myGlod, platForm, hostSystem };
},
{
persist: true,
});
unistorage: true,
}
);

+ 6
- 6
src/utils/request.js View File

@@ -19,12 +19,12 @@ const request = (requestObj) => {
},
success: (res) => {
if (res.data.code == 1052) {
uni.reLaunch({
url: "/pages/login/index?type=tokenFfalse",
});
return
}
// if (res.data.code == 1052) {
// uni.reLaunch({
// url: "/pages/login/index?type=tokenFfalse",
// });
// return
// }
if (res.statusCode == 200) {
// if (res.data.code == 200) {
resolve(res.data)


+ 19
- 4
yarn.lock View File

@@ -3524,10 +3524,12 @@ pify@^2.3.0:
resolved "https://registry.npmmirror.com/pify/-/pify-2.3.0.tgz#ed141a6ac043a849ea588498e7dca8b15330e90c"
integrity sha512-udgsAY+fTnvv7kI7aaxbqwWNb0AHiB0qBO89PZKPkoTmGOgdbrHDKD+0B2X4uTfJ/FT1R09r9gTsjUjNJotuog==
pinia-plugin-persistedstate@^3.2.0:
version "3.2.0"
resolved "https://registry.npmmirror.com/pinia-plugin-persistedstate/-/pinia-plugin-persistedstate-3.2.0.tgz#9932ca2ae88aa6c0d6763bebc6447d7bd1f097d0"
integrity sha512-tZbNGf2vjAQcIm7alK40sE51Qu/m9oWr+rEgNm/2AWr1huFxj72CjvpQcIQzMknDBJEkQznCLAGtJTIcLKrKdw==
pinia-plugin-unistorage@^0.0.17:
version "0.0.17"
resolved "https://registry.yarnpkg.com/pinia-plugin-unistorage/-/pinia-plugin-unistorage-0.0.17.tgz#b237d1146069c400b5b81ac5dac0467e3d07db68"
integrity sha512-Oo4KTWyZP+7/fRRGG5ACoFIBZznEgFt8SPSOcg99t5NHzFP1wSTAfgl25eRr7Tv11pkWyzgZSa3oMGVIBBs1MA==
dependencies:
pinia "^2.0.33"
pinia@2.0.33:
version "2.0.33"
@@ -3537,6 +3539,14 @@ pinia@2.0.33:
"@vue/devtools-api" "^6.5.0"
vue-demi "*"
pinia@^2.0.33:
version "2.1.6"
resolved "https://registry.yarnpkg.com/pinia/-/pinia-2.1.6.tgz#e88959f14b61c4debd9c42d0c9944e2875cbe0fa"
integrity sha512-bIU6QuE5qZviMmct5XwCesXelb5VavdOWKWaB17ggk++NUwQWWbP5YnsONTk3b752QkW9sACiR81rorpeOMSvQ==
dependencies:
"@vue/devtools-api" "^6.5.0"
vue-demi ">=0.14.5"
pixelmatch@^4.0.2:
version "4.0.2"
resolved "https://registry.npmmirror.com/pixelmatch/-/pixelmatch-4.0.2.tgz#8f47dcec5011b477b67db03c243bc1f3085e8854"
@@ -4085,6 +4095,11 @@ vue-demi@*:
resolved "https://registry.npmmirror.com/vue-demi/-/vue-demi-0.14.5.tgz#676d0463d1a1266d5ab5cba932e043d8f5f2fbd9"
integrity sha512-o9NUVpl/YlsGJ7t+xuqJKx8EBGf1quRhCiT6D/J0pfwmk9zUwYkC7yrF4SZCe6fETvSM3UNL2edcbYrSyc4QHA==
vue-demi@>=0.14.5:
version "0.14.6"
resolved "https://registry.yarnpkg.com/vue-demi/-/vue-demi-0.14.6.tgz#dc706582851dc1cdc17a0054f4fec2eb6df74c92"
integrity sha512-8QA7wrYSHKaYgUxDA5ZC24w+eHm3sYCbp0EzcDwKqN3p6HqtTCGR/GVsPyZW92unff4UlcSh++lmqDWN3ZIq4w==
vue-i18n@^9.1.9:
version "9.2.2"
resolved "https://registry.npmmirror.com/vue-i18n/-/vue-i18n-9.2.2.tgz#aeb49d9424923c77e0d6441e3f21dafcecd0e666"


Loading…
Cancel
Save