clunt
/
dingdong-master
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

上架服务 文件上传测试

This commit is contained in:
donqi 2022-05-16 00:38:19 +08:00
parent 096d62252a
commit a48ce70a24
4 changed files with 336 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

47
common/js/data.js
View File

@ -170,7 +170,39 @@ const areaList = [
id: 300, id: 300,
name: '天河' name: '天河'
}] }]
] ]
const regionList = [
[{
id: 100,
name: '广东'
}, {
id: 101,
name: '海南'
}],
[{
id: 200,
name: '广州'
}]
]
const districtList = [{
id: 0,
name: '天河区',
checked: false
}, {
id: 1,
name: '番禺区',
checked: false
}, {
id: 2,
name: '南沙区',
checked: false
}, {
id: 3,
name: '黄浦区',
checked: false
}]
const categoryList = [ const categoryList = [
[{ [{
@ -426,7 +458,16 @@ const areaObj = {
const specsList = [{ const specsList = [{
id: 1, id: 1,
checked: true,
name: '电脑式' name: '电脑式'
}, {
id: 2,
checked: false,
name: '小修（压敏/盘管/传感器/接收器/定时器）'
}, {
id: 3,
checked: false,
name: '小修（压敏/盘管/传感器/接收器/定时器）'
}] }]
export default { export default {
@ -445,5 +486,7 @@ export default {
servDetail, servDetail,
goodsList, goodsList,
areaObj, areaObj,
specsList specsList,
regionList,
districtList
} }

51
common/js/request.js
View File

@ -1,12 +1,14 @@
import globalData from '@/common/js/globalData.js'; import globalData from '@/common/js/globalData.js';
export default { export default {
address: 'http://127.0.0.1:80',
// 异步接口拦截 // 异步接口拦截
addInterceptor() { addInterceptor() {
uni.addInterceptor('request', { uni.addInterceptor('request', {
invoke(args) { invoke(args) {
// request 触发前拼接 url // request 触发前拼接 url
args.url = 'http://www.opsoul.com' + args.url; // args.url = 'http://www.opsoul.com' + args.url;
args.url = this.address + args.url;
// console.log("停止触发"); // console.log("停止触发");
// return false; // return false;
}, },
@ -75,9 +77,9 @@ export default {
if (!loginRes.logined) { if (!loginRes.logined) {
userInfo = await wx.getUserProfile({ userInfo = await wx.getUserProfile({
desc: '用于小程序登录' desc: '用于小程序登录'
}); });
// 获取微信登录凭证 // 获取微信登录凭证
const wxLoginRes = await wx.login(); const wxLoginRes = await wx.login();
console.log(wxLoginRes) console.log(wxLoginRes)
// 再次请求小程序服务端存储用户，服务端添加附加用户信息后返回 // 再次请求小程序服务端存储用户，服务端添加附加用户信息后返回
loginRes = { loginRes = {
@ -87,15 +89,15 @@ export default {
userId: 1, userId: 1,
wxLoginCode: wxLoginRes.code wxLoginCode: wxLoginRes.code
} }
}; };
const wxAuthRes = await uni.request({ const wxAuthRes = await uni.request({
url: '/wx/auth', url: '/wx/auth',
header: { header: {
code: wxLoginRes.code code: wxLoginRes.code
} }
}) })
console.log(wxAuthRes) console.log(wxAuthRes)
loginRes.userInfo.openId = wxAuthRes[1].data.data.openid; loginRes.userInfo.openId = wxAuthRes[1].data.data.openid;
} }
userInfo = loginRes.userInfo; userInfo = loginRes.userInfo;
@ -110,9 +112,22 @@ export default {
// 页面存储用户登录有效信息，以便其他页面调用 // 页面存储用户登录有效信息，以便其他页面调用
uni.setStorageSync('userProfile', userInfo); uni.setStorageSync('userProfile', userInfo);
return true; return true;
},
getCurUserInfo() {
let userProfile = uni.getStorageSync('userProfile');
return userProfile;
}, },
getCurUserInfo() {
let userProfile = uni.getStorageSync('userProfile');
return userProfile;
},
async uploadFile(filePath) {
let res = await uni.uploadFile({
url: this.address + '/tool/qiniu/upload',
filePath: filePath,
name: 'uploadFile'
})
let resStr = res[1].data;
let resObj = {};
if (resStr != null && resStr.length > 0) {
resObj = JSON.parse(resStr);
}
return resObj;
}
} }

4
components/uni-combox/my-uni-combox.vue
View File

@ -58,9 +58,9 @@
default: '' default: ''
}, },
candidates: { candidates: {
type: Object, type: Array,
default () { default () {
return {} return []
} }
}, },
emptyTips: { emptyTips: {

264
pages/my/new-serv.vue
View File

@ -9,36 +9,197 @@
<form @submit="submit"> <form @submit="submit">
<view class="cu-form-group"> <view class="cu-form-group">
<view class="title">服务名称</view> <view class="title">服务名称</view>
<input name="name" placeholder="请编辑上架标题(供客户搜索)"></input> <input name="servName" :value="formData.servName" :v-model="formData.servName" placeholder="请编辑上架标题(供客户搜索)"></input>
</view> </view>
<view class="cu-form-group"> <view class="cu-form-group">
<view class="title">服务描述</view> <view class="title">服务描述</view>
<input name="name" placeholder="让客户更清晰的上架内容描述"></input> <input name="servDesc" :value="formData.servDesc" :v-model="formData.servDesc" placeholder="让客户更清晰的上架内容描述"></input>
</view> </view>
<view class="solid-top"> <view class="solid-top">
<view class="cu-form-group"> <view class="cu-form-group">
<view class="title">选择类目</view> <view class="title">选择类目</view>
<picker :mode="'multiSelector'" @change="categoryChange" :value="categoryMultiIndex" :range-key="'name'" :range="categoryList"> <picker :mode="'multiSelector'" @change="categoryChange" :value="categoryMultiIndex" :range-key="'name'" :range="categoryList">
<input class="line-input radius-input" :value="formData.category ? formData.category[0].name + '-' + formData.category[1].name + '-' + formData.category[2].name : ''" <input class="line-input radius-input" :value="formData.category && formData.category.length ? formData.category[0].name + '-' + formData.category[1].name + '-' + formData.category[2].name : ''"
placeholder="请选择类目"></input> placeholder="请选择类目"></input>
</picker> </picker>
</view> </view>
<view class="padding-lr"> <view v-if="formData.specsList && formData.specsList.length > 0">
<checkbox-group class="padding-lr bg-white" @change="checkSpecs" :class="isShowAllSpecs ? '' : 'certern-height'">
<view v-for="(item, index) in formData.specsList" class="padding-tb-sm">
<view class="flex">
<view class="flex-sub">
<checkbox style="transform:scale(1)" class="main-color margin-right-xs" :value="index" :checked="item.checked"></checkbox>
<text>{{item.name}}</text>
</view>
<view class="flex-sub">
<input class="radius-input" @input="inputSpecs($event, index, 'title')" :value="item.title" placeholder="自编辑购买标题"></input>
</view>
</view>
<view class="flex margin-top-xs">
<view class="flex-sub">
<input class="radius-input" @input="inputSpecs($event, index, 'price')" :value="item.price" placeholder="价格(平6%+￥5销10%+￥18)"></input>
</view>
</view>
<view class="flex margin-top-xs">
<view class="flex-sub">
<input class="radius-input" @input="inputSpecs($event, index, 'deduct')" :value="item.deduct" placeholder="追加提成额"></input>
</view>
<view class="flex-sub flex margin-left-xs">
<view class="flex-sub">
<input class="radius-input" @input="inputSpecs($event, index, 'groupPrice')" :value="item.groupPrice" placeholder="团购价"></input>
</view>
<view class="flex-sub margin-left-xs">
<input class="radius-input" @input="inputSpecs($event, index, 'unit')" :value="item.unit" placeholder="单位"></input>
</view>
</view>
</view>
</view>
</checkbox-group>
<view class="text-bold text-gray text-lg text-center bg-white padding-tb-sm" @click="showAllSpecs()"><text
:class="'cuIcon-' + (isShowAllSpecs ? 'fold' : 'unfold')"></text></view>
</view> </view>
<view class="bg-white">
<view class="padding-lr flex align-center">
<view class="flex-twice flex justify-start align-center">
<view style="width: 20%;">单位</view>
<my-uni-combox :candidates="productUnits" placeholder="请选择" v-model="formData.productUnit"></my-uni-combox>
</view>
<view class="flex-sub margin-left">
优惠券+
</view>
</view>
<view class="padding-lr flex align-center padding-tb-xs">
<view class="flex-sub">
<checkbox style="transform:scale(1)" class="main-color margin-right-xs" :value="true" :v-model="formData.isGoldenServ" :checked="formData.isGoldenServ"></checkbox>
<text>金牌服务</text>
</view>
<view class="flex-twice flex justify-start align-center">
<view style="width: 25%;">质保期</view>
<my-uni-combox :candidates="productProtectTimes" placeholder="请选择" v-model="formData.productProtectTime"></my-uni-combox>
</view>
</view>
</view>
</view>
<view class="solid-top">
<view class="cu-form-group">
<view class="title">上架区域</view>
<picker :mode="'multiSelector'" @change="regionChange" :value="regionMultiIndex" :range-key="'name'" :range="regionList">
<input class="line-input radius-input" :value="formData.region && formData.region.length ? formData.region[0].name + '-' + formData.region[1].name : ''"
placeholder="请选择区域"></input>
</picker>
</view>
<view class="padding-lr bg-white">
<checkbox-group @change="checkDistirct" class="grid col-3">
<view v-for="(item, index) in formData.districtList" class="margin-tb-xs">
<checkbox style="transform:scale(1)" class="main-color margin-right-xs" :value="index" :checked="item.checked"></checkbox>
<text>{{item.name}}</text>
</view>
</checkbox-group>
</view>
</view>
<view class="cu-form-group">
<view class="title">区域描述</view>
<input name="areaDesc" :value="formData.areaDesc" :v-model="formData.areaDesc" placeholder="请输入区域描述"></input>
</view>
<view class="cu-form-group">
<view class="title">上门费</view>
<input name="doorPrice" :value="formData.doorPrice" :v-model="formData.doorPrice" placeholder="单位:元/次"></input>
</view>
<view class="cu-bar bg-white solid-top">
<view class="action text-black">
轮播图上传
</view>
</view>
<view class="cu-form-group">
<view class="grid col-4 grid-square flex-sub">
<view class="bg-img" v-for="(item,index) in formData.imgList" :key="index" @tap="viewImage($event, formData.imgList)"
:data-url="item">
<image :src="item" mode="aspectFill"></image>
<view class="cu-tag bg-red" @tap.stop="delImg($event, formData.imgList)" :data-index="index">
<text class='cuIcon-close'></text>
</view>
</view>
<view class="solids" @tap="chooseImgList" v-if="formData.imgList.length<9">
<text class='cuIcon-cameraadd'></text>
</view>
</view>
</view>
<view class="cu-bar bg-white solid-top">
<view class="action text-black">
视频上传
</view>
</view>
<view class="bg-white padding-lr padding-bottom-sm">
<uni-file-picker limit="1" file-mediatype="video" return-type="object" @select="selectVideo">
<button class="cu-btn bg-main-color shadow-blur">选择文件</button>
</uni-file-picker>
</view>
<view class="padding-sm bg-white solid-top">
<textarea style="width: 100%;" class="solid radius text-left padding-sm" v-model="formData.detailDesc" maxlength="-1" placeholder="请输入详情介绍"></textarea>
</view>
<view class="padding-bottom-lg padding-top bg-white text-center">
<button class="cu-btn bg-main-color shadow-blur long-btn" @click="submit">确定</button>
</view> </view>
</form> </form>
</view> </view>
</template> </template>
<script> <script>
import myUniCombox from '@/components/uni-combox/my-uni-combox.vue';
export default { export default {
components: {
myUniCombox
},
data() { data() {
return { return {
formData: {}, formData: {
servName: '',
servDesc: '',
specsList: [],
category: [],
productUnit: '',
isGoldenServ: false,
region: [],
districtList: [],
areaDesc: '',
doorPrice: '',
imgList: [],
detailDesc: '',
video: {}
},
categoryList: [], categoryList: [],
categoryMultiIndex: [0, 0, 0], categoryMultiIndex: [0, 0, 0],
specsList: [] regionList: [],
regionMultiIndex: [0, 0],
isShowAllSpecs: false,
productUnits: [{
code: 1,
name: '台'
}, {
code: 2,
name: '件'
}, {
code: 3,
name: '套'
}, {
code: 4,
name: '个'
}, {
code: 5,
name: '平方'
}],
productProtectTimes: [{
code: 1,
name: '15天'
}, {
code: 2,
name: '30天'
}, {
code: 3,
name: '45天'
}]
} }
}, },
onLoad() { onLoad() {
@ -47,6 +208,7 @@
methods: { methods: {
async loadData() { async loadData() {
this.categoryList = await this.$api.data('categoryList'); this.categoryList = await this.$api.data('categoryList');
this.regionList = await this.$api.data('regionList');
}, },
async categoryChange(e) { async categoryChange(e) {
this.categoryMultiIndex = e.detail.value; this.categoryMultiIndex = e.detail.value;
@ -56,8 +218,87 @@
} }
this.formData.category = chosenCategory; this.formData.category = chosenCategory;
this.specsList = await this.$api.data('specsList'); this.formData.specsList = await this.$api.data('specsList');
}, },
async regionChange(e) {
this.regionMultiIndex = e.detail.value;
let chosenRegion = [];
for(let i = 0; i < this.regionList.length; i++) {
chosenRegion.push(this.regionList[i][this.regionMultiIndex[i]]);
}
this.formData.region = chosenRegion;
this.formData.districtList = await this.$api.data('districtList');
},
checkSpecs(e) {
let checkedIndexArr = e.detail.value;
for(let i = 0; i < this.formData.specsList.length; i++) {
if (checkedIndexArr.indexOf(String(i)) !== -1) {
this.formData.specsList[i].checked = true;
} else {
this.formData.specsList[i].checked = false;
}
}
},
inputSpecs(e, index, field) {
this.formData.specsList[index][field] = e.detail.value;
},
showAllSpecs() {
this.isShowAllSpecs = !this.isShowAllSpecs;
},
checkDistirct(e) {
let checkedIndexArr = e.detail.value;
for(let i = 0; i < this.formData.districtList.length; i++) {
if (checkedIndexArr.indexOf(String(i)) !== -1) {
this.formData.districtList[i].checked = true;
} else {
this.formData.districtList[i].checked = false;
}
}
console.log(this.formData)
},
chooseImgList(e) {
uni.chooseImage({
count: 9, //默认9
sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
sourceType: ['album'], //从相册选择
success: (res) => {
if (this.formData.imgList.length != 0) {
this.formData.imgList = this.formData.imgList.concat(res.tempFilePaths)
} else {
this.formData.imgList = res.tempFilePaths
}
}
});
},
viewImage(e, imgList) {
uni.previewImage({
urls: imgList,
current: e.currentTarget.dataset.url
});
},
delImg(e, imgList) {
uni.showModal({
title: '',
content: '确定要删除这张图片吗？',
cancelText: '取消',
confirmText: '确定',
success: res => {
if (res.confirm) {
imgList.splice(e.currentTarget.dataset.index, 1)
}
}
})
},
async selectVideo(e) {
let res = await this.$request.uploadFile(e.tempFilePaths[0]);
if (res.code === 0) {
this.formData.video = res.url;
}
},
submit() {
console.log(this.formData)
}
}, },
} }
</script> </script>
@ -66,4 +307,11 @@
.cu-form-group picker::after { .cu-form-group picker::after {
display: none; display: none;
} }
.certern-height {
height: 520rpx;
overflow: hidden;
}
.long-btn{
width: 95%;
}
</style> </style>