616 lines
16 KiB
Vue
616 lines
16 KiB
Vue
|
<template>
|
|||
|
|
<view class="container">
|
|||
|
|
<view class="banner-box">
|
|||
|
|
<image src="/static/imgs/new-food-banner.png" mode=""></image>
|
|||
|
|
</view>
|
|||
|
|
<view class="main">
|
|||
|
|
<view class="tab-box">
|
|||
|
|
<view class="tab-item" :class="currentTabIndex == 0 ? 'active_tab' : ''" @click="currentTabIndex = 0">餐厅新品</view>
|
|||
|
|
<view class="tab-item" :class="currentTabIndex == 1 ? 'active_tab' : ''" @click="currentTabIndex = 1">大众推荐</view>
|
|||
|
|
<view class="tab-item" :class="currentTabIndex == 2 ? 'active_tab' : ''" @click="currentTabIndex = 2">个人推荐</view>
|
|||
|
|
</view>
|
|||
|
|
<view v-if="dateInfo">
|
|||
|
|
<view class="time" v-if="currentTabIndex == 0">推荐时间: {{dateInfo.start_time1}} ~ {{dateInfo.end_time1}}</view>
|
|||
|
|
<view class="time" v-else>投票时间: {{dateInfo.start_time2}} ~ {{dateInfo.end_time2}}</view>
|
|||
|
|
</view>
|
|||
|
|
<!-- 推荐菜品表单填写 -->
|
|||
|
|
<view class="form-box" v-if="currentTabIndex == 0">
|
|||
|
|
<view class="form-item">
|
|||
|
|
<view class="label">菜品名称：</view>
|
|||
|
|
<view class="ipt-box">
|
|||
|
|
<input type="text" placeholder="请输入菜品名称" v-model="foodName">
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="form-item">
|
|||
|
|
<view class="label">菜品类型：</view>
|
|||
|
|
<view class="picker-box">
|
|||
|
|
<image class="arrow" src="/static/icons/right-arrow.png" mode=""></image>
|
|||
|
|
<picker class="picker" :range="kinds" @change="change(0,$event)">
|
|||
|
|
<view>{{kinds[index]}}</view>
|
|||
|
|
</picker>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="form-item">
|
|||
|
|
<view class="label">食材：</view>
|
|||
|
|
<view class="ipt-box">
|
|||
|
|
<input type="text" placeholder="请输入食材名称" v-model="materialName">
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="img-list">
|
|||
|
|
<view class="title">菜品图片</view>
|
|||
|
|
<view class="img-box">
|
|||
|
|
<view class="img-item" v-for="(item,index) in imgs" :key="index">
|
|||
|
|
<image class="remove-btn" @click="removeImg(index)" src="/static/icons/delete-icon.png" mode=""></image>
|
|||
|
|
<image class="img" :src="item" mode=""></image>
|
|||
|
|
</view>
|
|||
|
|
<view class="img-item upload-btn" @click="chooseImg()" v-if="imgs.length < 1">
|
|||
|
|
<image class="img" src="/static/imgs/tianjia-img.png" mode=""></image>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="text-box">
|
|||
|
|
<view class="title">推荐理由</view>
|
|||
|
|
<view class="textarea-box">
|
|||
|
|
<textarea value="" placeholder="请输入推荐理由" v-model="reason" />
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="btn">
|
|||
|
|
<view class="sure-btn" @click="submit">提交</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<!-- 大众推荐 --><!-- picture,food_name,kinds,reason,vote_no-->
|
|||
|
|
<view v-if="currentTabIndex == 1">
|
|||
|
|
<view class="list-box" v-if="publicList.length > 0">
|
|||
|
|
<view class="list-item" v-for="(item, index) in publicList" :key="item.id">
|
|||
|
|
<view class="content">
|
|||
|
|
<view class="image-box" >
|
|||
|
|
<image mode="" :src="item.picture" />
|
|||
|
|
</view>
|
|||
|
|
<view class="fr-content">
|
|||
|
|
<view class="text"><text>菜品名称:</text> {{item.food_name}}</view>
|
|||
|
|
<view class="text"><text>菜品类型:</text> {{item.kinds}}</view>
|
|||
|
|
<view class="text"><text>推荐理由:</text> {{item.reason}}</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="bottom">
|
|||
|
|
<view class="num-box">点赞数: <text class="num">{{item.vote_no}}</text></view>
|
|||
|
|
<view class="vote-btn" v-if="item.is_vote == 0" @click="vote(index,item.id)">我想吃</view>
|
|||
|
|
<view class="vote-btn" v-else-if="item.is_vote == 1">已点赞</view>
|
|||
|
|
<view class="vote-btn bg-ccc" v-else>我想吃</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<content-none :padTop="30" v-else></content-none>
|
|||
|
|
</view>
|
|||
|
|
<!-- 个人推荐 -->
|
|||
|
|
<view v-if="currentTabIndex == 2">
|
|||
|
|
<view class="list-box" v-if="parsonFoodList.length > 0">
|
|||
|
|
<view class="list-item" v-for="(item, index) in parsonFoodList" :key="item.id">
|
|||
|
|
<view class="content">
|
|||
|
|
<view class="image-box" >
|
|||
|
|
<image mode="" :src="item.picture" />
|
|||
|
|
</view>
|
|||
|
|
<view class="fr-content">
|
|||
|
|
<view class="text"><text>菜品名称:</text> {{item.food_name}}</view>
|
|||
|
|
<view class="text"><text>菜品类型:</text> {{item.kinds}}</view>
|
|||
|
|
<view class="text"><text>推荐理由:</text> {{item.reason}}</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="bottom">
|
|||
|
|
<view class="num-box">票数: <text class="num">{{item.vote_no}}</text></view>
|
|||
|
|
<view class="vote-btn" v-if="item.is_vote == 0" @click="vote(index,item.id)">投票</view>
|
|||
|
|
<view class="vote-btn" v-else-if="item.is_vote == 1">已投票</view>
|
|||
|
|
<view class="vote-btn bg-ccc" v-else>投票</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<content-none :padTop="30" v-else></content-none>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
</view>
|
|||
|
|
<load-more v-show="currentTabIndex == 2" :loadingType="loadingType" :contentText="contentText"></load-more>
|
|||
|
|
</view>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
import {alertTip,callbackRequest,getStorage,convertImgToBase64} from '@/common/util.js';
|
|||
|
|
import {recommendFood,getRecommendFoodList,recommendFoodVote,getQueryDate} from '@/common/api.js';
|
|||
|
|
import loadMore from '@/components/loadMore.vue';
|
|||
|
|
import contentNone from '@/components/contentNone.vue';
|
|||
|
|
export default {
|
|||
|
|
data() {
|
|||
|
|
return {
|
|||
|
|
currentTabIndex:0,
|
|||
|
|
page:1,
|
|||
|
|
pageSize:10,
|
|||
|
|
loadingType:0,//0-loading前；1-loading中；2-没有更多了
|
|||
|
|
contentText: {
|
|||
|
|
contentdown: "上拉加载更多",
|
|||
|
|
contentrefresh: "正在加载...",
|
|||
|
|
contentnomore: "没有更多数据了"
|
|||
|
|
},
|
|||
|
|
index : 0,
|
|||
|
|
kinds:['熟食','凉菜','热菜','蔬菜','主食','水果'],
|
|||
|
|
foodName:'',//菜品名称
|
|||
|
|
reason:'',//推荐理由
|
|||
|
|
materialName:'',//食材名称
|
|||
|
|
imgs:[],
|
|||
|
|
userId:getStorage('userInfo').id,
|
|||
|
|
foodList : [], //推荐菜列表
|
|||
|
|
parsonFoodList:[{picture:"http://47.99.190.179:80/appImageDir/a68b13fe0bcf4ee1992ee32623055639.jpg",food_name:"猪蹄",kinds:"熟食",reason:"好吃的很",vote_no:"10",is_vote:"0"},
|
|||
|
|
{picture:"http://47.99.190.179:80/appImageDir/42d0a21e68804c398ca3abb4bdc20314.jpg",food_name:"鱿鱼圈",kinds:"熟食",reason:"好吃的很",vote_no:"10"},
|
|||
|
|
{picture:"http://47.99.190.179:80/appImageDir/e24e76afe4504821891c38aab8793e17.jpg",food_name:"熟食排骨",kinds:"熟食",reason:"好吃的很",vote_no:"10"},
|
|||
|
|
{picture:"http://47.99.190.179:80/appImageDir/c88ee591bb5c4a228873a4a30020ae6d.jpg",food_name:"卤大肠",kinds:"熟食",reason:"好吃的很",vote_no:"10"},
|
|||
|
|
{picture:"http://47.99.190.179:80/appImageDir/42d0a21e68804c398ca3abb4bdc20314.jpg",food_name:"鱿鱼圈",kinds:"熟食",reason:"好吃的很",vote_no:"10"}
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
],
|
|||
|
|
publicList:[{picture:"/static/test/paojiaofz.jpg",food_name:"泡椒凤爪",kinds:"熟食",reason:"爱吃泡椒凤爪需要理由吗?嗯不需要!太好吃啦,推荐一波66666!",vote_no:"10",is_vote:"0"},
|
|||
|
|
{picture:"/static/test/hongshaor.jpg",food_name:"红烧肉",kinds:"熟食",reason:"肥而不腻,我把肥肉都吃干净啦",vote_no:"10"},
|
|||
|
|
{picture:"/static/test/xiaocaor.jpg",food_name:"小炒肉",kinds:"熟食",reason:"够辣,够味,很下饭很喜欢!",vote_no:"10"},
|
|||
|
|
{picture:"/static/test/shizt.jpg",food_name:"狮子头",kinds:"熟食",reason:"肉很嫩,特好吃",vote_no:"10"},
|
|||
|
|
{picture:"/static/test/dack.jpg",food_name:"烤鸭",kinds:"熟食",reason:"正宗北京烤鸭,皮很脆",vote_no:"10"}],
|
|||
|
|
dateInfo:null,
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
watch:{
|
|||
|
|
currentTabIndex:function(newVal,oldVal){
|
|||
|
|
if(newVal == 1 && this.foodList.length == 0){
|
|||
|
|
// this.page = 1;
|
|||
|
|
// this.loadingType = 0;
|
|||
|
|
// this.foodList = [];
|
|||
|
|
this.initData();
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
components:{
|
|||
|
|
loadMore,
|
|||
|
|
contentNone
|
|||
|
|
},
|
|||
|
|
onLoad(){
|
|||
|
|
this.getDate();
|
|||
|
|
},
|
|||
|
|
methods: {
|
|||
|
|
//获取推荐菜列表
|
|||
|
|
initData(){
|
|||
|
|
let params = {
|
|||
|
|
"method":getRecommendFoodList,
|
|||
|
|
data:{
|
|||
|
|
pageSize:this.pageSize,
|
|||
|
|
pageNum:this.page,
|
|||
|
|
userId:this.userId
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
callbackRequest(params)
|
|||
|
|
.then(res => {
|
|||
|
|
if(res.data.returnCode == 1){
|
|||
|
|
if(this.page == 1){
|
|||
|
|
this.foodList = res.data.returnData;
|
|||
|
|
}else {
|
|||
|
|
if(res.data.returnData.length > 0){
|
|||
|
|
this.foodList = this.foodList.concat(res.data.returnData);
|
|||
|
|
this.loadingType = 0;
|
|||
|
|
}else {
|
|||
|
|
this.loadingType = 2;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
getDate(){
|
|||
|
|
let params = {
|
|||
|
|
"method":getQueryDate,
|
|||
|
|
data:{
|
|||
|
|
userId:this.userId
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
callbackRequest(params)
|
|||
|
|
.then(res =>{
|
|||
|
|
if(res.data.returnCode == 1){
|
|||
|
|
this.dateInfo = res.data.returnData;
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
//选择菜品类型
|
|||
|
|
change(type,e){
|
|||
|
|
this.index = e.detail.value;
|
|||
|
|
},
|
|||
|
|
//上传图片
|
|||
|
|
// chooseImg(){
|
|||
|
|
// let _this = this;
|
|||
|
|
// uni.chooseImage({
|
|||
|
|
// count:3,
|
|||
|
|
// success:res => {
|
|||
|
|
// let param = "";
|
|||
|
|
// let imgArr = res.tempFilePaths
|
|||
|
|
// for (var i = 0; i < imgArr.length; i++) {
|
|||
|
|
// param = imgArr[i];
|
|||
|
|
// convertImgToBase64(param, function(base64) {
|
|||
|
|
// console.log(base64);
|
|||
|
|
// _this.imgs.push(base64)
|
|||
|
|
// })
|
|||
|
|
// }
|
|||
|
|
// }
|
|||
|
|
// })
|
|||
|
|
// },
|
|||
|
|
chooseImg() {
|
|||
|
|
let _this = this;
|
|||
|
|
uni.chooseImage({
|
|||
|
|
count: 3,
|
|||
|
|
success: res => {
|
|||
|
|
let param = '';
|
|||
|
|
let imgArr = res.tempFilePaths;
|
|||
|
|
for (var i = 0; i < imgArr.length; i++) {
|
|||
|
|
param = imgArr[i];
|
|||
|
|
uni.compressImage({
|
|||
|
|
src: param,
|
|||
|
|
quality: 80,
|
|||
|
|
success: res1 => {
|
|||
|
|
plus.io.resolveLocalFileSystemURL( res1.tempFilePath,
|
|||
|
|
function(entry){
|
|||
|
|
var reader = null;
|
|||
|
|
entry.file( function ( file ) {
|
|||
|
|
reader = new plus.io.FileReader();
|
|||
|
|
reader.onloadend = function ( e ) {
|
|||
|
|
_this.imgs.push(e.target.result);
|
|||
|
|
};
|
|||
|
|
reader.readAsDataURL( file );
|
|||
|
|
}, function ( e ) {
|
|||
|
|
alert( e.message );
|
|||
|
|
} )
|
|||
|
|
},
|
|||
|
|
function(e){
|
|||
|
|
console.log(e)
|
|||
|
|
}
|
|||
|
|
);
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
//删除图片
|
|||
|
|
removeImg(index){
|
|||
|
|
this.imgs.splice(index,1);
|
|||
|
|
},
|
|||
|
|
//推荐菜提交
|
|||
|
|
submit(){
|
|||
|
|
if(!this.foodName){
|
|||
|
|
alertTip('请输入菜品名称');
|
|||
|
|
return false;
|
|||
|
|
}else if(!this.materialName){
|
|||
|
|
alertTip('请输入食材名称');
|
|||
|
|
return false;
|
|||
|
|
}else if(this.imgs.length == 0){
|
|||
|
|
alertTip('请上传菜品图片');
|
|||
|
|
return false;
|
|||
|
|
}else if(!this.reason){
|
|||
|
|
alertTip('请输入推荐理由');
|
|||
|
|
return false;
|
|||
|
|
}
|
|||
|
|
let imgArr = [].concat(this.imgs);
|
|||
|
|
let params = {
|
|||
|
|
"method":recommendFood,
|
|||
|
|
data:{
|
|||
|
|
kinds:this.kinds[this.index],
|
|||
|
|
foodName:this.foodName,
|
|||
|
|
picture:imgArr.join('~'),
|
|||
|
|
material:this.materialName,
|
|||
|
|
reason:this.reason,
|
|||
|
|
creator:this.userId
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
callbackRequest(params)
|
|||
|
|
.then(res => {
|
|||
|
|
if(res.data.returnCode == 1){
|
|||
|
|
alertTip('提交成功','success',1500);
|
|||
|
|
setTimeout(_ => {
|
|||
|
|
this.imgs = [];
|
|||
|
|
this.foodName = '';
|
|||
|
|
this.reason = '';
|
|||
|
|
this.materialName = '';
|
|||
|
|
this.page = 1;
|
|||
|
|
this.loadingType = 0;
|
|||
|
|
this.foodList = [];
|
|||
|
|
this.currentTabIndex = 1;
|
|||
|
|
},1500)
|
|||
|
|
}else {
|
|||
|
|
alertTip(res.data.returnMsg);
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
// 投票操作
|
|||
|
|
vote(index,id){
|
|||
|
|
let params = {
|
|||
|
|
"method":recommendFoodVote,
|
|||
|
|
data:{
|
|||
|
|
voteUser:this.userId,
|
|||
|
|
featureId:id
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
uni.showModal({
|
|||
|
|
content:'确认投票？',
|
|||
|
|
success:res => {
|
|||
|
|
if(res.confirm){
|
|||
|
|
callbackRequest(params)
|
|||
|
|
.then(res => {
|
|||
|
|
if(res.data.returnCode == 1){
|
|||
|
|
this.foodList.forEach((v,i) => {
|
|||
|
|
if(i == index){
|
|||
|
|
this.foodList[index].vote_no++;
|
|||
|
|
this.foodList[index].is_vote = 1;
|
|||
|
|
}else{
|
|||
|
|
this.foodList[i].is_vote = 2;
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
alertTip('投票成功','success',2000);
|
|||
|
|
}else {
|
|||
|
|
alertTip(res.data.returnMsg)
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
onReachBottom() {
|
|||
|
|
if (this.loadingType !== 0 || this.currentTabIndex == 0) {
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
this.loadingType = 1;
|
|||
|
|
this.page = this.page+1;
|
|||
|
|
this.initData();
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style lang="scss">
|
|||
|
|
@import '@/static/css/common.scss';
|
|||
|
|
.container{
|
|||
|
|
min-height:100vh;
|
|||
|
|
background: #f8f8f8;
|
|||
|
|
overflow: hidden;
|
|||
|
|
position: relative;
|
|||
|
|
.banner-box {
|
|||
|
|
width: 100%;
|
|||
|
|
height: 240upx;
|
|||
|
|
position: absolute;
|
|||
|
|
top: 0;
|
|||
|
|
left: 0;
|
|||
|
|
image {
|
|||
|
|
width: 100%;
|
|||
|
|
height: 100%;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.time{
|
|||
|
|
font-size:28rpx;
|
|||
|
|
color:#555;
|
|||
|
|
height:90rpx;
|
|||
|
|
line-height:90rpx;
|
|||
|
|
text-align:center;
|
|||
|
|
}
|
|||
|
|
.main {
|
|||
|
|
margin: 172upx 40upx 0;
|
|||
|
|
position: relative;
|
|||
|
|
z-index: 10;
|
|||
|
|
.tab-box {
|
|||
|
|
overflow: hidden;
|
|||
|
|
border-radius: 10upx 10upx 0 0;
|
|||
|
|
background: rgba(132, 149, 167, 0.8);
|
|||
|
|
height: 70upx;
|
|||
|
|
.tab-item {
|
|||
|
|
float: left;
|
|||
|
|
height: 70upx;
|
|||
|
|
width: 33.3%;
|
|||
|
|
font-size: 30upx;
|
|||
|
|
color: #e5f6ff;
|
|||
|
|
text-align: center;
|
|||
|
|
line-height: 70upx;
|
|||
|
|
}
|
|||
|
|
.active_tab {
|
|||
|
|
background: #fff;
|
|||
|
|
color: #333;
|
|||
|
|
border-radius: 10upx 10upx 0 0;
|
|||
|
|
font-weight: bold;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.form-box{
|
|||
|
|
// margin: 20upx;
|
|||
|
|
.form-item{
|
|||
|
|
overflow:hidden;
|
|||
|
|
padding:22upx 30upx 22upx 20upx;
|
|||
|
|
background: #fff;
|
|||
|
|
border-bottom:1px solid #f8f8f8;
|
|||
|
|
.label{
|
|||
|
|
float:left;
|
|||
|
|
width:160upx;
|
|||
|
|
font-size:30upx;
|
|||
|
|
color:#333;
|
|||
|
|
font-weight:bold;
|
|||
|
|
line-height:50upx;
|
|||
|
|
text-align:right;
|
|||
|
|
}
|
|||
|
|
.ipt-box{
|
|||
|
|
margin-left:170upx;
|
|||
|
|
input{
|
|||
|
|
width:100%;
|
|||
|
|
height:50upx;
|
|||
|
|
font-size:28upx;
|
|||
|
|
color:#666;
|
|||
|
|
line-height:50upx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.picker-box{
|
|||
|
|
margin-left:170upx;
|
|||
|
|
overflow:hidden;
|
|||
|
|
.arrow{
|
|||
|
|
float:right;
|
|||
|
|
width:16upx;
|
|||
|
|
height:29upx;
|
|||
|
|
margin-top:10upx;
|
|||
|
|
}
|
|||
|
|
.picker{
|
|||
|
|
margin-right:40upx;
|
|||
|
|
font-size:28upx;
|
|||
|
|
line-height:50upx;
|
|||
|
|
color:#666;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.img-list{
|
|||
|
|
padding:0 0 14upx;
|
|||
|
|
background: #fff;
|
|||
|
|
margin-bottom:10upx;
|
|||
|
|
.title{
|
|||
|
|
font-size:28upx;
|
|||
|
|
color:#333;
|
|||
|
|
font-weight:bold;
|
|||
|
|
line-height:40upx;
|
|||
|
|
padding:25upx 30upx 0;
|
|||
|
|
}
|
|||
|
|
.img-box{
|
|||
|
|
overflow:hidden;
|
|||
|
|
padding-top:25upx;
|
|||
|
|
.img-item{
|
|||
|
|
float:left;
|
|||
|
|
width:190upx;
|
|||
|
|
height:190upx;
|
|||
|
|
border:1px solid #ddd;
|
|||
|
|
margin:0 0 20upx 26upx;
|
|||
|
|
position:relative;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
.img{
|
|||
|
|
display:block;
|
|||
|
|
width:100%;
|
|||
|
|
height:100%;
|
|||
|
|
}
|
|||
|
|
.remove-btn{
|
|||
|
|
position:absolute;
|
|||
|
|
top:-18upx;
|
|||
|
|
right:-18upx;
|
|||
|
|
width:44upx;
|
|||
|
|
height:44upx;
|
|||
|
|
z-index:2;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.upload-btn{
|
|||
|
|
.img{
|
|||
|
|
width:60upx;
|
|||
|
|
height:60upx;
|
|||
|
|
margin:60upx auto 0;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.text-box{
|
|||
|
|
padding:0 0 30upx;
|
|||
|
|
background: #fff;
|
|||
|
|
margin-bottom:10upx;
|
|||
|
|
.title{
|
|||
|
|
font-size:28upx;
|
|||
|
|
color:#333;
|
|||
|
|
font-weight:bold;
|
|||
|
|
line-height:40upx;
|
|||
|
|
padding:25upx 30upx 0;
|
|||
|
|
}
|
|||
|
|
.textarea-box{
|
|||
|
|
border:1px solid #f8f8f8;
|
|||
|
|
padding:10upx;
|
|||
|
|
margin:25upx 30upx 0;
|
|||
|
|
textarea{
|
|||
|
|
font-size:28upx;
|
|||
|
|
color:#666;
|
|||
|
|
line-height:34upx;
|
|||
|
|
width:100%;
|
|||
|
|
resize: none;
|
|||
|
|
height:200upx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.btn {
|
|||
|
|
padding:0 0 30upx;
|
|||
|
|
background: #fff;
|
|||
|
|
margin-top: -10upx;
|
|||
|
|
.sure-btn{
|
|||
|
|
width:90%;
|
|||
|
|
height:80upx;
|
|||
|
|
font-size:28upx;
|
|||
|
|
color:#fff;
|
|||
|
|
text-align:center;
|
|||
|
|
line-height:80upx;
|
|||
|
|
border-radius:8upx;
|
|||
|
|
background: #0066CC;
|
|||
|
|
background:linear-gradient(to right, #ffc200,#ff9000);/*设置按钮为渐变颜色*/
|
|||
|
|
margin-left: 5%;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.list-box{
|
|||
|
|
background: #fff;
|
|||
|
|
.list-item{
|
|||
|
|
border-bottom:10upx solid #f8f8f8;
|
|||
|
|
padding:30upx 20upx;
|
|||
|
|
.content{
|
|||
|
|
overflow:hidden;
|
|||
|
|
.image-box{
|
|||
|
|
float:left;
|
|||
|
|
width:200upx;
|
|||
|
|
height:200upx;
|
|||
|
|
image{
|
|||
|
|
display:block;
|
|||
|
|
width:100%;
|
|||
|
|
height:100%;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.fr-content{
|
|||
|
|
margin-left:220upx;
|
|||
|
|
.text{
|
|||
|
|
font-size:26upx;
|
|||
|
|
color:#666;
|
|||
|
|
line-height:40upx;
|
|||
|
|
margin-bottom:10upx;
|
|||
|
|
text{
|
|||
|
|
float:left;
|
|||
|
|
color:#333;
|
|||
|
|
padding-right:10upx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.bottom{
|
|||
|
|
overflow:hidden;
|
|||
|
|
padding:10upx 0upx 0;
|
|||
|
|
.num-box{
|
|||
|
|
float:left;
|
|||
|
|
font-size:28upx;
|
|||
|
|
color:#333;
|
|||
|
|
line-height:40upx;
|
|||
|
|
padding-top:20upx;
|
|||
|
|
text{
|
|||
|
|
color:#5fbf3d;
|
|||
|
|
padding-left:4upx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.vote-btn{
|
|||
|
|
float:right;
|
|||
|
|
width:160upx;
|
|||
|
|
height:60upx;
|
|||
|
|
background: #5fbf3d;
|
|||
|
|
font-size:26upx;
|
|||
|
|
color:#fff;
|
|||
|
|
text-align:center;
|
|||
|
|
line-height:60upx;
|
|||
|
|
border-radius:4upx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</style>
|