hehang
2 years ago
parent
2b378a51c7
commit
f00b7111a9
@ -1,332 +1,332 @@ |
||||
<template> |
||||
<view class="v-page"> |
||||
<view class="v-card contain" style="padding-bottom: 120rpx;"> |
||||
<evan-form ref="form" :hide-required-asterisk="hideRequiredAsterisk" :model="info"> |
||||
<view class="v-card-item"> |
||||
<view class="v-card-box"> |
||||
<common-title :title="'基本信息'"></common-title> |
||||
<evan-form-item label="资源名称："> |
||||
<input v-model="info.resourceName" class="form-input" placeholder="请输入资源名称" |
||||
placeholder-class="form-input-placeholder" /> |
||||
</evan-form-item> |
||||
<evan-form-item label="是否推荐："> |
||||
<uni-data-checkbox v-model="info.ifRecommend" :localdata="range"></uni-data-checkbox> |
||||
</evan-form-item> |
||||
<evan-form-item label="景点排序："> |
||||
<uni-number-box v-model="vModelValue" @blur="blur" @focus="focus" @change="changeValue" /> |
||||
</evan-form-item> |
||||
<evan-form-item label="开放时间："> |
||||
<!-- <uni-datetime-picker v-model="info.openTime" type="timerange" rangeSeparator="至" /> --> |
||||
<picker class="time-picker" mode="time" :value="startTime" start="00:00" end="23:59" |
||||
@change="bindTimeChange"> |
||||
<view class="uni-input">{{ startTime }}</view> |
||||
</picker> |
||||
- |
||||
<picker class="time-picker" mode="time" :value="endTime" start="00:00" end="23:59" |
||||
@change="bindTimeChange1"> |
||||
<view class="uni-input">{{ endTime }}</view> |
||||
</picker> |
||||
</evan-form-item> |
||||
</view> |
||||
</view> |
||||
<view class="v-card-item"> |
||||
<view class="v-card-box"> |
||||
<common-title :title="'资源简介'"></common-title> |
||||
<textarea class="area-text" v-model="info.introduction" auto-height /> |
||||
</view> |
||||
</view> |
||||
<view class="v-card-item"> |
||||
<view class="v-card-box"> |
||||
<common-title :title="'资源描述'"></common-title> |
||||
<textarea class="area-text" v-model="info.resourceDescribe" |
||||
auto-height /> |
||||
</view> |
||||
</view> |
||||
<view class="v-card-item"> |
||||
<view class="v-card-box"> |
||||
<common-title :title="'图片'"></common-title> |
||||
<w-upload ref="wUpload" :token="token" :imgShow="imgShow" :requestUrl="requestUrl" |
||||
:imgType="imgType" @updateImgList="updateImgList" :imgList="imgList" |
||||
@imgSuccess="imgSuccess"></w-upload> |
||||
</view> |
||||
</view> |
||||
<view class="v-card-item"> |
||||
<view class="v-card-box"> |
||||
<common-title :title="'语音讲解'"></common-title> |
||||
<audio-upload :url="info.mp3Url" @fileSuccess="fileSuccess"></audio-upload> |
||||
</view> |
||||
</view> |
||||
</evan-form> |
||||
<view class="v-page-button contain"> |
||||
<button class="v-btn-large" @click="save">保存</button> |
||||
</view> |
||||
<view class="v-page"> |
||||
<view class="v-card contain" style="padding-bottom: 120rpx;"> |
||||
<evan-form ref="form" :hide-required-asterisk="hideRequiredAsterisk" :model="info"> |
||||
<view class="v-card-item"> |
||||
<view class="v-card-box"> |
||||
<common-title :title="'基本信息'"></common-title> |
||||
<evan-form-item label="资源名称："> |
||||
<input v-model="info.resourceName" class="form-input" placeholder="请输入资源名称" |
||||
placeholder-class="form-input-placeholder" /> |
||||
</evan-form-item> |
||||
<evan-form-item label="是否推荐："> |
||||
<uni-data-checkbox v-model="info.ifRecommend" :localdata="range"></uni-data-checkbox> |
||||
</evan-form-item> |
||||
<evan-form-item label="景点排序："> |
||||
<uni-number-box v-model="vModelValue" @blur="blur" @focus="focus" @change="changeValue" /> |
||||
</evan-form-item> |
||||
<evan-form-item label="开放时间："> |
||||
<!-- <uni-datetime-picker v-model="info.openTime" type="timerange" rangeSeparator="至" /> --> |
||||
<picker class="time-picker" mode="time" :value="startTime" start="00:00" end="23:59" |
||||
@change="bindTimeChange"> |
||||
<view class="uni-input">{{ startTime }}</view> |
||||
</picker> |
||||
- |
||||
<picker class="time-picker" mode="time" :value="endTime" start="00:00" end="23:59" |
||||
@change="bindTimeChange1"> |
||||
<view class="uni-input">{{ endTime }}</view> |
||||
</picker> |
||||
</evan-form-item> |
||||
</view> |
||||
</view> |
||||
<view class="v-card-item"> |
||||
<view class="v-card-box"> |
||||
<common-title :title="'资源简介'"></common-title> |
||||
<textarea class="area-text" v-model="info.introduction" auto-height /> |
||||
</view> |
||||
</view> |
||||
<view class="v-card-item"> |
||||
<view class="v-card-box"> |
||||
<common-title :title="'资源描述'"></common-title> |
||||
<textarea class="area-text" v-model="info.resourceDescribe" |
||||
auto-height /> |
||||
</view> |
||||
</view> |
||||
<view class="v-card-item"> |
||||
<view class="v-card-box"> |
||||
<common-title :title="'图片'"></common-title> |
||||
<w-upload ref="wUpload" :token="token" :imgShow="imgShow" :requestUrl="requestUrl" |
||||
:imgType="imgType" @updateImgList="updateImgList" :imgList="imgList" |
||||
@imgSuccess="imgSuccess"></w-upload> |
||||
</view> |
||||
</view> |
||||
<view class="v-card-item"> |
||||
<view class="v-card-box"> |
||||
<common-title :title="'语音讲解'"></common-title> |
||||
<audio-upload :url="info.mp3Url" @fileSuccess="fileSuccess"></audio-upload> |
||||
</view> |
||||
</view> |
||||
</evan-form> |
||||
<view class="v-page-button contain"> |
||||
<button class="v-btn-large" @click="save">保存</button> |
||||
</view> |
||||
|
||||
|
||||
</view> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
</template> |
||||
|
||||
<script> |
||||
import { |
||||
scenicSpotById, |
||||
updateScenicSpotSortList |
||||
} from '@/api/word/attractionsEditor.js' |
||||
import audioUpload from '@/components/audio-unpload/audioUpload.vue'; |
||||
import wUpload from '@/components/file-img-upload/w-upload.vue'; |
||||
import { |
||||
getToken |
||||
} from '@/utils/auth.js'; |
||||
import config from '@/config.js'; |
||||
const baseUrl = config.baseUrl; |
||||
import { |
||||
scenicSpotById, |
||||
updateScenicSpotSortList |
||||
} from '@/api/word/attractionsEditor.js' |
||||
import audioUpload from '@/components/audio-unpload/audioUpload.vue'; |
||||
import wUpload from '@/components/file-img-upload/w-upload.vue'; |
||||
import { |
||||
getToken |
||||
} from '@/utils/auth.js'; |
||||
import config from '@/config.js'; |
||||
const baseUrl = config.baseUrl; |
||||
|
||||
export default { |
||||
components: { |
||||
audioUpload, |
||||
wUpload |
||||
}, |
||||
data() { |
||||
return { |
||||
star: null, |
||||
range: [{ |
||||
value: 0, |
||||
text: '是' |
||||
}, |
||||
{ |
||||
value: 1, |
||||
text: '否' |
||||
} |
||||
], |
||||
startTime: '00:00', |
||||
endTime: '00:00', |
||||
token: '', |
||||
imgShow: true, |
||||
requestUrl: baseUrl + '/common/upload', |
||||
imgType: 'jpg,png,gif', |
||||
imgList: [], |
||||
hideRequiredAsterisk: false, |
||||
vModelValue: 1, |
||||
id: 0, |
||||
info: { |
||||
id: 24, |
||||
ifRecommend: 0, |
||||
resourceCode: 751783303501053953, |
||||
resourceName: '达摩院', |
||||
openTime: '', |
||||
scenicArea: '少林景区', |
||||
introduction: '简介', |
||||
resourceDescribe: '描述', |
||||
imageUrl: '', |
||||
mp3Url: '', |
||||
videoUrl: '', |
||||
sort: '' |
||||
} |
||||
}; |
||||
}, |
||||
export default { |
||||
components: { |
||||
audioUpload, |
||||
wUpload |
||||
}, |
||||
data() { |
||||
return { |
||||
star: null, |
||||
range: [{ |
||||
value: 0, |
||||
text: '是' |
||||
}, |
||||
{ |
||||
value: 1, |
||||
text: '否' |
||||
} |
||||
], |
||||
startTime: '00:00', |
||||
endTime: '00:00', |
||||
token: '', |
||||
imgShow: true, |
||||
requestUrl: baseUrl + '/common/upload', |
||||
imgType: 'jpg,png,gif', |
||||
imgList: [], |
||||
hideRequiredAsterisk: false, |
||||
vModelValue: 1, |
||||
id: 0, |
||||
info: { |
||||
id: 24, |
||||
ifRecommend: 0, |
||||
resourceCode: 751783303501053953, |
||||
resourceName: '达摩院', |
||||
openTime: '', |
||||
scenicArea: '少林景区', |
||||
introduction: '简介', |
||||
resourceDescribe: '描述', |
||||
imageUrl: '', |
||||
mp3Url: '', |
||||
videoUrl: '', |
||||
sort: '' |
||||
} |
||||
}; |
||||
}, |
||||
|
||||
|
||||
onShow() { |
||||
this.token = getToken(); |
||||
onShow() { |
||||
this.token = getToken(); |
||||
|
||||
console.log(this.token); |
||||
}, |
||||
onLoad(option) { |
||||
console.log(option) |
||||
this.id = option.id |
||||
this.scenicSpotById(this.id); |
||||
}, |
||||
mounted() { |
||||
this.$refs.form.setRules(this.rules); |
||||
// 数据转换 |
||||
var arr = []; |
||||
if (this.classDataTree && this.classDataTree.length > 0) { |
||||
this.classDataTree.forEach((item) => { |
||||
console.log(item); |
||||
var obj = { |
||||
text: item.classificationName, |
||||
value: item.classificationCode, |
||||
children: [] |
||||
}; |
||||
if (item.list && item.list.length > 0) { |
||||
item.list.forEach((sonItem) => { |
||||
var sonObj = { |
||||
text: sonItem.classificationName, |
||||
value: sonItem.classificationCode |
||||
}; |
||||
console.log(this.token); |
||||
}, |
||||
onLoad(option) { |
||||
console.log(option) |
||||
this.id = option.id |
||||
this.scenicSpotById(this.id); |
||||
}, |
||||
mounted() { |
||||
this.$refs.form.setRules(this.rules); |
||||
// 数据转换 |
||||
var arr = []; |
||||
if (this.classDataTree && this.classDataTree.length > 0) { |
||||
this.classDataTree.forEach((item) => { |
||||
console.log(item); |
||||
var obj = { |
||||
text: item.classificationName, |
||||
value: item.classificationCode, |
||||
children: [] |
||||
}; |
||||
if (item.list && item.list.length > 0) { |
||||
item.list.forEach((sonItem) => { |
||||
var sonObj = { |
||||
text: sonItem.classificationName, |
||||
value: sonItem.classificationCode |
||||
}; |
||||
|
||||
obj.children.push(sonObj); |
||||
}); |
||||
} |
||||
arr.push(obj); |
||||
}); |
||||
} |
||||
obj.children.push(sonObj); |
||||
}); |
||||
} |
||||
arr.push(obj); |
||||
}); |
||||
} |
||||
|
||||
this.classDataTree = arr; |
||||
}, |
||||
methods: { |
||||
// 返回被删除的图片和索引号 |
||||
updateImgList(val) { |
||||
console.log(val); |
||||
this.imgList.forEach((i, j) => { |
||||
if (j == val[0]) { |
||||
this.imgList.splice(j, 1); |
||||
this.$forceUpdate(); //强制更新视图 |
||||
} |
||||
}); |
||||
}, |
||||
// 返回上传成功的图片信息 |
||||
imgSuccess(val) { |
||||
console.log(val); |
||||
this.imgList.push(val); |
||||
this.$forceUpdate(); //强制更新视图 |
||||
}, |
||||
this.classDataTree = arr; |
||||
}, |
||||
methods: { |
||||
// 返回被删除的图片和索引号 |
||||
updateImgList(val) { |
||||
console.log(val); |
||||
this.imgList.forEach((i, j) => { |
||||
if (j == val[0]) { |
||||
this.imgList.splice(j, 1); |
||||
this.$forceUpdate(); //强制更新视图 |
||||
} |
||||
}); |
||||
}, |
||||
// 返回上传成功的图片信息 |
||||
imgSuccess(val) { |
||||
console.log(val); |
||||
this.imgList.push(val); |
||||
this.$forceUpdate(); //强制更新视图 |
||||
}, |
||||
|
||||
bindTimeChange(e) { |
||||
let this_ = this |
||||
console.log(this_.info) |
||||
this_.startTime = e.detail.value; |
||||
this_.info.openTime = this_.startTime + "-" + this_.endTime |
||||
console.log(this_.info.openTime) |
||||
}, |
||||
bindTimeChange1(e) { |
||||
let this_ = this |
||||
console.log(this_.info) |
||||
this_.endTime = e.detail.value; |
||||
this_.info.openTime = this_.startTime + "-" + this_.endTime |
||||
console.log(this_.info.openTime) |
||||
}, |
||||
changeLog(e) { |
||||
console.log('change事件:', e); |
||||
}, |
||||
onnodeclick(e) { |
||||
console.log('nodeclick', e); |
||||
}, |
||||
onpopupopened(e) { |
||||
console.log('onpopupopened'); |
||||
}, |
||||
onpopupclosed(e) { |
||||
console.log('onpopupclosed'); |
||||
}, |
||||
onchange(e) { |
||||
console.log('onchange', e.detail.value); |
||||
}, |
||||
inputclick(e) { |
||||
console.log('inputclick'); |
||||
}, |
||||
getLocation() { |
||||
uni.navigateTo({ |
||||
url: 'map' |
||||
}); |
||||
}, |
||||
onnodeclick(e) { |
||||
console.log('nodeclick', e); |
||||
}, |
||||
onpopupopened(e) { |
||||
console.log('onpopupopened'); |
||||
}, |
||||
onpopupclosed(e) { |
||||
console.log('onpopupclosed'); |
||||
}, |
||||
onchange(e) { |
||||
console.log('onchange', e.detail.value); |
||||
}, |
||||
inputclick(e) { |
||||
console.log('inputclick'); |
||||
}, |
||||
getLocation() { |
||||
uni.navigateTo({ |
||||
url: 'map' |
||||
}); |
||||
}, |
||||
bindTimeChange(e) { |
||||
let this_ = this |
||||
console.log(this_.info) |
||||
this_.startTime = e.detail.value; |
||||
this_.info.openTime = this_.startTime + "-" + this_.endTime |
||||
console.log(this_.info.openTime) |
||||
}, |
||||
bindTimeChange1(e) { |
||||
let this_ = this |
||||
console.log(this_.info) |
||||
this_.endTime = e.detail.value; |
||||
this_.info.openTime = this_.startTime + "-" + this_.endTime |
||||
console.log(this_.info.openTime) |
||||
}, |
||||
changeLog(e) { |
||||
console.log('change事件:', e); |
||||
}, |
||||
onnodeclick(e) { |
||||
console.log('nodeclick', e); |
||||
}, |
||||
onpopupopened(e) { |
||||
console.log('onpopupopened'); |
||||
}, |
||||
onpopupclosed(e) { |
||||
console.log('onpopupclosed'); |
||||
}, |
||||
onchange(e) { |
||||
console.log('onchange', e.detail.value); |
||||
}, |
||||
inputclick(e) { |
||||
console.log('inputclick'); |
||||
}, |
||||
getLocation() { |
||||
uni.navigateTo({ |
||||
url: 'map' |
||||
}); |
||||
}, |
||||
onnodeclick(e) { |
||||
console.log('nodeclick', e); |
||||
}, |
||||
onpopupopened(e) { |
||||
console.log('onpopupopened'); |
||||
}, |
||||
onpopupclosed(e) { |
||||
console.log('onpopupclosed'); |
||||
}, |
||||
onchange(e) { |
||||
console.log('onchange', e.detail.value); |
||||
}, |
||||
inputclick(e) { |
||||
console.log('inputclick'); |
||||
}, |
||||
getLocation() { |
||||
uni.navigateTo({ |
||||
url: 'map' |
||||
}); |
||||
}, |
||||
|
||||
changeValue(value) { |
||||
console.log('返回数值：', value); |
||||
}, |
||||
blur(e) { |
||||
console.log('blur:', e); |
||||
}, |
||||
focus(e) { |
||||
console.log('focus:', e); |
||||
}, |
||||
changeValue(value) { |
||||
console.log('返回数值：', value); |
||||
}, |
||||
blur(e) { |
||||
console.log('blur:', e); |
||||
}, |
||||
focus(e) { |
||||
console.log('focus:', e); |
||||
}, |
||||
|
||||
save() { |
||||
let this_ = this; |
||||
this_.info.openTime = this_.startTime + "-" + this_.endTime |
||||
this_.info.imageUrl = this_.imgList.join(","); |
||||
this_.info.sort = this_.vModelValue; |
||||
this.$refs.form.validate((res) => { |
||||
if (res) { |
||||
updateScenicSpotSortList(this.info).then(res => { |
||||
if (res.code == 200) { |
||||
uni.showToast({ |
||||
title: '编辑成功' |
||||
}); |
||||
} |
||||
setTimeout(() => { |
||||
uni.navigateTo({ |
||||
url: '/pages/work/scenicSpot/scenicSpot' |
||||
}) |
||||
}, 500) |
||||
}) |
||||
save() { |
||||
let this_ = this; |
||||
this_.info.openTime = this_.startTime + "-" + this_.endTime |
||||
this_.info.imageUrl = this_.imgList.join(","); |
||||
this_.info.sort = this_.vModelValue; |
||||
this.$refs.form.validate((res) => { |
||||
if (res) { |
||||
updateScenicSpotSortList(this.info).then(res => { |
||||
if (res.code == 200) { |
||||
uni.showToast({ |
||||
title: '编辑成功' |
||||
}); |
||||
} |
||||
setTimeout(() => { |
||||
uni.navigateTo({ |
||||
url: '/pages/work/scenicSpot/scenicSpot' |
||||
}) |
||||
}, 500) |
||||
}) |
||||
|
||||
} |
||||
}); |
||||
}, |
||||
scenicSpotById(val) { |
||||
scenicSpotById(val).then(res => { |
||||
console.log(res) |
||||
this.info = res.data |
||||
this.startTime = res.data.openTime.split('-')[0] |
||||
this.endTime = res.data.openTime.split('-')[1] |
||||
this.info.ifRecommend = Number(res.data.ifRecommend) |
||||
this.vModelValue = res.data.sort |
||||
this.imgList = this.info.imageUrl.split(","); |
||||
}) |
||||
}, |
||||
fileSuccess(val) { |
||||
if (val) { |
||||
console.log(val); |
||||
} |
||||
} |
||||
} |
||||
}; |
||||
} |
||||
}); |
||||
}, |
||||
scenicSpotById(val) { |
||||
scenicSpotById(val).then(res => { |
||||
console.log(res) |
||||
this.info = res.data |
||||
this.startTime = res.data.openTime.split('-')[0] |
||||
this.endTime = res.data.openTime.split('-')[1] |
||||
this.info.ifRecommend = Number(res.data.ifRecommend) |
||||
this.vModelValue = res.data.sort |
||||
this.imgList = this.info.imageUrl.split(","); |
||||
}) |
||||
}, |
||||
fileSuccess(val) { |
||||
if (val) { |
||||
console.log(val); |
||||
} |
||||
} |
||||
} |
||||
}; |
||||
</script> |
||||
|
||||
<style lang="scss" scoped> |
||||
.uni-input-placeholder { |
||||
font-size: 24rpx; |
||||
} |
||||
.uni-input-placeholder { |
||||
font-size: 24rpx; |
||||
} |
||||
|
||||
.set-position { |
||||
position: absolute; |
||||
right: 20rpx; |
||||
} |
||||
.set-position { |
||||
position: absolute; |
||||
right: 20rpx; |
||||
} |
||||
|
||||
.form-input { |
||||
width: 95%; |
||||
} |
||||
.form-input { |
||||
width: 95%; |
||||
} |
||||
|
||||
.tree-pick { |
||||
width: 95%; |
||||
} |
||||
.tree-pick { |
||||
width: 95%; |
||||
} |
||||
|
||||
::v-deep .evan-form-item-container__label { |
||||
padding-left: 20rpx; |
||||
text-align-last: unset; |
||||
width: 22%; |
||||
} |
||||
::v-deep .evan-form-item-container__label { |
||||
padding-left: 20rpx; |
||||
text-align-last: unset; |
||||
width: 22%; |
||||
} |
||||
|
||||
.title-pic { |
||||
padding: 10px 15px; |
||||
color: #4d4d4d; |
||||
} |
||||
.title-pic { |
||||
padding: 10px 15px; |
||||
color: #4d4d4d; |
||||
} |
||||
|
||||
.area-text { |
||||
height: auto; |
||||
width: 90%; |
||||
min-height: 50rpx; |
||||
margin: 0 5%; |
||||
padding: 10rpx; |
||||
border-radius: 10rpx; |
||||
background-color: #f3f3f3; |
||||
} |
||||
.area-text { |
||||
height: auto; |
||||
width: 90%; |
||||
min-height: 50rpx; |
||||
margin: 0 5%; |
||||
padding: 10rpx; |
||||
border-radius: 10rpx; |
||||
background-color: #f3f3f3; |
||||
} |
||||
</style> |
||||
|
||||
Loading…
Reference in new issue