旅游攻略
This commit is contained in:
liuye
@@ -1,189 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div class="AppAiInput">
|
|
||||||
<div class="content-info" v-if="text">{{text}}</div>
|
|
||||||
<div class="problem-list">
|
|
||||||
<p class="title">请一句话告诉我这些信息：</p>
|
|
||||||
<div class="list-content">
|
|
||||||
<p>“您排查的户主姓名”</p>
|
|
||||||
<p>“户主的性别”</p>
|
|
||||||
<p>“户主的联系电话”</p>
|
|
||||||
<p>“户主的出生日期”</p>
|
|
||||||
<p>“户主的民族”</p>
|
|
||||||
<p>“户主家里的家庭人口数”</p>
|
|
||||||
<p>“我要上报的事情”</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="microphone-info">
|
|
||||||
<p class="loading" v-if="isStart">语音录制中...</p>
|
|
||||||
<div class="microphone-img" @touchstart="start" @touchend="end">
|
|
||||||
<!-- <img src="./img/microphone.png" alt="" @longpress=""> -->
|
|
||||||
<u-icon name="mic" color="#fff" size="140" style="margin-top:20px;"></u-icon>
|
|
||||||
</div>
|
|
||||||
<p class="text">{{isStart ? '松开结束说话' : '按住说话'}}</p>
|
|
||||||
<!-- <div class="btn">
|
|
||||||
<p class="cancel" @click="cancel">取消</p>
|
|
||||||
<p class="confirm" @click="confirm" v-if="text">确定</p>
|
|
||||||
</div> -->
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
import {mapState, mapActions} from "vuex";
|
|
||||||
export default {
|
|
||||||
name: 'AppAiInput',
|
|
||||||
appName: '百度AI输入',
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
isStart: false,
|
|
||||||
text: ''
|
|
||||||
}
|
|
||||||
},
|
|
||||||
computed: {
|
|
||||||
...mapState(['user']),
|
|
||||||
},
|
|
||||||
onLoad() {
|
|
||||||
this.text = ''
|
|
||||||
this.injectJWeixin(['startRecord','stopRecord', 'translateVoice'])
|
|
||||||
},
|
|
||||||
onShow() {
|
|
||||||
this.text = ''
|
|
||||||
document.title = '巡查上报'
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
...mapActions(['injectJWeixin']),
|
|
||||||
start() {
|
|
||||||
wx.startRecord()
|
|
||||||
this.isStart = true
|
|
||||||
},
|
|
||||||
end() {
|
|
||||||
this.isStart = false
|
|
||||||
wx.stopRecord({
|
|
||||||
success: (res)=> {
|
|
||||||
wx.translateVoice({
|
|
||||||
localId: res.localId, // 需要识别的音频的本地Id，由录音相关接口获得，音频时长不能超过60秒
|
|
||||||
isShowProgressTips: 1, // 默认为1，显示进度提示
|
|
||||||
success: (e)=> {
|
|
||||||
this.text = this.text + e.translateResult // 语音识别的结果
|
|
||||||
this.confirm()
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
|
||||||
},
|
|
||||||
confirm() {
|
|
||||||
uni.navigateTo({url: `./formEdit?word=${this.text}`})
|
|
||||||
},
|
|
||||||
cancel() {
|
|
||||||
wx.stopRecord()
|
|
||||||
this.text = ''
|
|
||||||
}
|
|
||||||
},
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
|
||||||
uni-page-body {
|
|
||||||
min-height: 100%;
|
|
||||||
// height: 100vh;
|
|
||||||
padding-top: 32px;
|
|
||||||
background: #fff;
|
|
||||||
}
|
|
||||||
.AppAiInput {
|
|
||||||
.content-info {
|
|
||||||
margin: 0 0 32px 32px;
|
|
||||||
width: 686px;
|
|
||||||
height: 272px;
|
|
||||||
background-image: linear-gradient(157deg, #F7FAFD 2%, #EDF6FF 99%);
|
|
||||||
border-radius: 16px;
|
|
||||||
padding: 24px 28px 28px 28px;
|
|
||||||
font-family: PingFangSC-Regular;
|
|
||||||
font-size: 28px;
|
|
||||||
color: #222;
|
|
||||||
box-sizing: border-box;
|
|
||||||
overflow-y: scroll;
|
|
||||||
}
|
|
||||||
.problem-list {
|
|
||||||
margin: 0 0 32px 32px;
|
|
||||||
width: 686px;
|
|
||||||
background: #F5F6F8;
|
|
||||||
border-radius: 16px;
|
|
||||||
padding: 28px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
.title {
|
|
||||||
line-height: 44px;
|
|
||||||
font-family: PingFangSC-Medium;
|
|
||||||
font-weight: 500;
|
|
||||||
font-size: 32px;
|
|
||||||
color: #6C768A;
|
|
||||||
text-align: center;
|
|
||||||
margin-bottom: 28px;
|
|
||||||
}
|
|
||||||
.list-content {
|
|
||||||
width: 630px;
|
|
||||||
background: #FFF;
|
|
||||||
border-radius: 12px;
|
|
||||||
overflow-y: scroll;
|
|
||||||
padding: 28px;
|
|
||||||
text-align: center;
|
|
||||||
box-sizing: border-box;
|
|
||||||
p {
|
|
||||||
font-family: PingFangSC-Regular;
|
|
||||||
font-size: 28px;
|
|
||||||
color: #222;
|
|
||||||
line-height: 56px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.microphone-info {
|
|
||||||
position: fixed;
|
|
||||||
bottom: 48px;
|
|
||||||
left: 0;
|
|
||||||
width: 100%;
|
|
||||||
text-align: center;
|
|
||||||
.microphone-img {
|
|
||||||
width: 216px;
|
|
||||||
height: 216px;
|
|
||||||
border-radius: 50%;
|
|
||||||
background-image: linear-gradient(180deg, #0262F2 25%, #148AFF 99%);
|
|
||||||
text-align: center;
|
|
||||||
margin-left: 272px;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
img {
|
|
||||||
width: 68px;
|
|
||||||
height: 96px;
|
|
||||||
margin-top: 62px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.text {
|
|
||||||
font-family: PingFangSC-Regular;
|
|
||||||
font-size: 36px;
|
|
||||||
color: #222;
|
|
||||||
margin-bottom: 64px;
|
|
||||||
}
|
|
||||||
.loading {
|
|
||||||
font-family: PingFangSC-Regular;
|
|
||||||
font-size: 28px;
|
|
||||||
color: #666;
|
|
||||||
margin-bottom: 32px;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
.btn {
|
|
||||||
text-align: center;
|
|
||||||
font-family: PingFangSC-Regular;
|
|
||||||
font-size: 36px;
|
|
||||||
p {
|
|
||||||
display: inline-block;
|
|
||||||
}
|
|
||||||
.cancel {
|
|
||||||
color: #999;
|
|
||||||
}
|
|
||||||
.confirm {
|
|
||||||
color: #0262F2;
|
|
||||||
margin-left: 120px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@@ -1,258 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div class="formConfirm">
|
|
||||||
<div class="list-content">
|
|
||||||
<div class="item">
|
|
||||||
<span class="tips">*</span>
|
|
||||||
<div class="item-border">
|
|
||||||
<div class="label">户主姓名</div>
|
|
||||||
<div class="value">
|
|
||||||
<u-input type="text" class="right" placeholder="请输入" height="44" input-align="right" v-model="info.name"></u-input>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="item">
|
|
||||||
<span class="tips">*</span>
|
|
||||||
<div class="item-border">
|
|
||||||
<div class="label">性别</div>
|
|
||||||
<div class="value" @click="showSex=true">
|
|
||||||
<span :class="info.sex == null ? 'color-999' : ''">{{ $dict.getLabel('sex', info.sex) || '请选择'}}</span>
|
|
||||||
<img src="./img/arrow-right.png" alt="">
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="item">
|
|
||||||
<span class="tips">*</span>
|
|
||||||
<div class="item-border">
|
|
||||||
<div class="label">联系电话</div>
|
|
||||||
<div class="value">
|
|
||||||
<u-input type="text" class="right" placeholder="请输入" height="44" input-align="right" v-model="info.phone"></u-input>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="item">
|
|
||||||
<span class="tips">*</span>
|
|
||||||
<div class="item-border">
|
|
||||||
<div class="label">出生日期</div>
|
|
||||||
<div class="value" @click="showDate=true">
|
|
||||||
<span :class="info.birthday == null ? 'color-999' : ''">{{ info.birthday || '请选择'}}</span>
|
|
||||||
<img src="./img/arrow-right.png" alt="">
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="item">
|
|
||||||
<span class="tips">*</span>
|
|
||||||
<div class="item-border">
|
|
||||||
<div class="label">民族</div>
|
|
||||||
<div class="value" @click="showNation=true">
|
|
||||||
<span :class="info.nation == null ? 'color-999' : ''">{{ $dict.getLabel('nation', info.nation) || '请选择'}}</span>
|
|
||||||
<img src="./img/arrow-right.png" alt="">
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="item">
|
|
||||||
<span class="tips">*</span>
|
|
||||||
<div class="item-border">
|
|
||||||
<div class="label">家庭人口数</div>
|
|
||||||
<div class="value">
|
|
||||||
<u-input type="text" class="right" placeholder="请输入" height="44" input-align="right" v-model="info.householdNumber"></u-input>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="item">
|
|
||||||
<span class="tips">*</span>
|
|
||||||
<div class="text-label">
|
|
||||||
<div class="label">我要上报的事情</div>
|
|
||||||
</div>
|
|
||||||
<div class="text-value">
|
|
||||||
<u-input type="textarea" placeholder="请输入" :height="300" input-align="left" v-model="info.reportThing" :clearable="false" maxlength="500"></u-input>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="bottom-btn">
|
|
||||||
<!-- <div class="confirm" @click="confirm('保存成功')">保存内容</div> -->
|
|
||||||
<div class="confirm" @click="confirm('提交成功')">提交</div>
|
|
||||||
<div class="cancel" @click="back">返回录制</div>
|
|
||||||
</div>
|
|
||||||
<u-picker mode="time" v-model="showDate" :params="deteParams" start-year="1930" @confirm="dateConfirm">请选择</u-picker>
|
|
||||||
<u-select v-model="showSex" :list="$dict.getDict('sex')" label-name="dictName" value-name="dictValue" @confirm="confirmSex"/>
|
|
||||||
<u-select v-model="showNation" :list="$dict.getDict('nation')" label-name="dictName" value-name="dictValue" @confirm="confirmNation"/>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
import {mapState} from "vuex";
|
|
||||||
|
|
||||||
export default {
|
|
||||||
name: 'formConfirm',
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
word: '',
|
|
||||||
info: {},
|
|
||||||
showSex: false,
|
|
||||||
showNation: false,
|
|
||||||
showDate: false,
|
|
||||||
deteParams: {year: true, month: true, day: true, hour: false, minute: false, second: false},
|
|
||||||
}
|
|
||||||
},
|
|
||||||
computed: {
|
|
||||||
...mapState(['user']),
|
|
||||||
},
|
|
||||||
onLoad(option) {
|
|
||||||
this.info = JSON.parse(option.info)
|
|
||||||
this.$dict.load('sex', 'nation').then(() => {
|
|
||||||
// this.getInfo()
|
|
||||||
})
|
|
||||||
},
|
|
||||||
onShow() {
|
|
||||||
document.title = '巡查上报'
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
getInfo() {
|
|
||||||
uni.showLoading({title: '读取中'})
|
|
||||||
this.$http.post(`/app/appbaiduai/queryByInfo?word=${this.word}`).then((res) => {
|
|
||||||
if (res.code === 0) {
|
|
||||||
this.info = {...res.data}
|
|
||||||
uni.hideLoading()
|
|
||||||
}
|
|
||||||
}).catch(res => {
|
|
||||||
this.$u.toast(res)
|
|
||||||
uni.hideLoading()
|
|
||||||
})
|
|
||||||
},
|
|
||||||
confirmSex(e) {
|
|
||||||
this.info.sex = e[0].value
|
|
||||||
},
|
|
||||||
confirmNation(e) {
|
|
||||||
this.info.nation = e[0].value
|
|
||||||
},
|
|
||||||
dateConfirm(e) {
|
|
||||||
this.info.birthday = `${e.year}-${e.month}-${e.day}`
|
|
||||||
},
|
|
||||||
confirm(successText) {
|
|
||||||
// if(this.info.name == null || !this.info.name) {
|
|
||||||
// return this.$u.toast('请输入户主姓名')
|
|
||||||
// }
|
|
||||||
// if(this.info.sex == null) {
|
|
||||||
// return this.$u.toast('请选择性别')
|
|
||||||
// }
|
|
||||||
// if(this.info.phone == null || !this.info.phone) {
|
|
||||||
// return this.$u.toast('请输入联系电话')
|
|
||||||
// }
|
|
||||||
// if(this.info.birthday == null) {
|
|
||||||
// return this.$u.toast('请选择出生日期')
|
|
||||||
// }
|
|
||||||
// if(this.info.nation == null) {
|
|
||||||
// return this.$u.toast('请选择民族')
|
|
||||||
// }
|
|
||||||
// if(this.info.householdNumber == null || !this.info.householdNumber) {
|
|
||||||
// return this.$u.toast('请输入家庭人口数')
|
|
||||||
// }
|
|
||||||
// this.showModel = true
|
|
||||||
this.$confirm('已流转到城管部门处理', '上报成功').then(() => {
|
|
||||||
this.back()
|
|
||||||
})
|
|
||||||
},
|
|
||||||
back() {
|
|
||||||
uni.navigateBack({delta: 2})
|
|
||||||
}
|
|
||||||
},
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
|
||||||
uni-page-body {
|
|
||||||
height: 100vh;
|
|
||||||
background: #F5F5F5;
|
|
||||||
}
|
|
||||||
.formConfirm {
|
|
||||||
.list-content {
|
|
||||||
padding-bottom: 328px;
|
|
||||||
.item {
|
|
||||||
padding-left: 32px;
|
|
||||||
position: relative;
|
|
||||||
margin-bottom: 16px;
|
|
||||||
background-color: #fff;
|
|
||||||
.tips {
|
|
||||||
position: absolute;
|
|
||||||
top: 34px;
|
|
||||||
left: 8px;
|
|
||||||
font-family: PingFangSC-Regular;
|
|
||||||
font-size: 32px;
|
|
||||||
color: #F46;
|
|
||||||
}
|
|
||||||
.label {
|
|
||||||
font-family: PingFangSC-Regular;
|
|
||||||
font-size: 32px;
|
|
||||||
color: #333;
|
|
||||||
line-height: 44px;
|
|
||||||
width: 240px;
|
|
||||||
}
|
|
||||||
.item-border {
|
|
||||||
padding: 34px 32px 34px 0;
|
|
||||||
width: 100%;
|
|
||||||
box-sizing: border-box;
|
|
||||||
border-bottom: 1px solid #D8DDE6;
|
|
||||||
display: flex;
|
|
||||||
.value {
|
|
||||||
width: calc(100% - 240px);
|
|
||||||
text-align: right;
|
|
||||||
.u-input {
|
|
||||||
display: inline-block;
|
|
||||||
width: calc(100% - 40px);
|
|
||||||
vertical-align: sub;
|
|
||||||
}
|
|
||||||
img {
|
|
||||||
display: inline-block;
|
|
||||||
width: 32px;
|
|
||||||
height: 32px;
|
|
||||||
margin-left: 8px;
|
|
||||||
vertical-align: middle;
|
|
||||||
}
|
|
||||||
.color-999 {
|
|
||||||
color: rgb(192, 196, 204);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.text-label {
|
|
||||||
padding: 34px 32px 34px 0;
|
|
||||||
}
|
|
||||||
.text-value {
|
|
||||||
padding-right: 32px;
|
|
||||||
::v-deep .uni-textarea-textarea{
|
|
||||||
font-size: 28px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.bottom-btn {
|
|
||||||
position: fixed;
|
|
||||||
bottom: 0;
|
|
||||||
left: 0;
|
|
||||||
background-color: #F5F5F5;
|
|
||||||
div {
|
|
||||||
margin-left: 32px;
|
|
||||||
width: 686px;
|
|
||||||
height: 88px;
|
|
||||||
border-radius: 44px;
|
|
||||||
font-family: PingFangSC-Medium;
|
|
||||||
font-weight: 500;
|
|
||||||
font-size: 34px;
|
|
||||||
text-align: center;
|
|
||||||
line-height: 86px;
|
|
||||||
margin-bottom: 32px;
|
|
||||||
}
|
|
||||||
.confirm {
|
|
||||||
background: #3975C6;
|
|
||||||
color: #fff;
|
|
||||||
}
|
|
||||||
.cancel {
|
|
||||||
background-color: #fff;
|
|
||||||
color: #666;
|
|
||||||
border: 1px solid #CCC;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
::v-deep .u-input__right-icon {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@@ -1,287 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div class="formEdit">
|
|
||||||
<div class="title">
|
|
||||||
<span></span>请确认并校准您输入的内容：
|
|
||||||
</div>
|
|
||||||
<div class="list-content">
|
|
||||||
<div class="item">
|
|
||||||
<div class="label">
|
|
||||||
<span>户主姓名</span>
|
|
||||||
<div class="edit" @click="editName=true">
|
|
||||||
<img src="./img/edit.png" alt="">修改
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="value">
|
|
||||||
<u-input type="text" class="right" placeholder="请输入" height="44" input-align="center" v-model="info.name" :clearable="false" v-if="editName"></u-input>
|
|
||||||
<span v-else>{{info.name || '请输入'}}</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="item">
|
|
||||||
<div class="label">
|
|
||||||
<span>性别</span>
|
|
||||||
<div class="edit" @click="showSex=true">
|
|
||||||
<img src="./img/edit.png" alt="">修改
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="value">
|
|
||||||
<span>{{ $dict.getLabel('sex', info.sex) || '请选择'}}</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="item">
|
|
||||||
<div class="label">
|
|
||||||
<span>联系电话</span>
|
|
||||||
<div class="edit" @click="editPhone=true">
|
|
||||||
<img src="./img/edit.png" alt="">修改
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="value">
|
|
||||||
<u-input type="text" class="right" placeholder="请输入" height="44" input-align="center" v-model="info.phone" :clearable="false" v-if="editPhone"></u-input>
|
|
||||||
<span v-else>{{info.phone || '请输入'}}</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="item">
|
|
||||||
<div class="label">
|
|
||||||
<span>出生日期</span>
|
|
||||||
<div class="edit" @click="showDate=true">
|
|
||||||
<img src="./img/edit.png" alt="">修改
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="value">
|
|
||||||
<span>{{info.birthday || '请选择'}}</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="item">
|
|
||||||
<div class="label">
|
|
||||||
<span>民族</span>
|
|
||||||
<div class="edit" @click="showNation=true">
|
|
||||||
<img src="./img/edit.png" alt="">修改
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="value">
|
|
||||||
<span>{{ $dict.getLabel('nation', info.nation) || '请选择'}}</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="item">
|
|
||||||
<div class="label">
|
|
||||||
<span>家庭人口数</span>
|
|
||||||
<div class="edit" @click="editHouseholdNumber=true">
|
|
||||||
<img src="./img/edit.png" alt="">修改
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="value">
|
|
||||||
<u-input type="text" class="right" placeholder="请输入" height="44" input-align="center" v-model="info.householdNumber" :clearable="false" v-if="editHouseholdNumber"></u-input>
|
|
||||||
<span v-else>{{info.householdNumber || '请输入'}}</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="item">
|
|
||||||
<div class="label">
|
|
||||||
<span>我要上报的事情</span>
|
|
||||||
<div class="edit" @click="editReportThing=true">
|
|
||||||
<img src="./img/edit.png" alt="">修改
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="value">
|
|
||||||
<u-input type="textarea" placeholder="请输入" :height="300" input-align="center" v-model="info.reportThing" :clearable="false" maxlength="500" v-if="editReportThing"></u-input>
|
|
||||||
<span v-else>{{info.reportThing || '请输入'}}</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="bottom-btn">
|
|
||||||
<div class="confirm" @click="toConfirm">确认使用</div>
|
|
||||||
<div class="cancel" @click="back">取消输入</div>
|
|
||||||
</div>
|
|
||||||
<u-picker mode="time" v-model="showDate" :params="deteParams" start-year="1930" @confirm="dateConfirm">请选择</u-picker>
|
|
||||||
<u-select v-model="showSex" :list="$dict.getDict('sex')" label-name="dictName" value-name="dictValue" @confirm="confirmSex"/>
|
|
||||||
<u-select v-model="showNation" :list="$dict.getDict('nation')" label-name="dictName" value-name="dictValue" @confirm="confirmNation"/>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
import {mapState} from "vuex";
|
|
||||||
|
|
||||||
export default {
|
|
||||||
name: 'formEdit',
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
word: '',
|
|
||||||
info: {},
|
|
||||||
showSex: false,
|
|
||||||
showNation: false,
|
|
||||||
showDate: false,
|
|
||||||
deteParams: {year: true, month: true, day: true, hour: false, minute: false, second: false},
|
|
||||||
editName: false,
|
|
||||||
editPhone: false,
|
|
||||||
editHouseholdNumber: false,
|
|
||||||
editReportThing: false
|
|
||||||
}
|
|
||||||
},
|
|
||||||
computed: {
|
|
||||||
...mapState(['user']),
|
|
||||||
},
|
|
||||||
onLoad(option) {
|
|
||||||
this.word = option.word
|
|
||||||
this.$dict.load('sex', 'nation').then(() => {
|
|
||||||
this.getInfo()
|
|
||||||
})
|
|
||||||
},
|
|
||||||
onShow() {
|
|
||||||
document.title = '巡查上报'
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
getInfo() {
|
|
||||||
uni.showLoading({title: '读取中'})
|
|
||||||
this.info = {}
|
|
||||||
this.$http.post(`/app/appbaiduai/queryByInfo?word=${this.word}`).then((res) => {
|
|
||||||
if (res.code === 0) {
|
|
||||||
this.info = {...res.data}
|
|
||||||
uni.hideLoading()
|
|
||||||
}
|
|
||||||
}).catch(res => {
|
|
||||||
uni.hideLoading()
|
|
||||||
this.$u.toast(res)
|
|
||||||
})
|
|
||||||
},
|
|
||||||
confirmSex(e) {
|
|
||||||
this.info.sex = e[0].value
|
|
||||||
},
|
|
||||||
confirmNation(e) {
|
|
||||||
this.info.nation = e[0].value
|
|
||||||
},
|
|
||||||
dateConfirm(e) {
|
|
||||||
this.info.birthday = `${e.year}-${e.month}-${e.day}`
|
|
||||||
},
|
|
||||||
toConfirm() {
|
|
||||||
// if(this.info.name == null || !this.info.name) {
|
|
||||||
// return this.$u.toast('请输入户主姓名')
|
|
||||||
// }
|
|
||||||
// if(this.info.sex == null) {
|
|
||||||
// return this.$u.toast('请选择性别')
|
|
||||||
// }
|
|
||||||
// if(this.info.phone == null || !this.info.phone) {
|
|
||||||
// return this.$u.toast('请输入联系电话')
|
|
||||||
// }
|
|
||||||
// if(this.info.birthday == null) {
|
|
||||||
// return this.$u.toast('请选择出生日期')
|
|
||||||
// }
|
|
||||||
// if(this.info.nation == null) {
|
|
||||||
// return this.$u.toast('请选择民族')
|
|
||||||
// }
|
|
||||||
// if(this.info.householdNumber == null || !this.info.householdNumber) {
|
|
||||||
// return this.$u.toast('请输入家庭人口数')
|
|
||||||
// }
|
|
||||||
var info = JSON.stringify(this.info)
|
|
||||||
uni.navigateTo({url: `./formConfirm?info=${info}`})
|
|
||||||
},
|
|
||||||
back() {
|
|
||||||
uni.navigateBack()
|
|
||||||
}
|
|
||||||
},
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
|
||||||
uni-page-body {
|
|
||||||
height: 100vh;
|
|
||||||
background: #fff;
|
|
||||||
padding-top: 26px;
|
|
||||||
}
|
|
||||||
.formEdit {
|
|
||||||
.title {
|
|
||||||
padding-left: 32px;
|
|
||||||
font-family: PingFangSC-Medium;
|
|
||||||
font-weight: 500;
|
|
||||||
font-size: 32px;
|
|
||||||
color: #000;
|
|
||||||
line-height: 48px;
|
|
||||||
margin-bottom: 22px;
|
|
||||||
span {
|
|
||||||
display: inline-block;
|
|
||||||
width: 6px;
|
|
||||||
height: 28px;
|
|
||||||
background: #3399FF;
|
|
||||||
border-radius: 3px;
|
|
||||||
margin-right: 18px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.list-content {
|
|
||||||
padding-bottom: 372px;
|
|
||||||
background-color: #fff;
|
|
||||||
.item {
|
|
||||||
text-align: center;
|
|
||||||
margin-bottom: 64px;
|
|
||||||
.label {
|
|
||||||
margin-bottom: 18px;
|
|
||||||
span {
|
|
||||||
color: #999;
|
|
||||||
font-size: 40px;
|
|
||||||
font-family: PingFangSC;
|
|
||||||
font-weight: 500;
|
|
||||||
line-height: 60px;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
.edit {
|
|
||||||
display: inline-block;
|
|
||||||
width: 150px;
|
|
||||||
text-align: right;
|
|
||||||
font-family: PingFangSC-Regular;
|
|
||||||
font-size: 28px;
|
|
||||||
color: #3072F5;
|
|
||||||
vertical-align: text-bottom;
|
|
||||||
img {
|
|
||||||
width: 28px;
|
|
||||||
height: 28px;
|
|
||||||
margin: 0 12px 0 32px;
|
|
||||||
vertical-align: middle;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.value {
|
|
||||||
.u-input, span{
|
|
||||||
display: inline-block;
|
|
||||||
width: 100%;
|
|
||||||
text-align: center;
|
|
||||||
color: #3975c6;
|
|
||||||
font-size: 40px;
|
|
||||||
font-family: PingFangSC;
|
|
||||||
font-weight: 500;
|
|
||||||
line-height: 60px;
|
|
||||||
}
|
|
||||||
::v-deep .uni-input-input,
|
|
||||||
::v-deep .uni-textarea-textarea{
|
|
||||||
color: #3975c6;
|
|
||||||
font-size: 40px;
|
|
||||||
font-family: PingFangSC;
|
|
||||||
font-weight: 500;
|
|
||||||
line-height: 60px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.bottom-btn {
|
|
||||||
position: fixed;
|
|
||||||
bottom: 0;
|
|
||||||
left: 0;
|
|
||||||
background-color: #fff;
|
|
||||||
div {
|
|
||||||
margin-left: 32px;
|
|
||||||
width: 686px;
|
|
||||||
height: 88px;
|
|
||||||
border-radius: 44px;
|
|
||||||
font-family: PingFangSC-Medium;
|
|
||||||
font-weight: 500;
|
|
||||||
font-size: 34px;
|
|
||||||
text-align: center;
|
|
||||||
line-height: 86px;
|
|
||||||
margin-bottom: 32px;
|
|
||||||
}
|
|
||||||
.confirm {
|
|
||||||
background: #3975C6;
|
|
||||||
color: #fff;
|
|
||||||
}
|
|
||||||
.cancel {
|
|
||||||
color: #666;
|
|
||||||
border: 1px solid #CCC;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
Binary file not shown.
|
Before Width: | Height: | Size: 395 B |
Binary file not shown.
|
Before Width: | Height: | Size: 734 B |
Binary file not shown.
|
Before Width: | Height: | Size: 3.1 KiB |
@@ -1,6 +1,16 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="AppVillageHead">
|
<div class="AiAuestions">
|
||||||
<scroll-view :scroll-top="scrollTop" scroll-y="true" class="scroll-Y" @scroll="scroll" v-if="messageList.length" :style="{height: scrollHeight+'px'}">
|
<div class="service-content">
|
||||||
|
<div class="text-content">
|
||||||
|
<div class="text-left">
|
||||||
|
<div>嘿，你好呀！</div>
|
||||||
|
<p>我是您的<span>「AI助手」</span>，</p>
|
||||||
|
<p>有什么问题都可以问我哟~</p>
|
||||||
|
</div>
|
||||||
|
<img src="https://cdn.cunwuyun.cn/wechat/biaopin/residentAssistant/service.png" alt="" class="service-img">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- <scroll-view :scroll-top="scrollTop" scroll-y="true" class="scroll-Y" @scroll="scroll" v-if="messageList.length" :style="{height: scrollHeight+'px'}"> -->
|
||||||
<div class="list-content">
|
<div class="list-content">
|
||||||
<div v-for="(item, index) in messageList" :key="index">
|
<div v-for="(item, index) in messageList" :key="index">
|
||||||
<div :class="item.userType == 1 ? 'item-left' : 'item-right'" v-if="item.userType != 2">
|
<div :class="item.userType == 1 ? 'item-left' : 'item-right'" v-if="item.userType != 2">
|
||||||
@@ -14,76 +24,9 @@
|
|||||||
<p>{{item.content || ''}}</p>
|
<p>{{item.content || ''}}</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="statistics-content" v-if="item.userType == 2">
|
|
||||||
<div class="title">{{item.content['标题']}}</div>
|
|
||||||
<div class="mini-title">
|
|
||||||
<span></span>宣发情况
|
|
||||||
</div>
|
|
||||||
<div class="flex-info">
|
|
||||||
<div class="info">宣发数据：<span>{{item.content['宣发条数']}}</span>条</div>
|
|
||||||
</div>
|
|
||||||
<div class="flex-info mar-b12">
|
|
||||||
<div class="info">触达居民群数：
|
|
||||||
<div>
|
|
||||||
<span>{{item.content['宣发触达居民群数'] || 0}}</span>个
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="info">触达居民：
|
<!-- </scroll-view> -->
|
||||||
<div>
|
|
||||||
<span>{{item.content['宣发触达居民']}}</span>人
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="mini-title">
|
|
||||||
<span></span>AI问答
|
|
||||||
</div>
|
|
||||||
<div class="flex-info">
|
|
||||||
<div class="info">居民累计提问：
|
|
||||||
<div>
|
|
||||||
<span>{{item.content['昨日累计提问']}}</span>次
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="info">居民平均提问：
|
|
||||||
<div>
|
|
||||||
<span>{{item.content['昨日居民平均提问']}}</span>次/群
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="flex-info mar-b12">
|
|
||||||
<div class="info">最活跃群提问：
|
|
||||||
<div>
|
|
||||||
<span>{{item.content['昨日最活跃群提问']}}</span>次
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="title">近7天居民群数据</div>
|
|
||||||
<div class="flex-total">
|
|
||||||
<div class="item-total">
|
|
||||||
<p>服务居民数</p>
|
|
||||||
<div><span>{{item.content['服务居民数']}}</span>人</div>
|
|
||||||
</div>
|
|
||||||
<div class="item-total">
|
|
||||||
<p>回答问题总数</p>
|
|
||||||
<div><span>{{item.content['7天回答问题总数']}}</span>个</div>
|
|
||||||
</div>
|
|
||||||
<div class="item-total">
|
|
||||||
<p>覆盖群聊</p>
|
|
||||||
<div><span>{{item.content['7天覆盖群聊']}}</span>个</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="hot" v-if="item.content['热点话题'] && item.content['热点话题'].length">
|
|
||||||
<div class="mini-title">
|
|
||||||
<span></span>热点话题
|
|
||||||
</div>
|
|
||||||
<div class="item-hot" v-for="(items, indexs) in item.content['热点话题']" :key="indexs" v-if="indexs < 6">
|
|
||||||
<div @click="getTagList(items.tag)"><span :class="'color'+indexs">{{indexs+1}}.</span>{{items.tag}}</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</scroll-view>
|
|
||||||
<AiEmpty description="暂无数据" v-if="!messageList.length"/>
|
|
||||||
<div class="fixed-bottom">
|
<div class="fixed-bottom">
|
||||||
<div class="type-text" v-if="type == 'text'">
|
<div class="type-text" v-if="type == 'text'">
|
||||||
<u-input type="text" placeholder="输入您的问题…" height="80" input-align="left" :clearable="false" :border="true" placeholder-style="color:#666;" v-model="content"></u-input>
|
<u-input type="text" placeholder="输入您的问题…" height="80" input-align="left" :clearable="false" :border="true" placeholder-style="color:#666;" v-model="content"></u-input>
|
||||||
@@ -103,20 +46,7 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<u-popup v-model="showMask" mode="center" width="85%" height="900" border-radius="14" :closeable="true">
|
<div class="back-btn" @click="back()"><u-icon name="arrow-left" color="#fff" size="28"></u-icon>返回</div>
|
||||||
<div class="mask-content">
|
|
||||||
<div class="mini-title">
|
|
||||||
<span></span>热点话题
|
|
||||||
</div>
|
|
||||||
<div class="list-info">
|
|
||||||
<div class="item" v-for="(item, index) in tagList" :key="index">
|
|
||||||
<div class="name">{{item.user_name}}-{{item.room_name}}</div>
|
|
||||||
<div class="time">{{item.msg_send_time}}</div>
|
|
||||||
<div class="content">{{item.content}}</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</u-popup>
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@@ -129,8 +59,8 @@ import 'recorder-core/src/engine/mp3-engine'
|
|||||||
const innerAudioContext = uni.createInnerAudioContext();
|
const innerAudioContext = uni.createInnerAudioContext();
|
||||||
innerAudioContext.autoplay = true;
|
innerAudioContext.autoplay = true;
|
||||||
export default {
|
export default {
|
||||||
name: 'AppVillageHead',
|
name: 'AiAuestions',
|
||||||
appName: '村长coplite',
|
appName: 'Ai助手',
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
recorder: null,
|
recorder: null,
|
||||||
@@ -160,17 +90,20 @@ export default {
|
|||||||
...mapState(['user']),
|
...mapState(['user']),
|
||||||
},
|
},
|
||||||
onLoad() {
|
onLoad() {
|
||||||
this.scrollHeight = uni.getSystemInfoSync().windowHeight
|
// this.scrollHeight = uni.getSystemInfoSync().windowHeight
|
||||||
this.getHistoryList()
|
// this.getHistoryList()
|
||||||
// var res = ["http://test87ftp.cunwuyun.cn/20240109/filename-20240109111547.mp3;0678a73c50b74bdcb8398e14ffbb35e5"]
|
// var res = ["http://test87ftp.cunwuyun.cn/20240109/filename-20240109111547.mp3;0678a73c50b74bdcb8398e14ffbb35e5"]
|
||||||
// this.voiceUrl = res[0].split(';')[0]
|
// this.voiceUrl = res[0].split(';')[0]
|
||||||
// this.voiceId = res[0].split(';')[1]
|
// this.voiceId = res[0].split(';')[1]
|
||||||
// this.sendVoice()
|
// this.sendVoice()
|
||||||
},
|
},
|
||||||
onShow() {
|
onShow() {
|
||||||
document.title = '村长copilot'
|
document.title = 'AI助手'
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
|
back() {
|
||||||
|
uni.navigateBack()
|
||||||
|
},
|
||||||
startRecord() {
|
startRecord() {
|
||||||
this.isStart = true
|
this.isStart = true
|
||||||
this.recorder = Recorder({
|
this.recorder = Recorder({
|
||||||
@@ -231,7 +164,7 @@ export default {
|
|||||||
},
|
},
|
||||||
sendMsg() {
|
sendMsg() {
|
||||||
this.$loading()
|
this.$loading()
|
||||||
this.$http.post("/app/appaigccopilotinfo/add", {content: this.content, appType: 1}).then(res => {
|
this.$http.post("/app/appaigccopilotinfo/add2", {content: this.content, appType: 1}, {withoutToken: true}).then(res => {
|
||||||
if(res.code == 0) {
|
if(res.code == 0) {
|
||||||
this.content = ''
|
this.content = ''
|
||||||
this.messageList.push(res.data[0])
|
this.messageList.push(res.data[0])
|
||||||
@@ -247,7 +180,7 @@ export default {
|
|||||||
},
|
},
|
||||||
sendVoice() {
|
sendVoice() {
|
||||||
this.$loading()
|
this.$loading()
|
||||||
this.$http.post("/app/appaigccopilotinfo/add", {sdkFileUrl: this.voiceUrl, fileId: this.voiceId, appType: 1}).then(res => {
|
this.$http.post("/app/appaigccopilotinfo/add2", {sdkFileUrl: this.voiceUrl, fileId: this.voiceId, appType: 1}, {withoutToken: true}).then(res => {
|
||||||
if(res.code == 0) {
|
if(res.code == 0) {
|
||||||
this.voiceUrl = ''
|
this.voiceUrl = ''
|
||||||
this.voiceId = ''
|
this.voiceId = ''
|
||||||
@@ -340,7 +273,7 @@ export default {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
.AppVillageHead {
|
.AiAuestions {
|
||||||
height: 100vh;
|
height: 100vh;
|
||||||
// padding-top: 32px;
|
// padding-top: 32px;
|
||||||
background-color: #fff;
|
background-color: #fff;
|
||||||
@@ -542,6 +475,21 @@ export default {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.back-btn {
|
||||||
|
line-height: 64px;
|
||||||
|
background-color: #B8B8B8;
|
||||||
|
border-top-right-radius: 44px;
|
||||||
|
border-bottom-right-radius: 44px;
|
||||||
|
font-family: PingFangSC-Medium;
|
||||||
|
font-weight: 500;
|
||||||
|
font-size: 28px;
|
||||||
|
color: #FFF;
|
||||||
|
padding: 0 32px 0 16px;
|
||||||
|
position: fixed;
|
||||||
|
left: 0;
|
||||||
|
bottom: 276px;
|
||||||
|
z-index: 99;
|
||||||
|
}
|
||||||
.fixed-bottom {
|
.fixed-bottom {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
216
src/project/baidu/AppTourismStrategy/AppTourismStrategy.vue
Normal file
216
src/project/baidu/AppTourismStrategy/AppTourismStrategy.vue
Normal file
@@ -0,0 +1,216 @@
|
|||||||
|
<template>
|
||||||
|
<div class="AppTourismStrategy">
|
||||||
|
<div class="header-bg"></div>
|
||||||
|
<div class="tourism-content">
|
||||||
|
<div class="tab">
|
||||||
|
<div :class="tabIndex == index ? 'item active' : 'item'" v-for="(item, index) in tabList" :key="index" @click="tabClick(index)">{{ item }}</div>
|
||||||
|
<span :class="`slider`+tabIndex"></span>
|
||||||
|
</div>
|
||||||
|
<div class="list-content1" v-if="tabIndex == 0 || cityType == 1">
|
||||||
|
<div class="item" v-for="(item, index) in list" :key="index" @click="toDetail(item.id, item.input03)">
|
||||||
|
<img :src="item.imgList[item.imgIndex]" alt="">
|
||||||
|
<p>{{ item.input03 }}</p>
|
||||||
|
</div>
|
||||||
|
<div class="back-btn" v-if="cityType == 1" @click="backCity()">返回城市列表</div>
|
||||||
|
</div>
|
||||||
|
<div class="list-content2" v-if="tabIndex == 1 && cityType == 0">
|
||||||
|
<div class="item" v-for="(item, index) in list" :key="index" @click="getCity(item.input00)">
|
||||||
|
<img :src="item.imgList[item.imgIndex]" alt="">
|
||||||
|
<span>{{ item.input01 }}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import {mapState} from "vuex";
|
||||||
|
export default {
|
||||||
|
name: 'AppTourismStrategy',
|
||||||
|
appName: '旅游攻略',
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
tabList: [ '周边旅游', '国内旅游'],
|
||||||
|
tabIndex: 0,
|
||||||
|
list: [],
|
||||||
|
areaId: '411702000000',
|
||||||
|
cityType: 0, //0国内 1国内周边
|
||||||
|
cityAreaId: '', //国内周边城市ID
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
...mapState(['user']),
|
||||||
|
},
|
||||||
|
onLoad(option) { //type 0周边、1：国内
|
||||||
|
// this.areaId = option.areaId
|
||||||
|
// this.tabIndex = option.type
|
||||||
|
|
||||||
|
// uni.$on('tourismBack', (res) => {
|
||||||
|
// this.cityAreaId = res.cityAreaId
|
||||||
|
// this.getList()
|
||||||
|
// })
|
||||||
|
|
||||||
|
this.getList()
|
||||||
|
},
|
||||||
|
onShow() {
|
||||||
|
document.title = '旅游攻略'
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
tabClick(index) {
|
||||||
|
this.tabIndex = index;
|
||||||
|
this.cityType = 0
|
||||||
|
this.getList()
|
||||||
|
},
|
||||||
|
toDetail(id, title) {
|
||||||
|
uni.navigateTo({url: `./Detail?id=${id}&cityAreaId=${this.cityAreaId}&title=${title}`})
|
||||||
|
},
|
||||||
|
backCity() {
|
||||||
|
this.cityType = 0
|
||||||
|
this.cityAreaId = ''
|
||||||
|
this.getList()
|
||||||
|
},
|
||||||
|
getCity(areaId) {
|
||||||
|
this.cityAreaId = areaId
|
||||||
|
this.cityType = 1
|
||||||
|
this.getList()
|
||||||
|
},
|
||||||
|
getList() {
|
||||||
|
this.$http.post("https://szxcweb.icunwei.com/app/appapplicationinfo/list?appId=875e5087954e429d9ed14820e808aaa4¤t=1&size=200",
|
||||||
|
{
|
||||||
|
"input00": this.tabIndex == 0 ? this.areaId : this.cityAreaId,
|
||||||
|
"radio06": this.tabIndex
|
||||||
|
},
|
||||||
|
{withoutToken: true}).then(res => {
|
||||||
|
res.data.records.map((item) => {
|
||||||
|
item.imgList = item.textarea05.split('|')
|
||||||
|
item.imgIndex = Math.floor(Math.random() * 4)
|
||||||
|
})
|
||||||
|
this.list = res.data.records
|
||||||
|
console.log(this.list)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.AppTourismStrategy {
|
||||||
|
height: 100vh;
|
||||||
|
background-color:#EAEEF6;
|
||||||
|
position: relative;
|
||||||
|
.header-bg {
|
||||||
|
width: 100%;
|
||||||
|
height: 600px;
|
||||||
|
background-image: linear-gradient(180deg, #2067f3cc 1%, #2067f300 98%);
|
||||||
|
}
|
||||||
|
.tourism-content {
|
||||||
|
width: calc(100% - 64px);
|
||||||
|
min-height: calc(100% - 64px);
|
||||||
|
background: #FFF;
|
||||||
|
border-radius: 16px;
|
||||||
|
position: absolute;
|
||||||
|
top: 32px;
|
||||||
|
left: 32px;
|
||||||
|
padding: 32px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
.tab {
|
||||||
|
padding: 0 144px 54px 144px;
|
||||||
|
display: flex;
|
||||||
|
position: relative;
|
||||||
|
.item {
|
||||||
|
flex: 1;
|
||||||
|
text-align: center;
|
||||||
|
width: 128px;
|
||||||
|
line-height: 48px;
|
||||||
|
font-family: PingFangSC-Regular;
|
||||||
|
font-size: 32px;
|
||||||
|
color: #666;
|
||||||
|
}
|
||||||
|
.active {
|
||||||
|
font-family: PingFangSC-SNaNpxibold;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #000;
|
||||||
|
}
|
||||||
|
span {
|
||||||
|
position: absolute;
|
||||||
|
top: 64px;
|
||||||
|
width: 48px;
|
||||||
|
height: 6px;
|
||||||
|
background: #2066F3;
|
||||||
|
border-radius: 3px;
|
||||||
|
transition: left 0.3s ease;
|
||||||
|
}
|
||||||
|
.slider0 {
|
||||||
|
left: 204px;
|
||||||
|
}
|
||||||
|
.slider1 {
|
||||||
|
left: 368px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.list-content1 {
|
||||||
|
.item {
|
||||||
|
display: inline-block;
|
||||||
|
margin: 0 32px 32px 0;
|
||||||
|
width: calc(50% - 16px);
|
||||||
|
vertical-align: text-top;
|
||||||
|
img {
|
||||||
|
width: 294px;
|
||||||
|
height: 220px;
|
||||||
|
}
|
||||||
|
p {
|
||||||
|
line-height: 40px;
|
||||||
|
font-family: PingFangSC-Medium;
|
||||||
|
font-weight: 500;
|
||||||
|
font-size: 28px;
|
||||||
|
color: #222;
|
||||||
|
text-align: center;
|
||||||
|
margin-top: 16px;
|
||||||
|
width: 100%;
|
||||||
|
word-break: break-all;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.item:nth-of-type(2n) {
|
||||||
|
margin-right: 0;
|
||||||
|
}
|
||||||
|
.back-btn {
|
||||||
|
width: 100%;
|
||||||
|
height: 88px;
|
||||||
|
background: #2067F4;
|
||||||
|
border-radius: 44px;
|
||||||
|
line-height: 88px;
|
||||||
|
font-family: PingFangSC-Medium;
|
||||||
|
font-weight: 500;
|
||||||
|
font-size: 34px;
|
||||||
|
color: #FFF;
|
||||||
|
text-align: center;
|
||||||
|
margin-top: 126px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.list-content2 {
|
||||||
|
.item {
|
||||||
|
display: inline-block;
|
||||||
|
position: relative;
|
||||||
|
margin: 0 32px 32px 0;
|
||||||
|
img {
|
||||||
|
width: 186px;
|
||||||
|
height: 186px;
|
||||||
|
border-radius: 8px;
|
||||||
|
}
|
||||||
|
span {
|
||||||
|
line-height: 40px;
|
||||||
|
font-family: PingFangSC-SNaNpxibold;
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 28px;
|
||||||
|
color: #FFF;
|
||||||
|
position: absolute;
|
||||||
|
top: 16px;
|
||||||
|
left: 24px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.item:nth-of-type(3n) {
|
||||||
|
margin-right: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
147
src/project/baidu/AppTourismStrategy/Detail.vue
Normal file
147
src/project/baidu/AppTourismStrategy/Detail.vue
Normal file
@@ -0,0 +1,147 @@
|
|||||||
|
<template>
|
||||||
|
<div class="Detail">
|
||||||
|
<div class="header-img">
|
||||||
|
<img :src="info.imgList[info.imgIndex]" alt="">
|
||||||
|
</div>
|
||||||
|
<div class="detail-content">
|
||||||
|
<div class="title">{{ info. input03 }}</div>
|
||||||
|
<div class="text-content" v-html="info.textarea04"></div>
|
||||||
|
|
||||||
|
<div class="ai-btn" @click="toAi()">更多旅游攻略，来问问AI吧~<img src="./img/qa-icon.png" alt=""></div>
|
||||||
|
<div class="back-btn" @click="back()" v-if="cityAreaId">返回</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import {mapState} from "vuex";
|
||||||
|
export default {
|
||||||
|
name: 'Detail',
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
id: '',
|
||||||
|
cityAreaId: '',
|
||||||
|
title: '',
|
||||||
|
info: {}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
...mapState(['user']),
|
||||||
|
},
|
||||||
|
onLoad(option) {
|
||||||
|
this.id = option.id
|
||||||
|
this.cityAreaId = option.cityAreaId
|
||||||
|
this.title = option.title
|
||||||
|
this.getDetail()
|
||||||
|
},
|
||||||
|
onShow() {
|
||||||
|
document.title = this.title
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
toAi() {
|
||||||
|
uni.navigateTo({url: './AiAuestions'})
|
||||||
|
},
|
||||||
|
back() {
|
||||||
|
uni.$emit('tourismBack', {cityAreaId: this.cityAreaId})
|
||||||
|
uni.navigateBack()
|
||||||
|
},
|
||||||
|
getDetail() {
|
||||||
|
// https://szxcweb.icunwei.com/app/appapplicationinfo/queryDetailById?appId=875e5087954e429d9ed14820e808aaa4&id=016201639c4b4efda1204c84804f437d
|
||||||
|
this.$http.post(`https://szxcweb.icunwei.com/app/appapplicationinfo/queryDetailById?appId=875e5087954e429d9ed14820e808aaa4&id=${this.id}`,
|
||||||
|
null, {withoutToken: true}).then(res => {
|
||||||
|
// res.data.records.map((item) => {
|
||||||
|
// item.imgList = item.textarea05.split('|')
|
||||||
|
// item.imgIndex = Math.floor(Math.random() * 4)
|
||||||
|
// })
|
||||||
|
// this.list = res.data.records
|
||||||
|
// console.log(this.list)
|
||||||
|
|
||||||
|
res.data.imgList = res.data.textarea05.split('|')
|
||||||
|
res.data.imgIndex = Math.floor(Math.random() * 4)
|
||||||
|
this.info = res.data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.Detail {
|
||||||
|
height: 100vh;
|
||||||
|
background-color: #fff;
|
||||||
|
position: relative;
|
||||||
|
.header-img {
|
||||||
|
width: 100%;
|
||||||
|
img {
|
||||||
|
width: 100%;
|
||||||
|
height: 590px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.detail-content {
|
||||||
|
width: 100%;
|
||||||
|
min-height: calc(100% - 540px);
|
||||||
|
background: #FFF;
|
||||||
|
border-radius: 32px 32px 0 0;
|
||||||
|
padding: 32px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
position: absolute;
|
||||||
|
top: 540px;
|
||||||
|
left: 0;
|
||||||
|
z-index: 9;
|
||||||
|
.title {
|
||||||
|
line-height: 48px;
|
||||||
|
font-family: PingFangSC-SNaNpxibold;
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 36px;
|
||||||
|
color: #000;
|
||||||
|
word-break: break-all;
|
||||||
|
margin-bottom: 18px;
|
||||||
|
}
|
||||||
|
.text-content {
|
||||||
|
padding-bottom: 166px;
|
||||||
|
font-family: PingFangSC-Regular;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 28px;
|
||||||
|
color: #000;
|
||||||
|
line-height: 48px;
|
||||||
|
}
|
||||||
|
.back-btn {
|
||||||
|
width: calc(100% - 64px);
|
||||||
|
line-height: 88px;
|
||||||
|
background: #2067F4;
|
||||||
|
border-radius: 44px;
|
||||||
|
margin: 0 32px;
|
||||||
|
font-family: PingFangSC-Medium;
|
||||||
|
font-weight: 500;
|
||||||
|
font-size: 34px;
|
||||||
|
color: #FFF;
|
||||||
|
text-align: center;
|
||||||
|
position: absolute;
|
||||||
|
bottom: 32px;
|
||||||
|
left: 32px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.ai-btn {
|
||||||
|
height: 80px;
|
||||||
|
background-color: #F3F8FF;
|
||||||
|
border-radius: 44px 0 0 44px;
|
||||||
|
padding: 20px 40px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
font-family: PingFangSC-Regular;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 28px;
|
||||||
|
color: #2066F3;
|
||||||
|
position: fixed;
|
||||||
|
right: 0;
|
||||||
|
bottom: 168px;
|
||||||
|
z-index: 99;
|
||||||
|
img {
|
||||||
|
display: inline-block;
|
||||||
|
margin-left: 10px;
|
||||||
|
width: 44px;
|
||||||
|
height: 40px;
|
||||||
|
vertical-align: middle;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
BIN
src/project/baidu/AppTourismStrategy/img/qa-icon.png
Normal file
BIN
src/project/baidu/AppTourismStrategy/img/qa-icon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.8 KiB |
Reference in New Issue
Block a user