Skip to content

7
7-Eleven
Commit 082d8ca0 by 高淑倩
Options

add: 种草社区_样式

parent 3e4be4a0
Showing with 246 additions and 4 deletions
src/base/base.wxss
......@@ -856,6 +856,11 @@ a {
font-size: 14px;
text-align: center;
}
.fixed-bottom0 {
position: fixed;
bottom: 0;
width: 100%;
}
.weui-footer_fixed-bottom {
position: fixed;
bottom: .52em;
......
src/component/grassItem/grassItem.js 0 → 100644
// component/grassItem/grassItem.js
var app = getApp()
const wxService = require('../../utils/wxService')
const utils = require('../../utils/util')
const envInfo = require('../../config/index').envInfo
Component({
/**
* 组件的属性列表
*/
properties: {
},
attached () {
},
/**
* 组件的初始数据
*/
data: {
},
/**
* 组件的方法列表
*/
methods: {
}
})
src/component/grassItem/grassItem.json 0 → 100644
{
"component": true,
"usingComponents": {}
}
\ No newline at end of file
src/component/grassItem/grassItem.wxml 0 → 100644
<!--component/grassItem/grassItem.wxml-->
<view class="grass-item weui-flex border_box">
<view class="grass-img-box">
<image class="grass-img" src="./../../assets/imgs/7_1_0/scancode.png" mode="widthFix" lazy-load="false" binderror="" bindload="" />
</view>
<view class="grass-item-desc border_box">
<view class="item-name">商品名称商品名称商品名称商品名称商品名称商品名称商品名称商品名称商品名称商品名称</view>
</view>
</view>
src/component/grassItem/grassItem.wxss 0 → 100644
/* component/grassItem/grassItem.wxss */
@import './../../base/base.wxss';
.grass-item {
height: 200rpx;
border-radius: 10rpx;
overflow: hidden;
background-color: rgba(255, 255, 255, 1);
box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
}
.grass-img-box, .grass-img {
width: 200rpx;
height: 200rpx;
}
.grass-item-desc {
margin-left: 28rpx;
}
.item-name {
color: rgba(0, 0, 0, 1);
font-family: PingFangSC-Light;
padding: 20rpx 0 20rpx 0;
width: 459rpx;
height: 74rpx;
color: rgba(0, 0, 0, 1);
font-size: 26rpx;
}
src/component/uploadVideo/uploadVideo.js 0 → 100644
// component/uploadVideo/uploadVideo.js
Component({
/**
* 组件的属性列表
*/
properties: {
},
/**
* 组件的初始数据
*/
data: {
pics:[],
// 视频
video: '',
},
/**
* 组件的方法列表
*/
methods: {
//点击上传图片
uploadVideo(){
console.log('1111')
this.chooseVideo()
},
//选取图片
chooseVideo(){
let that = this;
let pics = this.data.pics;
wx.chooseVideo({
sourceType: ['album','camera'],
maxDuration: 60,
camera: 'back',
success(res) {
console.log(res.tempFilePath)
const video = res.tempFilePath;
that.setData({
video: video
})
}
})
}
}
})
src/component/uploadVideo/uploadVideo.json 0 → 100644
{
"component": true,
"usingComponents": {}
}
\ No newline at end of file
src/component/uploadVideo/uploadVideo.wxml 0 → 100644
<!--component/uploadVideo/uploadVideo.wxml-->
<view class="page-upload-img">
<view class="upload-img-wrap" wx:for="{{pics}}" wx:key="{{index}}">
<image class="upload-img" src="{{item}}" />
</view>
<view class="video_area" wx:if="{{video != ''}}">
<video class="video_item" src="{{video}}" controls></video>
<!-- 防止视频组件层级太高，导致部分机型覆盖悬浮按钮 -->
<cover-image
class="video_delete"
src="../../assets/imgs/711_12.png"
mode="aspectFill"
bindtap="videoDelete"
/>
</view>
<view class="upload-wrap" bindtap="uploadVideo">
<view class="upload-text">+视频</view>
</view>
</view>
src/component/uploadVideo/uploadVideo.wxss 0 → 100644
/* component/uploadVideo/uploadVideo.wxss */
.page-upload-img{
display: flex;
flex-wrap: wrap;
}
.upload-wrap{
width: 160rpx;
height: 160rpx;
border-radius: 5rpx;
border: 1px solid rgba(216, 216, 216, 1);
line-height: 160rpx;
text-align: center;
}
.upload-text{
color: #aaaaaa;
}
.upload-img{
width: 160rpx;
height: 160rpx;
border: 1px solid rgba(216, 216, 216, 1);
}
.upload-img-wrap{
margin-right: 20rpx;
}
.video_delete {
width: 160rpx;
height: 160rpx;
}
\ No newline at end of file
src/subPackage/page/pages/grassCommunity/grassCommunity.json
{
"navigationBarTitleText": "种草社区",
"usingComponents": {}
"usingComponents": {
"upload-img": "/component/uploadImg/uploadImg",
"upload-video": "/component/uploadVideo/uploadVideo",
"grass-item": "/component/grassItem/grassItem"
}
}
\ No newline at end of file
src/subPackage/page/pages/grassCommunity/grassCommunity.wxml
<!--subPackage/page/pages/grassCommunity/grassCommunity.wxml-->
<text>subPackage/page/pages/grassCommunity/grassCommunity.wxml</text>
<view class="grass-community border_box">
<view class="grass-upload weui-flex">
<view class="upload-img"><upload-img/></view>
<view class="upload-video"><upload-video/></view>
</view>
<view class="upload-tip">*只支持.jpg格式图片/ .mp4格式视频，最长60s</view>
<view class="title-border"><input placeholder="添加标题" auto-focus/></view>
<view class="title-border"><input placeholder="这一刻想说什么..." auto-focus/></view>
<view class="related-goods">关联商品</view>
<view class="gress-list">
<grass-item />
</view>
</view>
<view class="post-notes fixed-bottom0">发布笔记</view>
src/subPackage/page/pages/grassCommunity/grassCommunity.wxss
/* subPackage/page/pages/grassCommunity/grassCommunity.wxss */
@import './../../../../base/base.wxss';
\ No newline at end of file
@import './../../../../base/base.wxss';
.grass-community{
padding: 30rpx;
}
.upload-img {
margin: 0 20rpx 20rpx 0;
}
.upload-tip {
height: 28prx;
color: rgba(170, 170, 170, 1);
font-size: 20rpx;
text-align: left;
font-family: PingFangSC-Regular;
padding-bottom: 100rpx;
}
.post-notes{
text-align: center;
height: 88rpx;
line-height: 88rpx;
background-color: rgba(203, 60, 60, 1);
color: rgba(255, 255, 255, 1);
font-size: 25rpx;
font-family: PingFangSC-Medium;
}
.title-border {
border-bottom: 1px solid rgba(151, 151, 151, 0.3);
}
.related-goods {
width: 189rpx;
height: 54rpx;
line-height: 54rpx;
text-align: center;
border-radius: 31rpx;
background-color: rgba(216, 216, 216, 1);
color: rgba(0, 0, 0, 1);
font-size: 26rpx;
font-family: PingFangSC-Medium;
margin-top: 97rpx;
}
.gress-list {
margin: 0 auto;
margin-top: 30rpx;
}
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment