123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324 |
- <template>
- <view class="vinbox">
- <view style="height: 90rpx;"></view>
- <view class="carSs">
- <view class="carssBox" @click="vinLog">
- <img src="../../static/img/icon_search.png" alt="" class="carSsImg">
- <input type="text" placeholder="请输入17位车架号查询" class="carssInput" v-model="vinNum" @confirm="vincx">
- </view>
- <view class="search-history" v-if="vinLogShow">
- <view class="historyLine" @click="vinLogBtn(item)" v-for="(item,index) in vinLogList">{{item.vin}}</view>
- </view>
- </view>
-
- <view class="vincxBox" @click.stop="vinLogShow=false">
- <view class="vinupbox">
- <img src="../../static/img/btn_pic.png" alt="" class="vinupImg" @click="upimg">
- <img :src="fileURl" alt="" class="vinupImg2" v-if="fileURl">
- <img src="../../static/img/icon_search_del.png" v-if="fileURl" alt="" class="vinupNo" @click="fileURl=''">
- </view>
- <view class="vincxBtn" @click="vincx">查询</view>
- </view>
- <view class="vinmsbox" @click.stop="vinLogShow=false">
- <view class="vinms">*拍照时请将识别代码完整置于相机内</view>
- <view>
- <img src="../../static/img/bg_vin.png" alt="" class="vinmsImg">
- </view>
- </view>
- <view class="moreVinBox" v-if="moreVinShow" @click.stop="moreVinShow=false">
- <view class="moreVin">
- <view class="moreVinTop">选择车型</view>
- <view class="moreVinline" v-for="(item,index) in moreVinList" @click.stop="golist(item)">
- <view class="moreVinlineTxt">{{item.title}}</view>
- <img src="../../static/img/icon_jiantou@2x.png" alt="" class="moreVinJt">
- </view>
- </view>
- </view>
- </view>
- </template>
- <script>
-
- export default {
-
- data() {
- return {
- vinLogList:[],
- vinLogShow:false,
- vinNum:'',
- fileURl:'',
- moreVinShow:false,
- moreVinList:'',
- }
- },
- onLoad() {
-
- },
- methods: {
- golist(item){
- uni.navigateTo({
- url:'list?name='+item.value+'&nLevelID='+item.carModelInfo.nLevelID+'&id='+item.ids+'&vin='+this.vinNum
- })
- },
- upimg(){
- var that = this;
- uni.showLoading({ title: '加载中'});
- uni.chooseImage({
- sourceType: ['album','camera'],
- count:1,
- success: (chooseImageRes) => {
- console.log(chooseImageRes)
- const tempFilePaths = chooseImageRes.tempFilePaths;
- //that.file=tempFilePaths[0];
- this.fileURl=tempFilePaths[0]
- /* that.$http('vinByOpenApi/scanner', {
- photo:chooseImageRes.tempFiles[0]
-
- }, 'POST').then(res => {
- if(res.code!=1){
-
- }else{
- uni.showToast({
- title: res.msg,
- duration: 3000,
- icon:'none',
- });
- }
-
- }) */
- uni.uploadFile({
- url: that.$baseURL+'scanner?action=/vinByOpenApi/scanner', //仅为示例,非真实的接口地址
- filePath: tempFilePaths[0],
- name: 'photo',
- /* formData: {
- 'user': 'test'
- }, */
- success: (uploadFileRes) => {
- var data=JSON.parse(uploadFileRes.data);
- uni.hideLoading();
- if(data.code!=1){
- console.log(data.data)
- that.vinNum=data.data
- }else{
- uni.showToast({
- title: data.msg,
- duration: 3000,
- icon:'none',
- });
- }
-
- //console.log(JSON.parse(uploadFileRes.data).data );
-
- }
- });
-
-
- }
- });
- },
- vinLog(){
- this.$fetchPost('vinLog', {
-
- }).then(res => {
- this.vinLogList=res.data;
- this.vinLogShow=true;
- })
- },
- vinLogBtn(item){
- this.vinNum=item.vin
- this.onSearch()
- },
- vincx(){
- this.onSearch()
- },
- onSearch(){
- this.$http('matchingByOpen/queryCarModelGroupByVinAggregation', {
- vin: this.vinNum,type:2
- }, 'POST').then(res => {
- if(res.code!=1){
- if (res.data.length === 1) {
- this.saveVinLog({
- vin: this.vinNum,
- groupIDS: res.data[0].ids,
- title: res.data[0].title,
- nLevelID: res.data[0].nLevelIDs
- })
- this.vinLogShow = false;
- var item=res.data[0]
- uni.navigateTo({
- url:'list?name='+item.value+'&nLevelID='+item.carModelInfo.nLevelID+'&id='+item.ids+'&vin='+this.vinNum
- })
- }else{
- this.moreVinList=res.data;
- this.moreVinShow=true;
- }
- }
- else {
- this.vinLogShow = false
- // this.groupList = res
- uni.showToast({
- title: res.msg,
- duration: 3000,
- icon:'none',
- });
- }
-
- })
- },
- saveVinLog(item){
- this.$fetchPost('saveVinLog', {
- vin: this.value,
- groupIDS: item.ids,
- title: item.title,
- nLevelID: item.nLevelIDs
- }).then(res => {
- //this.vinLogList=res.data
- })
- }
- }
- }
- </script>
- <style scoped>
-
- .carSs{
- width: 750rpx;
- height: 96rpx;
- background: #FFFFFF;
- padding-top: 24rpx;
- position: relative;
- }
- .carssBox{
- width: 702rpx;
- height: 72rpx;
- background: #F4F5F7;
- border-radius: 36rpx;
- margin: 0 auto;
-
- }
- .carSsImg{
- width: 40rpx;
- height: 40rpx;
- margin-top: 16rpx;
- margin-left: 20rpx;
- }
- .carssInput{
- line-height:72rpx;
- font-size: 28rpx;
- height:72rpx;
- padding-left: 16rpx;
- width: 600rpx;
- }
- .carssBox{
- display: flex;
- }
- .vinupImg{
- width: 208rpx;height: 203rpx;
-
- }
- .vincxBox{
- background: #FFFFFF;
- margin-top: 20rpx;
- padding: 30rpx;
- }
- .vinupbox{
- text-align: center;
- position: relative;
- }
- .vincxBtn{
- width: 560rpx;
- height: 74rpx;
- background: #3F90F7;
- border-radius: 37rpx;
- text-align: center;
- color: #FFFFFF;
- font-size: 30rpx;
- line-height: 74rpx;
- margin: 0 auto;
- margin-top: 40rpx;
- }
- .vinmsImg{
- width: 460rpx;
-
- }
- .vinupImg2{
- width: 160rpx;
- height: 160rpx;
- position: absolute;
- top:0;
- left: 270rpx;
- }
- .vinupNo{
- width: 35rpx;
- height: 35rpx;
- position: absolute;
- top: -18rpx;
- left: 420rpx;
- z-index: 10;
- }
- .vinmsbox{
- text-align: center;
- background: #FFFFFF;
- margin-top: 20rpx;
- padding-top: 30rpx;
- height: calc(100vh - 800rpx);
- }
- .vinms{
- color: #666666;
- font-size: 26rpx;
- padding-bottom: 20rpx;
- }
- .search-history{
- background: #FFFFFF;
- border: 1px solid #f0f0f0;
- z-index: 10;
- position: absolute;
- width: 600rpx;
- left: 75rpx;
- top: 100rpx;
- }
- .historyLine{
- color: #323233;
- padding: 15rpx;
- border-bottom: 1px solid #ebedf0;
- }
- .moreVinBox{
- position: fixed;
- width: 100vw;
- height: 100vh;
- background: rgba(0,0,0,0.5);
- top: 0;
- left: 0;
- z-index: 9999;
- }
- .moreVinTop{
- color: #FFFFFF;
- background: #3f90f7;
- border-radius: 20rpx 20rpx 0 0;
- line-height: 100rpx;
- padding-left: 24rpx;
- font-size: 28rpx;
- }
- .moreVin{
- background: #FFFFFF;
- width: 600rpx;
- margin-left: 75rpx;
- margin-top: 40vh;
- border-radius: 20rpx;
- overflow: hidden;
- }
- .moreVinline{
- display: flex;
- justify-content: space-between;
- font-size: 24rpx;
- color: #323233;
- padding: 30rpx 24rpx;
- border-bottom: 1px solid #ebedf0;
- }
- .moreVinJt{
- width: 12rpx;
- height: 20rpx;
- margin-top: 8rpx;
- }
- </style>
|