安卓扫码器
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.
 
 
 
 

328 lines
7.7 KiB

<template>
<view class="content">
<tn-avatar class="icon tn-icon-all" size="xl"></tn-avatar>
<tn-list-view :card="true" unlined="all" class="listView">
<tn-list-cell class="listItem-1">
<view>code: {{ productInfo.message }}</view>
</tn-list-cell>
<tn-list-cell class="listItem">
<tn-grid align="center" :col="col">
<block class="block1">
<tn-grid-item class="toolItem" @click="openShoping()">
<view class="tn-icon-shop"></view>
<view class="cutline"></view>
<view class="toolText">View in store</view>
</tn-grid-item>
<tn-grid-item class="toolItem" @click="openWeb()">
<view class="tn-icon-search"></view>
<view class="cutline"></view>
<view class="toolText">Web Search</view>
</tn-grid-item>
<tn-grid-item class="toolItem" @click="copyValue()">
<view class="tn-icon-copy-fill"></view>
<view class="cutline"></view>
<view class="toolText">Copy</view>
</tn-grid-item>
<tn-grid-item class="toolItem" @click="share()">
<view class="tn-icon-share-triangle"></view>
<view class="cutline"></view>
<view class="toolText">Share</view>
</tn-grid-item>
</block>
</tn-grid>
</tn-list-cell>
<view class="cutline"></view>
<tn-list-cell class="listItem-ad">我是谷歌ad部分</tn-list-cell>
<tn-list-cell class="listItemBottom">
<image :src="textImgUrl" class="buttomImg"/>
</tn-list-cell>
</tn-list-view>
<text class="bottomText">Feedback or Suggestion</text>
</view>
</template>
<script>
import { openSqlite,executeSql,closedb,isTable,addSql} from "@/utils/database";
export default {
data() {
return {
col: 4,
productInfo:{},
tableName: 'scan_code',
textImgUrl: '',
}
},
async onLoad(option) {
console.log('onLoadOption',option)
let that = this;
//打开db
await that.openSqlite();
//判断是否存在表
await that.createTable();
//scan为写入,history为历史页面
if(option.category === 'scan'){
//获取初始化数据并写入db
await that.initData(option.data);
}else{
//查看历史页面
await that.getHistoryData(option.data);
}
},
onHide() {
let that = this;
that.closedb();
},
methods: {
//跳转亚马逊
openShoping(){
let that = this;
console.log('that.textInfo.message',that.productInfo.message)
uni.navigateTo({
url: '/pages/webview/webview?url=https://www.amazon.com/s?k=' + that.productInfo.message
//url: '/pages/webview/webview?url=http://www.google.com?wd=' + that.textInfo.message
});
},
//分享
share(){
uni.shareWithSystem({
summary: '',
href: 'https://uniapp.dcloud.io',
success(){
// 分享完成,请注意此时不一定是成功分享
uni.showToast({
title: 'share success!'
});
},
fail(){
// 分享失败
uni.showToast({
title: 'share fail!'
});
}
})
},
//打开内部浏览器
openWeb(){
let that = this;
console.log('that.textInfo.message',that.productInfo.message)
uni.navigateTo({
url: '/pages/webview/webview?url=https://www.baidu.com/s?wd=' + that.productInfo.message
//url: '/pages/webview/webview?url=http://www.google.com?wd=' + that.textInfo.message
});
},
//copy结果值
copyValue(){
let that = this;
//console.log('点击复制关键词事件')
uni.setClipboardData({
data: that.productInfo.message,
success() {
uni.showToast({
title: 'copy success!'
});
}
})
},
// 打开数据库
async openSqlite(){
try{
let b = await openSqlite()
console.log('db打开了');
}catch(e){
console.error("open db error",e)
}
},
// 关闭数据库
closedb(){
try{
closedb()
console.log('db关闭了');
}catch(e){
console.error("close db error",e)
}
},
// 创建表
async createTable(){
let sql = this.createTableSql_outbound()
try{
let exist = await isTable(this.tableName)
console.log("表是否存在",exist)
if(!exist){
let res = await executeSql(sql)
console.log("新增表scancode",res)
}else{
console.log("表scancode已存在")
}
}catch(e){
uni.showToast({
title:"insert table error",
icon:"none"
})
console.error("新增表报错scancode",e)
}
},
//写入扫描记录
async writeToDb(type,params){
try{
let data = {
category: type,
content: params
}
let b = await addSql(this.tableName,data)
console.log("数据添加成功!")
}catch(e){
console.error("insert data error!",e)
}
},
//创建表语句
createTableSql_outbound(){
return "CREATE TABLE IF NOT EXISTS `scan_code` (" +
" `id` INTEGER PRIMARY KEY AUTOINCREMENT," +
" `category` varchar(50) DEFAULT NULL ," +
" `content` text DEFAULT NULL ," +
" `createTime` datetime DEFAULT CURRENT_TIMESTAMP ," +
" `updateTime` datetime DEFAULT NULL default(datetime('now','localtime'))" +
"); "
},
//加载数据
async initData(option){
//console.log('initoption',option)
let that = this;
let data = JSON.parse(option);
let insertData = {
message : data.message,
imgUrl: data.imgUrl
}
that.productInfo = insertData;
that.textImgUrl = 'file://'+that.productInfo.imgUrl;
//写入db
await that.writeToDb("Product",that.productInfo);
},
//获取历史信息
async getHistoryData(params){
//console.log('historyparams',params)
let that = this;
const data = JSON.parse(params);
that.productInfo = data;
that.textImgUrl = 'file://'+that.productInfo.imgUrl;
}
}
}
</script>
<style lang="scss">
.content {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
background-color: #000000;
height:100vh;
.listView{
//border: 2px solid yellow;
z-index: 0;
position: relative;
width: 660rpx;
height: 1300rpx;
margin-top: 100rpx;
background-color: #141b29;
.listItem-1{
margin-top: 120rpx;
background-color: #141b29;
color: #fff;
//border: 2px solid yellow;
height: 160rpx;
text-align: center;
}
.listItem{
//border: 2px solid yellow;
height: 160rpx;
width: 660rpx;
//margin-top: 30px;
//padding-top: 30px;
background-color: #141b29;
color: #fff;
}
.toolItem{
//border: 2px solid red;
background-color: #141b29;
font-size: 60rpx;
color: #8f8f94;
height: 120rpx;
text-align: center;
.toolText{
font-size: 24rpx;
color: #8f8f94;
}
}
.listItem-ad{
background-color: #141b29;
text-align: center;
color: #fff;
//border: 2px solid red;
height: 160rpx;
}
.listItemBottom{
height: 400rpx;
margin-top: 20rpx;
background-color: #141b29;
color: #fff;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
.buttomImg{
width: 300rpx;
height: 300rpx;
}
}
}
.icon{
z-index: 1;
position: absolute;
margin-top: -620rpx;
background-color: #3e444d;
font-size: 120rpx;
color: #fff;
text-align: center;
}
.bottomText{
color: #fff;
text-align: center;
font-size: 24rpx;
margin-top: 40rpx;
margin-bottom: 40rpx;
}
.cutline{
border: 1px solid #8f8f94;
}
}
</style>