You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
618 lines
16 KiB
618 lines
16 KiB
<template>
|
|
<view class="postDemand">
|
|
<view class="formItem">
|
|
<view class="f-w col-3 f-32 p-t-30">
|
|
基础信息
|
|
</view>
|
|
<view class="menu-item">
|
|
<view class="menu-name">
|
|
需求类型
|
|
<text class="f-20 c-ff4444">*</text>
|
|
</view>
|
|
<view class="menu-content flex-box" @click="openlink">
|
|
<!-- <picker @change="Change" :value="index" :range="Arr" mode="multiSelector" range-key="title"> -->
|
|
<view class="uni-input" >{{categoryText }}</view>
|
|
<!-- </picker> -->
|
|
</view>
|
|
<view class=" t-r iconfont icon-right" style="font-size: 24upx;color: #333333;">
|
|
|
|
</view>
|
|
</view>
|
|
<view class="menu-item">
|
|
<view class="menu-name">
|
|
上门时间
|
|
<text class="f-20 c-ff4444">*</text>
|
|
</view>
|
|
<view class="menu-content flex-box" @click="openTime" v-if="time">
|
|
<input type="text" disabled v-model="time" class="menu-input" value="" />
|
|
</view>
|
|
<view class="menu-content flex-box col-9" @click="openTime" style="color: #999999;" v-else>
|
|
请选择上门时间
|
|
</view>
|
|
<view class=" t-r iconfont icon-right" style="font-size: 24upx;color: #333333;">
|
|
|
|
</view>
|
|
</view>
|
|
<view class="menu-item">
|
|
<view class="menu-name">
|
|
具体地址
|
|
<text class="f-20 c-ff4444">*</text>
|
|
</view>
|
|
<view class="menu-content flex-box" @click="goLocation" v-if="site">
|
|
<input type="text" disabled v-model="site" class="menu-input" value="" />
|
|
</view>
|
|
<view class="menu-content flex-box col-9" @click="goLocation" style="color: #999999;" v-else>
|
|
请选择具体地址
|
|
</view>
|
|
<view class=" t-r" style="font-size: 24upx;color: #FF4444;border-left: 1upx solid #EEEEEE;width: 100upx;" @click="goLocation">
|
|
定位
|
|
</view>
|
|
</view>
|
|
<view class="menu-item" style="border: none;">
|
|
<view class="menu-name">
|
|
联系方式
|
|
<!-- <text class="f-20 c-ff4444">*</text> -->
|
|
</view>
|
|
<view class="menu-content flex-box">
|
|
<input type="number" maxlength="11" v-model="phone" placeholder="填写后服务商可直接通过电话联系您" class="menu-input" value="" />
|
|
</view>
|
|
|
|
</view>
|
|
|
|
</view>
|
|
<view class="line">
|
|
|
|
</view>
|
|
<view class="requirement">
|
|
<view class="f-w f-32 col-3">
|
|
需求说明
|
|
</view>
|
|
<view class="text">
|
|
<textarea class="textarea" v-model="editorText" placeholder="请输入需求说明"></textarea>
|
|
</view>
|
|
</view>
|
|
<view class="line">
|
|
|
|
</view>
|
|
<view class="uploading">
|
|
<view class="f-w f-32 col-3">
|
|
上传照片
|
|
</view>
|
|
<view class="col-9 f-24" style="padding-top: 20upx;">
|
|
(上传照片，最多上传5张照片)
|
|
</view>
|
|
<view class="imgs">
|
|
<view class="img-item" v-for="(item,index) in imglinks" :key="index">
|
|
<image :src="item" mode=""></image>
|
|
<image class="imgclise" @click="deletImg(index)" :src="imgfixUrls + 'homemakingImg/imgcolse.png'" mode=""></image>
|
|
</view>
|
|
<view class="img-item" @click="uploadFiles(2, 6)" v-if="imglinks.length < 5">
|
|
<image :src="imgfixUrls + 'homemakingImg/upload.png'" mode=""></image>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="issue" @click="issueclick">
|
|
发布需求
|
|
</view>
|
|
<w-picker :visible.sync="visibletimeone" mode="date" fields="minute" :value="time" :current="false"
|
|
:second="false" @confirm="bindTimeChangeStar($event)" @cancel="onCancel" ref="time"></w-picker>
|
|
<w-picker
|
|
:visible.sync="visible"
|
|
mode="linkage"
|
|
:value="'94'"
|
|
:options="Arr"
|
|
:level="2"
|
|
default-type="id"
|
|
:default-props="pospt"
|
|
@confirm="onConfirm($event,'linkage')"
|
|
ref="linkage"
|
|
></w-picker>
|
|
<!-- #ifdef H5 -->
|
|
<PopManager :show="isOpenLaction" :type="'bottom'" :overlay="'false'" :showOverlay="'false'">
|
|
<view class="iframe-wid-hgt" :style="{ height: phoneHight,width:phoneWidth }" v-if="latlngs.latitude">
|
|
<iframe id="mapPage" width="100%" height="100%" frameborder="0" :src="`https://apis.map.qq.com/tools/locpicker?search=1&type=1&key=KIQBZ-6OT3G-AOMQD-IHW6J-PEUDV-VCFAF&referer=myapp&coord=${latlngs.latitude},${latlngs.longitude}`"></iframe>
|
|
</view>
|
|
<view class="iframe-wid-hgt" :style="{ height: phoneHight,width:phoneWidth }" v-if="!latlngs.latitude">
|
|
<iframe id="mapPage" width="100%" height="100%" frameborder="0" :src="`https://apis.map.qq.com/tools/locpicker?search=1&type=1&key=KIQBZ-6OT3G-AOMQD-IHW6J-PEUDV-VCFAF&referer=myapp`"></iframe>
|
|
</view>
|
|
</PopManager>
|
|
<!-- #endif -->
|
|
<!-- <TabBars :tabBarAct="0" pageType="18"></TabBars> -->
|
|
<PhoneMask :show1="popShow" @clickmask1="closePop"></PhoneMask>
|
|
<getvxphone :show="vxshow" @showFalse="showFalse"></getvxphone>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import App from '@/common/js/app.js';
|
|
import wPicker from '@/components/w-picker/w-picker.vue';
|
|
// #ifdef H5
|
|
import wxApi from '@/common/js/wxApi.js';
|
|
// #endif
|
|
import PopManager from '@/components/template/PopManager';
|
|
import TabBars from '@/components/template/tabBar.vue';
|
|
import PhoneMask from '@/components/template/PhoneMask';
|
|
import getvxphone from '@/components/template/getVXphone.vue'
|
|
export default{
|
|
data(){
|
|
return{
|
|
index:0,
|
|
visible:false,
|
|
isOpenLaction:false,
|
|
time:'',
|
|
site:'',
|
|
pospt:{"label":"title","value":"id","children":"list"},
|
|
Arr:[
|
|
],
|
|
visibletimeone:false,
|
|
localIds:null,
|
|
uploadlength:0,
|
|
imglinks:[],
|
|
phoneHight:null,
|
|
phoneWidth:null,
|
|
phone:'',
|
|
latlngs:{},
|
|
loadlogo:false,
|
|
uesrInfo:{},
|
|
editorText:'',
|
|
lng:'',
|
|
lat:'',
|
|
categoryText:'',
|
|
pageId:0,
|
|
userInfo:{},
|
|
lblis:{},
|
|
upimg:false,
|
|
popShow:false,
|
|
vxshow:false
|
|
}
|
|
},
|
|
onLoad(e) {
|
|
// debugger
|
|
let _this = this;
|
|
_this.pageId = e.id;
|
|
_this.latlngs = uni.getStorageSync('curLoction');
|
|
_this.uesrInfo = uni.getStorageSync('userinfo');
|
|
uni.getSystemInfo({
|
|
success(res) {
|
|
console.log(res);
|
|
_this.phoneHight = res.windowHeight + 'px';
|
|
_this.phoneWidth = res.windowWidth + 'px';
|
|
}
|
|
});
|
|
|
|
|
|
},
|
|
onShow() {
|
|
let _this = this;
|
|
let lblis = {}
|
|
// #ifdef H5
|
|
window.addEventListener(
|
|
'message',
|
|
function(event) {
|
|
// 接收位置信息，用户选择确认位置点后选点组件会触发该事件，回传用户的位置信息
|
|
let loc = event.data;
|
|
|
|
if (loc && loc.module == 'locationPicker') {
|
|
lblis = {
|
|
lat:loc.latlng.lat,
|
|
lng:loc.latlng.lng,
|
|
detailed_address:loc.poiaddress
|
|
}
|
|
_this.site = loc.poiaddress;
|
|
_this.lat = loc.latlng.lat;
|
|
_this.lng = loc.latlng.lng;
|
|
_this.isOpenLaction = false;
|
|
}
|
|
},
|
|
false
|
|
);
|
|
|
|
// #endif
|
|
//#ifdef APP-PLUS
|
|
if(_this.uesrInfo.address){
|
|
let bilis = {
|
|
detailed_address:_this.uesrInfo.address,
|
|
lat:_this.uesrInfo.lat,
|
|
lng:_this.uesrInfo.lng
|
|
};
|
|
_this.site = _this.uesrInfo.address;
|
|
_this.lat = _this.uesrInfo.lat;
|
|
_this.lng = _this.uesrInfo.lng;
|
|
}
|
|
//#endif
|
|
if(_this.upimg){
|
|
_this.upimg = false;
|
|
return
|
|
}
|
|
_this.getTypeinitialize(_this.pageId)
|
|
},
|
|
components:{
|
|
wPicker,
|
|
PopManager,
|
|
TabBars,
|
|
PhoneMask,
|
|
getvxphone
|
|
},
|
|
methods:{
|
|
showFalse(flag){
|
|
console.log('进了showfalse')
|
|
this.vxshow = false;
|
|
if(flag){
|
|
this.getTypeinitialize(this.pageId)
|
|
}
|
|
|
|
},
|
|
closePop(flag) {
|
|
let _this = this
|
|
_this.popShow = false
|
|
if(flag){
|
|
_this.getTypeinitialize(this.pageId)
|
|
}
|
|
|
|
},
|
|
onConfirm(e){
|
|
console.log(e);
|
|
this.categoryId = e.value[1];
|
|
this.Arr.map((item,index)=>{
|
|
if(item.id == e.value[0]){
|
|
item.list.map((items,indexs)=>{
|
|
if(items.id == e.value[1]){
|
|
this.categoryText = items.title;
|
|
}
|
|
})
|
|
}
|
|
})
|
|
},
|
|
// 时间戳转时间
|
|
getTimeData(dataValue) {
|
|
// debugger
|
|
var date = new Date(Number(dataValue)) //时间戳为10位需*1000，时间戳为13位的话不需乘1000
|
|
var Y = date.getFullYear() + '-'
|
|
var M = (date.getMonth()+1 < 10 ? '0'+(date.getMonth()+1) : date.getMonth()+1) + '-'
|
|
var D = date.getDate() + ' '
|
|
var h = date.getHours() + ':'
|
|
var m = date.getMinutes()
|
|
var s = date.getSeconds()
|
|
// return Y+M+D+h+m+s
|
|
// console.log(timestampToTime (1533293827000))
|
|
return {
|
|
label: Y + M + D + h + m
|
|
};
|
|
},
|
|
// 时间转时间戳
|
|
getDataTime(timeValue) {
|
|
let ontime;
|
|
// debugger
|
|
ontime = timeValue.replace(/-/g, '/');
|
|
let date = new Date(ontime);
|
|
let time = date.getTime() / 1000;
|
|
return time;
|
|
},
|
|
issueclick(){
|
|
let _this = this;
|
|
if(!_this.time){
|
|
uni.showToast({
|
|
title:'上门时间不能为空',
|
|
icon:'none'
|
|
});
|
|
return
|
|
}
|
|
if(!_this.site){
|
|
uni.showToast({
|
|
title:'具体地址不能为空',
|
|
icon:'none'
|
|
});
|
|
return
|
|
};
|
|
let serviceinfo = {
|
|
visitingtime:_this.getDataTime(_this.time),
|
|
thumbs:_this.imglinks,
|
|
detail:_this.editorText,
|
|
lng:_this.lng,
|
|
lat:_this.lat,
|
|
type:_this.categoryId,
|
|
address:_this.site,
|
|
mobile:_this.phone
|
|
}
|
|
console.log(serviceinfo);
|
|
let data = {
|
|
id:this.pageId
|
|
};
|
|
// debugger
|
|
let storehours = JSON.stringify(serviceinfo);
|
|
let base64 = new this.$util.Base64();
|
|
storehours = base64.encode(storehours);
|
|
data.demandinfo = storehours;
|
|
App._post_form(
|
|
`&p=housekeep&do=editDemandApi`,
|
|
data,
|
|
res => {
|
|
console.log(res);
|
|
if(this.pageId || !res.data.orderid){
|
|
App.navigationTo({
|
|
url: 'pages/subPages2/homemaking/myDemand/myDemand',
|
|
navType:'reLaunch'
|
|
});
|
|
}else{
|
|
App.navigationTo({
|
|
url: 'pages/mainPages/payment/payment?orderid=' + res.data.orderid + '&plugin=housekeep',
|
|
navType:'reLaunch'
|
|
});
|
|
}
|
|
|
|
},
|
|
false,
|
|
() => {
|
|
|
|
}
|
|
);
|
|
},
|
|
getTypeinitialize(id = ''){
|
|
let _this = this;
|
|
App._post_form(
|
|
`&p=housekeep&do=editDemandPage`,
|
|
{id},
|
|
res => {
|
|
_this.Arr = res.data.cate;
|
|
_this.categoryText = _this.Arr[0].list[0].title;
|
|
_this.categoryId = _this.Arr[0].list[0].id;
|
|
let demand = res.data.demand;
|
|
if(id){
|
|
_this.Arr.map((item,index)=>{
|
|
item.list.map((items,indexs)=>{
|
|
if(items.id == id){
|
|
this.categoryText = items.title;
|
|
}
|
|
})
|
|
});
|
|
_this.time = _this.getTimeData(demand.visitingtime * 1000).label;
|
|
_this.site = demand.address;
|
|
_this.lat = demand.lat;
|
|
_this.lng = demand.lng;
|
|
_this.editorText = demand.detail;
|
|
_this.imglinks = demand.thumbs;
|
|
|
|
}
|
|
_this.phone = demand.mobile;
|
|
// debugger
|
|
console.log(res);
|
|
},fail=>{
|
|
if(fail.data.message == '认证后才能发布需求'){
|
|
App.navigationTo({
|
|
url: `pages/subPages/attestationCenter/index?rzType=1&type=1`,
|
|
navType:'reLaunch' ,
|
|
});
|
|
}
|
|
if (fail.data.message == '未绑定手机号') {
|
|
//#ifdef H5
|
|
_this.popShow = true;
|
|
//#endif
|
|
//#ifndef H5
|
|
_this.vxshow = true;
|
|
//#endif
|
|
|
|
}
|
|
});
|
|
},
|
|
goLocation(){
|
|
let _this = this;
|
|
_this.upimg = true;
|
|
// #ifdef MP-WEIXIN
|
|
uni.chooseLocation({
|
|
keyword: '',
|
|
success: function(e) {
|
|
let bilis = {
|
|
detailed_address:e.address,
|
|
lat:e.latitude,
|
|
lng:e.longitude
|
|
};
|
|
_this.site = e.address;
|
|
_this.lat = e.latitude;
|
|
_this.lng = e.longitude;
|
|
}
|
|
});
|
|
// #endif
|
|
// #ifdef H5
|
|
_this.isOpenLaction = true;
|
|
// #endif
|
|
//#ifdef APP-PLUS
|
|
App.navigationTo({
|
|
url: 'pages/subPages2/map/index'
|
|
});
|
|
//#endif
|
|
},
|
|
deletImg(index){
|
|
this.imglinks.splice(index,1)
|
|
},
|
|
openTime(){
|
|
this.visibletimeone = true;
|
|
},
|
|
openlink(){
|
|
this.visible = true;
|
|
},
|
|
Change(e){
|
|
console.log(e);
|
|
this.index = e.detail.value;
|
|
},
|
|
bindTimeChangeStar(e){
|
|
console.log(e);
|
|
// debugger
|
|
this.time = e.result
|
|
},
|
|
onCancel(){
|
|
|
|
},
|
|
uplodephone(length,localIds){
|
|
let _this = this;
|
|
wxApi.uoloadIg(localIds[length], data => {
|
|
if (data.errMsg === 'uploadImage:ok') {
|
|
uni.showLoading({});
|
|
let requestData = {
|
|
upload_type: 2,
|
|
id: data.serverId
|
|
};
|
|
App._post_form(
|
|
'&do=uploadFiles',
|
|
requestData,
|
|
res => {
|
|
if (res.errno === 0) {
|
|
let num = length + 1;
|
|
_this.imglinks.push(res.data.img);
|
|
if(num < _this.uploadlength){
|
|
uni.setTimeout(_this.uplodephone(num,_this.localIds),500);
|
|
}
|
|
}
|
|
},
|
|
false,
|
|
() => {
|
|
|
|
uni.hideLoading();
|
|
}
|
|
);
|
|
} else {
|
|
uni.hideLoading();
|
|
App.showError('上传失败');
|
|
}
|
|
});
|
|
|
|
},
|
|
// 文件上传接口
|
|
async uploadFiles(type, num) {
|
|
let _this = this;
|
|
_this.upimg = true;
|
|
// _this.uoloadIgs(i, 0, res, type);
|
|
// #ifdef H5
|
|
if(App.getClientType() == 2){
|
|
let res = await App.browser_upload(num);
|
|
for (let i = 0; i < res.tempFilePaths.length; i++) {
|
|
let aa = await App._upLoad(res.tempFilePaths[i]);
|
|
if (type == 2) {
|
|
_this.imglinks.push(aa.data.img);
|
|
// _this.userInfo.thumbs.push(aa.data.image);
|
|
console.log(_this.imglinks,aa.data.img);
|
|
}
|
|
}
|
|
return
|
|
}
|
|
wxApi.choseImage(res => {
|
|
// let length
|
|
_this.localIds = res.localIds;
|
|
_this.uploadlength = res.localIds.length;
|
|
_this.uplodephone(0,_this.localIds);
|
|
},5);
|
|
// #endif
|
|
// #ifndef H5
|
|
wx.chooseImage({
|
|
count: 5,
|
|
sourceType: ['album', 'camera'],
|
|
success: async function(res) {
|
|
// console.log(_this.userInfo.havestore, _this.page, '-------');
|
|
for (let i = 0; i < res.tempFilePaths.length; i++) {
|
|
let aa = await App._upLoad(res.tempFilePaths[i]);
|
|
if (type == 2) {
|
|
_this.imglinks.push(aa.data.img);
|
|
// _this.userInfo.thumbs.push(aa.data.image);
|
|
console.log(_this.imglinks,aa.data.img);
|
|
}
|
|
}
|
|
}
|
|
});
|
|
// #endif
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.postDemand{
|
|
padding-bottom: 100upx;
|
|
.line{
|
|
height: 20upx;
|
|
background-color: #F8F8F8;
|
|
}
|
|
.requirement{
|
|
padding: 30upx;
|
|
.text{
|
|
padding: 20upx 0;
|
|
.textarea{
|
|
width: 100%;
|
|
height: 160upx;
|
|
font-size: 28upx;
|
|
}
|
|
}
|
|
}
|
|
.issue{
|
|
width: 750upx;
|
|
height: 90upx;
|
|
background: linear-gradient(360deg, #6094FD 0%, #70A8FD 100%);
|
|
line-height: 90upx;
|
|
position: fixed;
|
|
bottom: 0;
|
|
left: 0;
|
|
text-align: center;
|
|
font-size: 32upx;
|
|
color: #FFFFFF;
|
|
font-weight: bold;
|
|
border-radius: 30upx 30upx 0 0;
|
|
}
|
|
.uploading{
|
|
padding: 30upx;
|
|
.imgs{
|
|
padding: 30upx 0;
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
align-content: flex-center;
|
|
align-items: center;
|
|
justify-content: left;
|
|
.img-item{
|
|
height: 158upx;
|
|
border-radius: 20upx;
|
|
flex: auto;
|
|
margin: 10upx;
|
|
width: 158upx;
|
|
min-width: 158upx;
|
|
max-width: 158upx;
|
|
position: relative;
|
|
image{
|
|
width: 100%;
|
|
height: 100%;
|
|
border-radius: 20upx;
|
|
}
|
|
.imgclise{
|
|
width: 30upx;
|
|
height: 30upx;
|
|
position: absolute;
|
|
right: 10upx;
|
|
top: 10upx;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.formItem{
|
|
padding: 0 30upx;
|
|
|
|
.menu-item{
|
|
display: flex;
|
|
padding: 30upx 0;
|
|
border-bottom: 1upx solid #EEEEEE;
|
|
.menu-name{
|
|
font-size: 28upx;
|
|
color: #333333;
|
|
width: 130upx;
|
|
padding-right: 50upx;
|
|
}
|
|
.menu-content{
|
|
font-size: 28upx;
|
|
color: #333333;
|
|
.menu-input{
|
|
height: 100%;
|
|
font-size: 28upx;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.p-t-30{
|
|
padding-top: 30upx;
|
|
}
|
|
}
|
|
</style>
|
|
|