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.
230 lines
9.8 KiB
230 lines
9.8 KiB
<template>
|
|
<view>
|
|
<view class="uni-padding-wrap uni-common-mt">
|
|
|
|
<view class="uni-form-item uni-column">
|
|
|
|
<text class="title uni-center">从文本框输入垃圾关键字查询</text>
|
|
<view class="weui-cells weui-cells_after-title">
|
|
<view class="weui-cell ">
|
|
<view class="weui-cell__bd">
|
|
<input class="weui-input" v-model="textValue" placeholder="请输入垃圾关键字"
|
|
@input="changeTextQuery" @focus="do_focus"/>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="uni-flex uni-column">
|
|
<text class="title uni-center">点击图标拍照查询</text>
|
|
<view class="flex-item flex-item-V uni-center">
|
|
<image class="photo" @click="chooseImage"></image>
|
|
</view>
|
|
</view>
|
|
|
|
</view>
|
|
|
|
<view v-if="show_info">
|
|
<view class="weui-flex">
|
|
<view class="weui-flex__item"><view class="placeholder">查询结果</view></view>
|
|
</view>
|
|
<view class="weui-flex">
|
|
<view class="weui-flex__item"><view class="placeholder">垃圾</view></view>
|
|
<view class="weui-flex__item"><view class="placeholder">分类</view></view>
|
|
</view>
|
|
<view class="weui-flex" v-for="(item,index) in query_result" :key="index">
|
|
<view class="weui-flex__item"><view class="placeholder">{{item.name}}</view></view>
|
|
<view class="weui-flex__item"><view class="placeholder">{{getWasteSorting(item.category)}}</view></view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
|
|
</template>
|
|
|
|
<script>
|
|
import {config} from 'common/config'
|
|
|
|
export default {
|
|
name: "query",
|
|
data: function () {
|
|
return {
|
|
title: "垃圾分类查询",
|
|
textValue: "",
|
|
show_info:false,
|
|
query_result:[]
|
|
}
|
|
},
|
|
methods: {
|
|
getWasteSorting:function(waste_type){
|
|
switch (waste_type) {
|
|
case 1:return "可回收垃圾";
|
|
case 2:return "有害垃圾";
|
|
case 4:return "湿垃圾";
|
|
case 8:return "干垃圾";
|
|
case 16:return "大件垃圾";
|
|
}
|
|
},
|
|
do_focus:function () {
|
|
this.show_info=false
|
|
},
|
|
changeTextQuery: function () {
|
|
console.info("文本查询值：" + this.textValue)
|
|
let that=this
|
|
if(this.textValue.length>0){
|
|
let url = config.server + config.interface.text_query
|
|
console.info("文本查询接口地址："+url)
|
|
uni.request({
|
|
url:url,
|
|
data:{
|
|
keyword:that.textValue
|
|
},
|
|
success:function (res) {
|
|
console.info(res)
|
|
let json_res = res.data
|
|
if(json_res["keyword"]===that.textValue) {
|
|
if (json_res["status"]) {
|
|
console.info("查询成功")
|
|
if (json_res["result"].length === 0) {
|
|
console.info("没有匹配结果")
|
|
} else {
|
|
that.show_info = true
|
|
that.query_result = json_res["result"]
|
|
}
|
|
} else {
|
|
console.info("查询失败")
|
|
}
|
|
}else{
|
|
uni.showToast({
|
|
title:"操作频率过快！",
|
|
duration:3000
|
|
})
|
|
}
|
|
|
|
},else:function (err) {
|
|
console.error(err)
|
|
uni.showToast({
|
|
title:"参数解析异常",
|
|
duration:3000
|
|
})
|
|
}
|
|
})
|
|
}
|
|
},
|
|
chooseImage: function () {
|
|
console.info("拍照查询")
|
|
this.show_info=false
|
|
let that=this
|
|
uni.authorize({
|
|
scope: "scope.camera",
|
|
success: function () {
|
|
console.info("摄像头调用成功")
|
|
uni.chooseImage({
|
|
sourceType: ["camera"],
|
|
success: function (obj) {
|
|
console.info("拍照成功，照片临时路径" + obj.tempFilePaths[0])
|
|
uni.showLoading({
|
|
title: "图片解析中"
|
|
})
|
|
let url = config.server + config.interface.image_parse
|
|
console.info("图片解析接口地址：" + url)
|
|
uni.uploadFile({
|
|
url: url,
|
|
filePath: obj.tempFilePaths[0],
|
|
name: 'file',
|
|
success: function (res) {
|
|
let json_res = JSON.parse(res.data)
|
|
console.info(json_res)
|
|
if (json_res["img_parse"]) {
|
|
console.info("照片解析成功")
|
|
if (json_res["query"]) {
|
|
if (json_res["result"].length === 0) {
|
|
let str = "照片解析成功，但是没有垃圾分类信息"
|
|
console.info(str)
|
|
uni.showToast({
|
|
title:str,
|
|
duration:3000
|
|
})
|
|
}else{
|
|
that.show_info=true
|
|
that.query_result=json_res["result"]
|
|
}
|
|
} else {
|
|
let str = "照片解析失败"
|
|
console.info(str)
|
|
uni.showToast({
|
|
title:str,
|
|
duration:3000
|
|
})
|
|
}
|
|
} else {
|
|
let str = "照片解析失败"
|
|
console.info(str)
|
|
uni.showToast({
|
|
title:str,
|
|
duration:3000
|
|
})
|
|
}
|
|
},
|
|
fail: function (err) {
|
|
console.error(err)
|
|
uni.showToast({
|
|
title: "照片解析失败，多次出现此异常请联系管理员",
|
|
duration:3000
|
|
})
|
|
},
|
|
complete: function (res) {
|
|
uni.hideLoading()
|
|
}
|
|
})
|
|
},
|
|
fail: function (err) {
|
|
console.error(err)
|
|
uni.showToast({
|
|
title: "照片保存失败，多次出现此异常请联系管理员",
|
|
duration:3000
|
|
})
|
|
}
|
|
})
|
|
},
|
|
fail: function (err) {
|
|
console.error(err)
|
|
uni.showToast({
|
|
title: "授权摄像头权限失败，请刷新页面重新授权，多次出现此异常请联系管理员",
|
|
duration:3000
|
|
})
|
|
}
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
.photo {
|
|
background-image: url("~@/static/photo128x128.gif");
|
|
background-size: 120px;
|
|
background-repeat: no-repeat;
|
|
}
|
|
|
|
image{
|
|
width: 120px;
|
|
height: 120px;
|
|
}
|
|
|
|
.placeholder{
|
|
margin: 1px;
|
|
padding: 0 10px;
|
|
text-align: center;
|
|
background-color: #F7F7F7;
|
|
height: 2.3em;
|
|
line-height: 2.3em;
|
|
color: rgba(0,0,0,.3);
|
|
border: 1px solid;
|
|
color: black;
|
|
}
|
|
|
|
text {
|
|
font-size: 15px;
|
|
}
|
|
</style> |