创建版本
This commit is contained in:
@@ -0,0 +1,305 @@
|
||||
<template>
|
||||
<view>
|
||||
<view class="header" id="header">
|
||||
<uni-nav-bar color="#ffffff" background-color="#007AFF" status-bar="true" left-icon="arrowleft" left-text="返回" :right-text="is_add ? '新增' : ''" @clickLeft="back" @clickRight="add" />
|
||||
<scroll-view id="tab-bar" class="scroll-h" :scroll-x="true" :show-scrollbar="false">
|
||||
<view v-for="(tab, index) in tabBars" :key="index" class="uni-tab-item" :id="tab.id" @click="ontabtap(index)">
|
||||
<text class="uni-tab-item-title" :class="tabIndex == index ? 'uni-tab-item-title-active' : ''">{{tab.name}}</text>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
|
||||
<view class="uni-list uni-list-controller" :style="'margin-top:' + listTop + 'px;'">
|
||||
<view v-for="(row, key) in tabBars[tabIndex].data" :key="key">
|
||||
<view class="uni-media-list">
|
||||
<view class="uni-media-list-body">
|
||||
<img :src=" baseURL + '/uploads/' + row.path" style="width:100%;">
|
||||
<view class="uni-media-list-text">
|
||||
<view class="uni-media-list-text-top">
|
||||
<text>{{ row.created_by }}</text>
|
||||
<text>{{ formatDate(row.created_at) }}</text>
|
||||
</view>
|
||||
<view class="uni-media-list-text-bottom">
|
||||
<text>{{ row.location }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<uni-load-more :status="tabBars[tabIndex].status" :icon-size="16" :content-text="tabBars[tabIndex].contentText" />
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import uniLoadMore from '@/components/uni-load-more/uni-load-more.vue';
|
||||
import uniNavBar from '@/components/uni-nav-bar/uni-nav-bar.vue'
|
||||
import {dateUtils} from '@/util.js';
|
||||
import {baseURL} from '@/api.js';
|
||||
export default {
|
||||
components: {
|
||||
uniLoadMore,
|
||||
uniNavBar
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
is_add: false,
|
||||
promotion_id: 0,
|
||||
tabIndex: 0,
|
||||
listTop: 103,
|
||||
baseURL: baseURL,
|
||||
tabBars: [{
|
||||
name: '审核中',
|
||||
id: '0',
|
||||
page: 1,
|
||||
data: [],
|
||||
status: 'more',
|
||||
contentText: {
|
||||
contentdown: '上拉加载更多',
|
||||
contentrefresh: '加载中',
|
||||
contentnomore: '没有更多'
|
||||
}
|
||||
}, {
|
||||
name: '已审核不合格',
|
||||
id: '1',
|
||||
page: 1,
|
||||
data: [],
|
||||
status: 'more',
|
||||
contentText: {
|
||||
contentdown: '上拉加载更多',
|
||||
contentrefresh: '加载中',
|
||||
contentnomore: '没有更多'
|
||||
}
|
||||
}, {
|
||||
name: '已审核合格',
|
||||
id: '2',
|
||||
page: 1,
|
||||
data: [],
|
||||
status: 'more',
|
||||
contentText: {
|
||||
contentdown: '上拉加载更多',
|
||||
contentrefresh: '加载中',
|
||||
contentnomore: '没有更多'
|
||||
}
|
||||
}],
|
||||
reload: false
|
||||
};
|
||||
},
|
||||
onLoad(options) {
|
||||
var me = this;
|
||||
me.promotion_id = options.promotion_id;
|
||||
|
||||
// 判断谁可以上传资料
|
||||
var user = uni.getStorageSync('user');
|
||||
if (user.group_id == 3 || user.id == 1) {
|
||||
me.is_add = true;
|
||||
}
|
||||
|
||||
me.getList(0);
|
||||
},
|
||||
onPullDownRefresh() {
|
||||
let me = this;
|
||||
me.reload = true;
|
||||
|
||||
let tab = me.tabBars[me.tabIndex];
|
||||
tab.page = 1;
|
||||
tab.status = 'more';
|
||||
me.getList(me.tabIndex);
|
||||
},
|
||||
onReachBottom() {
|
||||
let me = this;
|
||||
let tab = me.tabBars[me.tabIndex];
|
||||
if (tab.status == 'noMore') {
|
||||
return;
|
||||
}
|
||||
tab.status = 'more';
|
||||
this.getList(me.tabIndex);
|
||||
},
|
||||
mounted() {
|
||||
let me = this;
|
||||
uni.createSelectorQuery().in(this).select('#header').boundingClientRect(function(e) {
|
||||
me.listTop = e.height - 1;
|
||||
}).exec();
|
||||
},
|
||||
methods: {
|
||||
back() {
|
||||
uni.navigateBack();
|
||||
},
|
||||
add() {
|
||||
let me = this;
|
||||
uni.navigateTo({
|
||||
url: '/pages/app/promotionMaterial/upload?promotion_id=' + me.promotion_id
|
||||
});
|
||||
},
|
||||
ontabtap(index) {
|
||||
var me = this;
|
||||
me.tabIndex = index;
|
||||
this.switchTab(index);
|
||||
},
|
||||
switchTab(index) {
|
||||
var me = this;
|
||||
let tab = me.tabBars[index];
|
||||
if (tab.data.length == 0) {
|
||||
me.getList(index);
|
||||
}
|
||||
},
|
||||
htmlClear(str) {
|
||||
// 正则去掉所有的html标记
|
||||
return str.replace(/<[^>]+>/g, "");
|
||||
},
|
||||
formatDate(value) {
|
||||
return dateUtils.formatDate(value);
|
||||
},
|
||||
getList(index) {
|
||||
var me = this;
|
||||
let tab = me.tabBars[index];
|
||||
|
||||
if (tab.status == 'noMore') {
|
||||
if (me.reload) {
|
||||
me.reload = false;
|
||||
uni.stopPullDownRefresh();
|
||||
}
|
||||
return;
|
||||
}
|
||||
|
||||
me.$api.post('promotion/material/index', {by: tab.id, page: tab.page}).then(res => {
|
||||
|
||||
if (me.reload) {
|
||||
tab.data = [];
|
||||
me.reload = false;
|
||||
uni.stopPullDownRefresh();
|
||||
}
|
||||
|
||||
tab.data = tab.data.concat(res.data);
|
||||
|
||||
if (res.current_page >= res.last_page) {
|
||||
tab.status = 'noMore';
|
||||
} else {
|
||||
tab.page = res.current_page + 1;
|
||||
}
|
||||
|
||||
}).catch(error => {
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
page {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: flex-start;
|
||||
justify-content: center;
|
||||
background: rgba(249, 249, 249, 1);
|
||||
}
|
||||
.header {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
right: 0;
|
||||
left: 0;
|
||||
z-index: 100;
|
||||
background: #fff;
|
||||
width: 100vw;
|
||||
}
|
||||
|
||||
.uni-list-controller {
|
||||
margin-top: 103px;
|
||||
background-color: #f1f1f1;
|
||||
width: 100vw;
|
||||
}
|
||||
|
||||
.uni-media-list {
|
||||
}
|
||||
|
||||
.uni-media-list-logo {
|
||||
width: 140rpx;
|
||||
height: 140rpx;
|
||||
}
|
||||
|
||||
.uni-media-list-body {
|
||||
background-color: #fff;
|
||||
height: auto;
|
||||
justify-content: space-around;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
|
||||
.uni-media-list-text {
|
||||
width: calc(100% - 30rpx);
|
||||
padding: 15rpx;
|
||||
}
|
||||
.uni-media-list-text-top {
|
||||
display: flex;
|
||||
font-size: 28rpx;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
.uni-media-list-text-bottom {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
padding-bottom: 15rpx;
|
||||
}
|
||||
|
||||
.scroll-h {
|
||||
width: 750rpx;
|
||||
height: 80rpx;
|
||||
flex-direction: row;
|
||||
white-space: nowrap;
|
||||
align-items: center;
|
||||
border-bottom: 1px solid #c8c7cc;
|
||||
}
|
||||
|
||||
.line-h {
|
||||
height: 1rpx;
|
||||
background-color: #cccccc;
|
||||
}
|
||||
|
||||
.uni-tab-item {
|
||||
display: inline-block;
|
||||
/*
|
||||
padding-left: 70rpx;
|
||||
padding-right: 70rpx;
|
||||
*/
|
||||
text-align: center;
|
||||
width: 33.333333%;
|
||||
}
|
||||
|
||||
.uni-tab-item-title {
|
||||
color: #555;
|
||||
font-size: 30rpx;
|
||||
height: 80rpx;
|
||||
line-height: 80rpx;
|
||||
flex-wrap: nowrap;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.uni-tab-item-title-active {
|
||||
color: #007AFF;
|
||||
}
|
||||
|
||||
.scroll-v {
|
||||
flex: 1;
|
||||
width: 750rpx;
|
||||
}
|
||||
|
||||
.search-controller {
|
||||
padding: 10rpx;
|
||||
}
|
||||
|
||||
.search-result {
|
||||
margin-top: 10px;
|
||||
margin-bottom: 20px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.search-result-text {
|
||||
text-align: center;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
</style>
|
||||
@@ -0,0 +1,249 @@
|
||||
<template>
|
||||
<view>
|
||||
<view class="upload-box">
|
||||
<view class="uni-form-item">
|
||||
<view class="title">位置信息</view>
|
||||
<input class="uni-input" disabled="disabled" v-model="location" />
|
||||
</view>
|
||||
|
||||
<view class="uni-form-item">
|
||||
<view class="title">门店名称</view>
|
||||
<input class="uni-input" placeholder="请输入门店名称" v-model="name" />
|
||||
</view>
|
||||
|
||||
<view class="uni-form-item" style="border:0;">
|
||||
<img-upload :imgArr="images" imgCount="3" ref="imgUpload" />
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="notice-box">
|
||||
<uni-notice-bar :show-close="true" :single="true" :text="'页面将在' + second + '秒后失效'" />
|
||||
</view>
|
||||
|
||||
<view class="submit-box">
|
||||
<button type="primary" @click="submit">提交</button>
|
||||
<button type="info" @click="refresh">刷新</button>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<style>
|
||||
page {
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.submit-box {
|
||||
display: flex;
|
||||
margin-right: 15rpx;
|
||||
}
|
||||
|
||||
.submit-box uni-button {
|
||||
margin-left: 15rpx;
|
||||
flex-direction: row;
|
||||
width: 100%;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.notice-box {
|
||||
padding: 0 15rpx;
|
||||
}
|
||||
|
||||
.upload-box {
|
||||
padding-left: 15rpx;
|
||||
}
|
||||
|
||||
.uni-form-item {
|
||||
border-bottom: 1px solid #F1F1F1;
|
||||
padding-top: 20rpx;
|
||||
padding-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.title {
|
||||
color: #888;
|
||||
}
|
||||
|
||||
.uni-input {
|
||||
color: #222;
|
||||
padding: 4px 12px 6px 12px;
|
||||
line-height: 1.8;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
var wx = require('weixin');
|
||||
import uniNoticeBar from '@/components/uni-notice-bar/uni-notice-bar.vue'
|
||||
import imgUpload from '@/components/my-components/uImgUpload.vue';
|
||||
var InterTimer = null;
|
||||
export default {
|
||||
components: {
|
||||
imgUpload,
|
||||
uniNoticeBar
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
name: '',
|
||||
location: '位置获取中...',
|
||||
promotion_id: 0,
|
||||
latitude: 0,
|
||||
longitude: 0,
|
||||
images: [],
|
||||
second: 180,
|
||||
}
|
||||
},
|
||||
onLoad(options) {
|
||||
var me = this;
|
||||
me.promotion_id = options.promotion_id;
|
||||
},
|
||||
methods: {
|
||||
getLocation() {
|
||||
let me = this;
|
||||
wx.getLocation({
|
||||
type: 'wgs84', // 默认为wgs84的gps坐标，如果要返回直接给openLocation用的火星坐标，可传入'gcj02'
|
||||
success: function(res) {
|
||||
console.log('微信定位成功');
|
||||
me.latitude = res.latitude;
|
||||
me.longitude = res.longitude;
|
||||
me.$api.post('wap/wechat/mapGeocoder', {
|
||||
location: res.latitude + ',' + res.longitude
|
||||
})
|
||||
.then(ret => {
|
||||
if (ret.status == 0) {
|
||||
me.location = ret.result.address;
|
||||
}
|
||||
});
|
||||
},
|
||||
fail: function(res) {
|
||||
console.log(res);
|
||||
}
|
||||
});
|
||||
},
|
||||
setRemainTime() {
|
||||
let me = this;
|
||||
if (me.second > 0) {
|
||||
me.second = me.second - 1;
|
||||
} else {
|
||||
window.clearInterval(InterTimer);
|
||||
}
|
||||
},
|
||||
refresh() {
|
||||
let me = this;
|
||||
me.name = '';
|
||||
me.location = '';
|
||||
me.latitude = 0;
|
||||
me.longitude = 0;
|
||||
me.images = [];
|
||||
me.second = 180;
|
||||
me.$refs.imgUpload.imgArray = [];
|
||||
me.getLocation();
|
||||
},
|
||||
submit() {
|
||||
let me = this;
|
||||
|
||||
if (me.second <= 0) {
|
||||
uni.showModal({
|
||||
content: "无法提交，表单已超时",
|
||||
confirmText: "确定",
|
||||
showCancel: false
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
if (me.name == '') {
|
||||
uni.showModal({
|
||||
content: "门店信息不能为空",
|
||||
confirmText: "确定",
|
||||
showCancel: false
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
if (me.location == '') {
|
||||
uni.showModal({
|
||||
content: "位置信息不能为空",
|
||||
confirmText: "确定",
|
||||
showCancel: false
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
if (me.latitude == 0 || me.longitude == 0) {
|
||||
uni.showModal({
|
||||
content: "经纬度不能为空",
|
||||
confirmText: "确定",
|
||||
showCancel: false
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
if (me.promotion_id == 0) {
|
||||
uni.showModal({
|
||||
content: "促销编号不能为空",
|
||||
confirmText: "确定",
|
||||
showCancel: false
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
let files = me.$refs.imgUpload.imgArray.map((uri, index) => {
|
||||
return {
|
||||
name: "images[" + index + "]",
|
||||
uri: uri
|
||||
}
|
||||
});
|
||||
uni.showLoading({
|
||||
mask: true,
|
||||
title: '数据处理中...'
|
||||
});
|
||||
uni.uploadFile({
|
||||
url: me.$api.baseURL + "/promotion/material/store",
|
||||
files: files,
|
||||
formData: {
|
||||
name: me.name,
|
||||
location: me.location,
|
||||
lat: me.latitude,
|
||||
lng: me.longitude,
|
||||
promotion_id: me.promotion_id,
|
||||
},
|
||||
header: {
|
||||
'x-auth-token': uni.getStorageSync('token')
|
||||
},
|
||||
success: function(res) {
|
||||
uni.hideLoading();
|
||||
let ret = JSON.parse(res.data);
|
||||
if (ret.status) {
|
||||
uni.redirectTo({
|
||||
url: '/pages/app/promotionMaterial/index?promotion_id=' + me.promotion_id
|
||||
});
|
||||
} else {
|
||||
uni.showModal({
|
||||
content: ret.data,
|
||||
confirmText: "确定",
|
||||
showCancel: false
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
var me = this;
|
||||
|
||||
InterTimer = window.setInterval(me.setRemainTime, 1000);
|
||||
|
||||
me.$api.post('wap/wechat/jsConfig', {
|
||||
url: window.location.href
|
||||
}).then(ret => {
|
||||
wx.config(ret);
|
||||
wx.ready(function() {
|
||||
me.getLocation();
|
||||
});
|
||||
wx.error(function(res) {
|
||||
console.log(res.errMsg);
|
||||
});
|
||||
|
||||
}).catch(error => {
|
||||
console.log(error);
|
||||
});
|
||||
}
|
||||
}
|
||||
</script>
|
||||
Reference in New Issue
Block a user