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.
324 lines
7.1 KiB
324 lines
7.1 KiB
<template>
|
|
<view class="content">
|
|
<tn-avatar class="icon tn-icon-link" size="xl"></tn-avatar>
|
|
<tn-list-view :card="true" unlined="all" class="listView">
|
|
<tn-list-cell class="listItem-1">
|
|
<view>Url: {{ urlInfo.LinkValue }}</view>
|
|
</tn-list-cell>
|
|
<tn-list-cell class="listItem">
|
|
<tn-grid align="center" :col="col">
|
|
<block>
|
|
<tn-grid-item class="toolItem" @click="openUrl()">
|
|
<view class="tn-icon-plane"></view>
|
|
<view class="cutline"></view>
|
|
<view class="toolText">Open</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>
|
|
<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>
|
|
</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: 3,
|
|
urlInfo:{},
|
|
tableName: 'scan_code',
|
|
textImgUrl: '',
|
|
fastToolList:[
|
|
{
|
|
"index": 0,
|
|
"text":"Open",
|
|
"icon": "tn-icon-plane"
|
|
},
|
|
{
|
|
"index": 1,
|
|
"text":"Copy",
|
|
"icon": "tn-icon-copy-fill"
|
|
},
|
|
{
|
|
"index": 2,
|
|
"text":"Share",
|
|
"icon": "tn-icon-share-triangle"
|
|
}
|
|
]
|
|
}
|
|
},
|
|
async onLoad(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: {
|
|
|
|
//打开url
|
|
openUrl(){
|
|
let that = this;
|
|
uni.navigateTo({
|
|
url: '/pages/webview/webview?url=' + that.urlInfo.LinkValue
|
|
});
|
|
},
|
|
|
|
//分享
|
|
share(){
|
|
uni.shareWithSystem({
|
|
summary: '',
|
|
href: 'https://uniapp.dcloud.io',
|
|
success(){
|
|
// 分享完成，请注意此时不一定是成功分享
|
|
uni.showToast({
|
|
title: 'share success!'
|
|
});
|
|
},
|
|
fail(){
|
|
// 分享失败
|
|
uni.showToast({
|
|
title: 'share fail!'
|
|
});
|
|
}
|
|
})
|
|
},
|
|
|
|
//复制url结果
|
|
copyValue(){
|
|
let that = this;
|
|
//console.log('点击复制关键词事件')
|
|
uni.setClipboardData({
|
|
data: that.urlInfo.LinkValue,
|
|
success() {
|
|
uni.showToast({
|
|
title: 'copy success!'
|
|
});
|
|
}
|
|
})
|
|
},
|
|
|
|
// 打开数据库
|
|
async openSqlite(){
|
|
try{
|
|
let b = await openSqlite()
|
|
console.log('urlDb打开了');
|
|
}catch(e){
|
|
console.error("open db error",e)
|
|
}
|
|
},
|
|
|
|
// 关闭数据库
|
|
closedb(){
|
|
try{
|
|
closedb()
|
|
console.log('urlDb关闭了');
|
|
}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("数据添加成功!",data)
|
|
}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(params){
|
|
let that = this;
|
|
let data = JSON.parse(params);
|
|
let insertData = {
|
|
LinkValue : data.LinkValue,
|
|
imgUrl: data.imgUrl
|
|
}
|
|
that.urlInfo = insertData;
|
|
that.textImgUrl = 'file://'+that.urlInfo.imgUrl;
|
|
//console.log('urlInfo',that.urlInfo)
|
|
//写入db
|
|
await that.writeToDb("Url",that.urlInfo);
|
|
},
|
|
|
|
//获取历史信息
|
|
async getHistoryData(params){
|
|
console.log(params)
|
|
let that = this;
|
|
let data = JSON.parse(params);
|
|
that.urlInfo = data;
|
|
that.textImgUrl = 'file://'+that.urlInfo.imgUrl;
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.content {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
justify-content: center;
|
|
background-color: #000000;
|
|
height:100vh;
|
|
|
|
.listView{
|
|
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: 360rpx;
|
|
text-align: center;
|
|
}
|
|
|
|
.listItem{
|
|
//border: 2px solid yellow;
|
|
height: 160rpx;
|
|
//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;
|
|
margin-left: 20rpx;
|
|
margin-right: 20rpx;
|
|
|
|
.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>
|
|
|