wangmingchuan
/
yanzong_qianduan
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

细节

Browse Source
pifa
fanfan 3 weeks ago
parent 050ef466d4
commit a87f96323a
4 changed files with 170 additions and 109 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 2
      ext.json
  2. 2
      manifest.json
  3. 193
      pages/squareDynamic/index.vue
  4. 2
      project.config.json

2
ext.json
Unescape View File

@ -1,6 +1,6 @@
{ {
"extEnable": true, "extEnable": true,
"extAppid": "wx8dc1c2620cfd953a", "extAppid": "wx3f1dcf2e2ac45e7c",
"ext": { "ext": {
"store_id": 10048 "store_id": 10048
} }

2
manifest.json
Unescape View File

@ -92,7 +92,7 @@
"quickapp" : {}, "quickapp" : {},
/* 小程序特有相关 */ /* 小程序特有相关 */
"mp-weixin" : { "mp-weixin" : {
"appid" : "wx8dc1c2620cfd953a", "appid" : "wx3f1dcf2e2ac45e7c",
"libVersion" : "latest", "libVersion" : "latest",
"setting" : { "setting" : {
// 是否检查安全域名和 TLS 版本 // 是否检查安全域名和 TLS 版本

193
pages/squareDynamic/index.vue
Unescape View File

@ -5,27 +5,34 @@
</view> </view>
<view class="box"> <view class="box">
<view class="tab-list"> <view class="tab-list">
<view v-for="(item, index) in tabList" :key="index" class="tab-item" :class="{ 'active': activeTab === item }" @click="activeTab = item">{{ item }}</view> <view v-for="(item, index) in tabList" :key="index" class="tab-item"
:class="{ 'active': activeTab === item }" @click="activeTab = item">{{ item }}</view>
</view> </view>
<view class="list"> <view class="list">
<view v-for="(item, index) in dynamicList" :key="index" class="dynamic-item" :style="{ 'visibility': !item.contH ? 'hidden' : 'visible'}"> <view v-for="(item, index) in dynamicList" :key="index" class="dynamic-item"
:style="{ 'visibility': !item.contH ? 'hidden' : 'visible'}">
<view class="user"> <view class="user">
<image v-if="item.avatar_url && item.avatar_url[0]" :src="item.avatar_url[0].external_url" mode="aspectFill"></image> <image v-if="item.avatar_url && item.avatar_url[0]" :src="item.avatar_url[0].external_url"
mode="aspectFill"></image>
<image v-else src="/static/touxiang.png" mode="aspectFill"></image> <image v-else src="/static/touxiang.png" mode="aspectFill"></image>
<view class="user-info"> <view class="user-info">
<view class="name">{{ item.real_name }}</view> <view class="name">{{ item.real_name }}</view>
<view class="time">{{ item.update_time }}</view> <view class="time">{{ item.update_time }}</view>
</view> </view>
</view> </view>
<view class="cont" :class="[`cont${index}`, { 'close': item.contH > 120 && !showFullCont.includes(index)}]"> <view class="cont"
:class="[`cont${index}`, { 'close': item.contH > 120 && !showFullCont.includes(index)}]">
{{ item.content }} {{ item.content }}
</view> </view>
<view v-if="item.contH > 120" class="show-more" @click="toggleFullCont(index)">{{ showFullCont.includes(index) ? '收起' : '全文' }}</view> <view v-if="item.contH > 120" class="show-more" @click="toggleFullCont(index)">
{{ showFullCont.includes(index) ? '收起' : '全文' }}</view>
<view v-if="item.imgs && item.imgs.length > 0" class="pic-list"> <view v-if="item.imgs && item.imgs.length > 0" class="pic-list">
<image v-for="(pic, k) in item.imgs" :key="k" :src="pic.external_url" mode="aspectFill" @click="previewImages(k, item.imgs)"></image> <image v-for="(pic, k) in item.imgs" :key="k" :src="pic.external_url" mode="aspectFill"
@click="previewImages(k, item.imgs)"></image>
</view> </view>
<view v-if="item.files && item.files.length > 0" class="file-list"> <view v-if="item.files && item.files.length > 0" class="file-list">
<view v-for="(file, index) in item.files" :key="index" class="file-box" @click="previewFile(file.external_url)"> <view v-for="(file, index) in item.files" :key="index" class="file-box"
@click="previewFile(file.external_url)">
<image src="/static/xls.jpeg" mode="aspectFill"></image> <image src="/static/xls.jpeg" mode="aspectFill"></image>
<text>{{ solveFileName(file.file_name) }}</text> <text>{{ solveFileName(file.file_name) }}</text>
</view> </view>
@ -51,7 +58,8 @@
<image src="/static/trash.png" mode="aspectFill"></image> <image src="/static/trash.png" mode="aspectFill"></image>
<view>删除文案</view> <view>删除文案</view>
</view> </view>
<view class="btn" v-if="item.imgs && item.imgs.length > 0" @click="downloadMultipleImages(item.imgs)"> <view class="btn" v-if="item.imgs && item.imgs.length > 0"
@click="downloadMultipleImages(item.imgs)">
<image src="/static/download.png" mode="aspectFill"></image> <image src="/static/download.png" mode="aspectFill"></image>
<view>下载图片</view> <view>下载图片</view>
</view> </view>
@ -68,20 +76,15 @@
<image mode="aspectFill" src="@/static/empty.png" alt="暂无动态" /> <image mode="aspectFill" src="@/static/empty.png" alt="暂无动态" />
<view>暂无动态</view> <view>暂无动态</view>
</view> </view>
<view <view v-if="userInfo.user_type == 40" id="publish" class="publish"
v-if="userInfo.user_type == 40"
id="publish"
class="publish"
:style="{'left': left === 0 ? '626rpx' : left + 'px', 'top': top === 0 ? 'calc(100% - 300rpx)' : top + 'px'}" :style="{'left': left === 0 ? '626rpx' : left + 'px', 'top': top === 0 ? 'calc(100% - 300rpx)' : top + 'px'}"
@touchmove.stop.prevent="touchmove" @touchmove.stop.prevent="touchmove" @touchend="touchend" @click="publish"
@touchend="touchend" :class="{transition: !isMove }">
@click="publish"
:class="{transition: !isMove }"
>
<image src="/static/publish.png" mode="aspectFill"></image> <image src="/static/publish.png" mode="aspectFill"></image>
<text>发布</text> <text>发布</text>
</view> </view>
</view><addShuiyin /> </view>
<addShuiyin />
</view> </view>
</template> </template>
@ -93,8 +96,7 @@
import * as UserApi from '@/api/user'; import * as UserApi from '@/api/user';
export default { export default {
components: { components: {},
},
data() { data() {
return { return {
tabList: ['推荐', '精选', '晒单', '日常', '文章'], tabList: ['推荐', '精选', '晒单', '日常', '文章'],
@ -106,8 +108,8 @@
loading: false, loading: false,
finished: false, finished: false,
showFullCont: [], showFullCont: [],
top:0, top: 0,
left:0, left: 0,
width: 0, width: 0,
height: 0, height: 0,
offsetWidth: 0, offsetWidth: 0,
@ -130,6 +132,25 @@
this.getDynamicList(); this.getDynamicList();
}, },
}, },
/**
* 分享当前页面
*/
onShareAppMessage() {
return {
}
},
/**
* 分享到朋友圈
* 本接口为 Beta 版本，暂只在 Android 平台支持，详见分享到朋友圈 (Beta)
* https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/share-timeline.html
*/
onShareTimeline() {
return {
}
},
onLoad() { onLoad() {
uni.setNavigationBarColor({ uni.setNavigationBarColor({
frontColor: '#000000', frontColor: '#000000',
@ -251,27 +272,27 @@
data: cont data: cont
}); });
}, },
downloadSingleImage(url) { downloadSingleImage(url) {
  return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
    uni.downloadFile({ uni.downloadFile({
      url: url, url: url,
      success: (res) => { success: (res) => {
        if (res.statusCode === 200) { if (res.statusCode === 200) {
          resolve(res.tempFilePath) resolve(res.tempFilePath)
        } else { } else {
          reject(new Error('下载失败')) reject(new Error('下载失败'))
        } }
      }, },
      fail: (err) => { fail: (err) => {
        reject(new Error('下载失败')) reject(new Error('下载失败'))
      } }
    }) })
  }) })
}, },
downloadMultipleImages(urls) { downloadMultipleImages(urls) {
  let tasks = [] let tasks = []
  urls.forEach((url, k) => { urls.forEach((url, k) => {
    tasks.push(this.downloadSingleImage(url.external_url).then(e => { tasks.push(this.downloadSingleImage(url.external_url).then(e => {
uni.saveImageToPhotosAlbum({ uni.saveImageToPhotosAlbum({
filePath: e, filePath: e,
}); });
@ -282,32 +303,32 @@
}) })
} }
})); }));
  }) })
  return Promise.all(tasks) return Promise.all(tasks)
}, },
previewFile(url) { previewFile(url) {
uni.downloadFile({ uni.downloadFile({
      url, url,
      success: (res) => { success: (res) => {
        if (res.statusCode === 200) { if (res.statusCode === 200) {
this.isPreview = true; this.isPreview = true;
uni.openDocument({ uni.openDocument({
filePath: res.tempFilePath, filePath: res.tempFilePath,
}); });
        } else { } else {
        uni.showToast({ uni.showToast({
icon: 'error', icon: 'error',
title: '下载失败！' title: '下载失败！'
}) })
        } }
      }, },
      fail: (err) => { fail: (err) => {
        uni.showToast({ uni.showToast({
icon: 'error', icon: 'error',
title: '下载失败！' title: '下载失败！'
}) })
      } }
    }) })
}, },
solveFileName(name) { solveFileName(name) {
if (name.indexOf('.xlsx')) { if (name.indexOf('.xlsx')) {
@ -337,17 +358,16 @@
url: '/pages/squareDynamic/publish', url: '/pages/squareDynamic/publish',
}) })
}, },
spred(e){ spred(e) {
const animation = uni.createAnimation({ const animation = uni.createAnimation({
duration: 200, duration: 200,
timingFunction: 'ease', timingFunction: 'ease',
}); });
this.animationData = animation.export(); this.animationData = animation.export();
if(this.isShow){ if (this.isShow) {
animation.rotate(135).step(); animation.rotate(135).step();
} } else {
else{
animation.rotate(0).step(); animation.rotate(0).step();
} }
this.animationData = animation.export(); this.animationData = animation.export();
@ -358,7 +378,7 @@
return false; return false;
} }
this.isMove = true; this.isMove = true;
this.isShow=false this.isShow = false
this.spred() this.spred()
this.left = e.touches[0].clientX - this.offsetWidth; this.left = e.touches[0].clientX - this.offsetWidth;
let clientX = e.touches[0].clientX; let clientX = e.touches[0].clientX;
@ -391,10 +411,10 @@
} else { } else {
this.left = edgeRigth; this.left = edgeRigth;
} }
if(this.left>200){ if (this.left > 200) {
this.postitionName=false this.postitionName = false
}else{ } else {
this.postitionName=true this.postitionName = true
} }
} }
@ -456,6 +476,7 @@
.container { .container {
background: #F7F8FA; background: #F7F8FA;
padding-top: 292rpx; padding-top: 292rpx;
.head { .head {
height: 450rpx; height: 450rpx;
width: 100%; width: 100%;
@ -463,6 +484,7 @@
top: -88rpx; top: -88rpx;
background: linear-gradient(0deg, #F7F8FA, #E0EFFD); background: linear-gradient(0deg, #F7F8FA, #E0EFFD);
z-index: 0; z-index: 0;
>image { >image {
position: absolute; position: absolute;
top: 138rpx; top: 138rpx;
@ -472,14 +494,17 @@
height: 221rpx; height: 221rpx;
} }
} }
.box { .box {
position: relative; position: relative;
width: 100%; width: 100%;
// top: 292rpx; // top: 292rpx;
padding: 24rpx; padding: 24rpx;
.tab-list { .tab-list {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
.tab-item { .tab-item {
width: 130rpx; width: 130rpx;
height: 80rpx; height: 80rpx;
@ -490,31 +515,38 @@
color: #999999; color: #999999;
line-height: 80rpx; line-height: 80rpx;
text-align: center; text-align: center;
&.active { &.active {
box-shadow: 0rpx 4rpx 12rpx 0rpx rgba(32,39,76,0.1); box-shadow: 0rpx 4rpx 12rpx 0rpx rgba(32, 39, 76, 0.1);
opacity: 1; opacity: 1;
color: #333333; color: #333333;
} }
} }
} }
.list { .list {
margin-top: 30rpx; margin-top: 30rpx;
.dynamic-item { .dynamic-item {
width: 100%; width: 100%;
background: #FFFFFF; background: #FFFFFF;
border-radius: 20rpx; border-radius: 20rpx;
padding: 30rpx; padding: 30rpx;
margin-bottom: 20rpx; margin-bottom: 20rpx;
&:last-child { &:last-child {
margin-bottom: 0; margin-bottom: 0;
} }
.user { .user {
display: flex; display: flex;
>image { >image {
width: 80rpx; width: 80rpx;
height: 80rpx; height: 80rpx;
margin-right: 24rpx; margin-right: 24rpx;
} }
.user-info { .user-info {
.name { .name {
font-size: 30rpx; font-size: 30rpx;
@ -522,6 +554,7 @@
line-height: 30rpx; line-height: 30rpx;
margin-bottom: 26rpx; margin-bottom: 26rpx;
} }
.time { .time {
font-size: 24rpx; font-size: 24rpx;
color: #999999; color: #999999;
@ -529,6 +562,7 @@
} }
} }
} }
.cont { .cont {
margin-top: 30rpx; margin-top: 30rpx;
font-size: 28rpx; font-size: 28rpx;
@ -537,6 +571,7 @@
color: #222222; color: #222222;
word-break: break-word; word-break: break-word;
white-space: pre-line; white-space: pre-line;
&.close { &.close {
max-height: 240rpx; max-height: 240rpx;
overflow: hidden; overflow: hidden;
@ -546,29 +581,35 @@
-webkit-box-orient: vertical; -webkit-box-orient: vertical;
} }
} }
.show-more { .show-more {
font-size: 28rpx; font-size: 28rpx;
line-height: 40rpx; line-height: 40rpx;
color: #F34A40; color: #F34A40;
text-align: right; text-align: right;
} }
.pic-list { .pic-list {
margin-top: 24rpx; margin-top: 24rpx;
>image { >image {
width: 210rpx; width: 210rpx;
height: 210rpx; height: 210rpx;
margin-right: 6rpx; margin-right: 6rpx;
margin-bottom: 6rpx; margin-bottom: 6rpx;
border-radius: 10rpx; border-radius: 10rpx;
&:nth-child(3n) { &:nth-child(3n) {
margin-right: 0; margin-right: 0;
} }
} }
} }
.file-list { .file-list {
display: block; display: block;
padding: 30rpx 0; padding: 30rpx 0;
height: fit-content; height: fit-content;
.file-box { .file-box {
border-bottom: 1px solid #ddd; border-bottom: 1px solid #ddd;
display: flex; display: flex;
@ -577,15 +618,18 @@
padding: 10rpx 20rpx; padding: 10rpx 20rpx;
height: 80rpx; height: 80rpx;
margin-bottom: 20rpx; margin-bottom: 20rpx;
&:last-child { &:last-child {
border-bottom: none; border-bottom: none;
} }
>image { >image {
width: 60rpx; width: 60rpx;
height: 60rpx; height: 60rpx;
margin: 0 10rpx 0 0; margin: 0 10rpx 0 0;
flex-shrink: 0; flex-shrink: 0;
} }
>text { >text {
width: calc(100% - 70rpx); width: calc(100% - 70rpx);
overflow: hidden; overflow: hidden;
@ -594,36 +638,44 @@
} }
} }
} }
.goods { .goods {
background: #f5f5f5; background: #f5f5f5;
padding: 20rpx; padding: 20rpx;
margin-top: 24rpx; margin-top: 24rpx;
} }
.goods-box { .goods-box {
display: flex; display: flex;
background: #fff; background: #fff;
padding: 20rpx 0; padding: 20rpx 0;
>image { >image {
width: 100rpx; width: 100rpx;
height: 100rpx; height: 100rpx;
margin-right: 20rpx; margin-right: 20rpx;
} }
.goods-info { .goods-info {
width: calc(100% - 120rpx); width: calc(100% - 120rpx);
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: space-between; justify-content: space-between;
.name { .name {
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
} }
.price { .price {
display: flex; display: flex;
>text { >text {
&:first-child { &:first-child {
color: #F34A40; color: #F34A40;
} }
&:last-child { &:last-child {
height: 40rpx; height: 40rpx;
line-height: 40rpx; line-height: 40rpx;
@ -640,10 +692,12 @@
} }
} }
} }
.btns { .btns {
margin-top: 20rpx; margin-top: 20rpx;
display: flex; display: flex;
justify-content: flex-end; justify-content: flex-end;
.btn { .btn {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
@ -652,16 +706,19 @@
line-height: 24rpx; line-height: 24rpx;
color: #999999; color: #999999;
margin-left: 40rpx; margin-left: 40rpx;
image { image {
width: 40rpx; width: 40rpx;
height: 40rpx; height: 40rpx;
margin-bottom: 10rpx; margin-bottom: 10rpx;
} }
::v-deep { ::v-deep {
.delete { .delete {
margin-bottom: 10rpx; margin-bottom: 10rpx;
.uni-icons { .uni-icons {
font-size: 40rpx!important; font-size: 40rpx !important;
font-weight: bold; font-weight: bold;
line-height: 40rpx; line-height: 40rpx;
} }
@ -671,6 +728,7 @@
} }
} }
} }
.finished, .finished,
.loading { .loading {
font-size: 28rpx; font-size: 28rpx;
@ -678,6 +736,7 @@
text-align: center; text-align: center;
color: #bbb; color: #bbb;
} }
.empty { .empty {
margin-top: 100rpx; margin-top: 100rpx;
font-size: 28rpx; font-size: 28rpx;
@ -692,6 +751,7 @@
margin: 0 auto 20rpx; margin: 0 auto 20rpx;
pointer-events: none; pointer-events: none;
} }
.publish { .publish {
position: fixed; position: fixed;
left: 626rpx; left: 626rpx;
@ -707,6 +767,7 @@
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
>image { >image {
width: 35rpx; width: 35rpx;
height: 28rpx; height: 28rpx;

2
project.config.json
Unescape View File

@ -1,5 +1,5 @@
{ {
"appid": "wx8dc1c2620cfd953a", "appid": "wx3f1dcf2e2ac45e7c",
"compileType": "miniprogram", "compileType": "miniprogram",
"libVersion": "3.3.3", "libVersion": "3.3.3",
"packOptions": { "packOptions": {

Write Preview
Loading…
Cancel
Save