|
|
|
|
@ -21,8 +21,8 @@
|
|
|
|
|
<a-button @click="handleAddDraw" size="small" type="primary">新增</a-button>
|
|
|
|
|
</a-space>
|
|
|
|
|
<standard-table :columns="columns" :dataSource="dataSource" :pagination="pagination" @clear="onClear"
|
|
|
|
|
@change="onChange" @selectedRowChange="onSelectChange" @showSizeChange="onShowSizeChange"
|
|
|
|
|
:scroll="{ x: 1100 }" rowKey="id">
|
|
|
|
|
@change="onChange" @selectedRowChange="onSelectChange" @showSizeChange="onShowSizeChange" :scroll="{ x: 1100 }"
|
|
|
|
|
rowKey="id">
|
|
|
|
|
<div slot="level" slot-scope="row">
|
|
|
|
|
{{ level[row.text] }}
|
|
|
|
|
</div>
|
|
|
|
|
@ -37,16 +37,13 @@
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div slot="action" slot-scope="{text, record}">
|
|
|
|
|
<a class="edit-btn" style="margin-right: 8px" @click="doCopy(text.nfcurl)"
|
|
|
|
|
v-show="record.verify_code.length > 0">
|
|
|
|
|
<a class="edit-btn" style="margin-right: 8px" @click="doCopy(text.nfcurl)">
|
|
|
|
|
<a-icon type="edit" />複製URL
|
|
|
|
|
</a>
|
|
|
|
|
<a class="edit-btn" download style="margin-right: 8px" @click="downloadQr(text)"
|
|
|
|
|
v-show="record.verify_code.length > 0">
|
|
|
|
|
<a class="edit-btn" download style="margin-right: 8px" @click="downloadQr(text)">
|
|
|
|
|
<a-icon type="edit" />下載QR
|
|
|
|
|
</a>
|
|
|
|
|
<a class="edit-btn" style="margin-right: 8px" v-show="record.verify_code.length > 0" v-print="printObj"
|
|
|
|
|
@click="printQr(text)">
|
|
|
|
|
<a class="edit-btn" style="margin-right: 8px" v-print="printObj" @click="printQr(text)">
|
|
|
|
|
<a-icon type="edit" />列印
|
|
|
|
|
</a>
|
|
|
|
|
<a class="delete-btn" @click="deleteCard(record.id)">
|
|
|
|
|
@ -64,15 +61,13 @@
|
|
|
|
|
<div id="qrcode" ref="qrcode"></div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<a-modal title="卡片讀碼" :width="350" :visible="showCodeScan" @cancel="handleCancel" :destroyOnClose="true"
|
|
|
|
|
<a-modal title="NFC製卡" :width="350" :visible="showCodeScan" @cancel="handleCancel" :destroyOnClose="true"
|
|
|
|
|
:footer="null" :afterClose="closeModal">
|
|
|
|
|
<div class="vcard-img" @click="handleFocus">
|
|
|
|
|
<img width="150" src="@/assets/images/applepay.gif">
|
|
|
|
|
</div>
|
|
|
|
|
<div :class="{ 'vcode-input-error': !vcodeStatus, 'vcode-input-info': vcodeStatus }">
|
|
|
|
|
<a-input v-model="vcode.code" type="password" autocomplete="off" ref="vcode" @keyup.enter="getVCode"
|
|
|
|
|
@blur="handleVCodeBlur"></a-input>
|
|
|
|
|
<a-input :value="vcodeMsg" type="text" @focus="handleFocus" style="top:-32px;"></a-input>
|
|
|
|
|
<a-input :value="vcodeMsg" type="text" style="top:-32px;"></a-input>
|
|
|
|
|
</div>
|
|
|
|
|
</a-modal>
|
|
|
|
|
</div>
|
|
|
|
|
@ -103,9 +98,9 @@ const columns = [
|
|
|
|
|
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: '代理',
|
|
|
|
|
dataIndex: 'agent_name',
|
|
|
|
|
key: 'agent_name',
|
|
|
|
|
title: '名稱',
|
|
|
|
|
dataIndex: 'name',
|
|
|
|
|
key: 'name',
|
|
|
|
|
width: 120
|
|
|
|
|
},
|
|
|
|
|
// {
|
|
|
|
|
@ -116,7 +111,7 @@ const columns = [
|
|
|
|
|
// },
|
|
|
|
|
{
|
|
|
|
|
title: '卡號',
|
|
|
|
|
dataIndex: 'verify_code',
|
|
|
|
|
dataIndex: 'serial_no',
|
|
|
|
|
width: 100
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
@ -255,16 +250,10 @@ export default {
|
|
|
|
|
|
|
|
|
|
},
|
|
|
|
|
async onSwitchChange(checked, rec) {
|
|
|
|
|
this.showCodeScan = true
|
|
|
|
|
this.vcode.id = rec.id
|
|
|
|
|
this.$nextTick(function () {
|
|
|
|
|
this.vcodeMsg = '請將卡片靠近讀卡機'
|
|
|
|
|
this.vcodeStatus = true
|
|
|
|
|
this.$refs.vcode.select()
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
if (checked === true) {
|
|
|
|
|
this.getVCode(rec.id)
|
|
|
|
|
}
|
|
|
|
|
return
|
|
|
|
|
|
|
|
|
|
},
|
|
|
|
|
onShowSizeChange(current, size) {
|
|
|
|
|
this.pagination.current = current
|
|
|
|
|
@ -340,6 +329,7 @@ export default {
|
|
|
|
|
console.log(this.vcode)
|
|
|
|
|
|
|
|
|
|
},
|
|
|
|
|
// 可能沒用
|
|
|
|
|
handleFocus() {
|
|
|
|
|
this.vcodeMsg = '請將卡片靠近讀卡機'
|
|
|
|
|
this.vcodeStatus = true
|
|
|
|
|
@ -349,42 +339,84 @@ export default {
|
|
|
|
|
this.vcodeMsg = '點擊此處開始偵測感應'
|
|
|
|
|
this.vcodeStatus = false
|
|
|
|
|
},
|
|
|
|
|
async getVCode() {
|
|
|
|
|
if (this.vcode.code.trim().length != 8 && this.vcode.code.trim().length != 14) {
|
|
|
|
|
this.vcode.code = ''
|
|
|
|
|
this.vcodeMsg = '掃碼失敗'
|
|
|
|
|
async getVCode(id) {
|
|
|
|
|
let nfcReaderUrl = 'http://localhost:8088'
|
|
|
|
|
|
|
|
|
|
this.showCodeScan = true
|
|
|
|
|
this.vcode.id = id
|
|
|
|
|
|
|
|
|
|
this.vcodeStatus = true
|
|
|
|
|
this.vcodeMsg = '請將卡片靠近讀卡機'
|
|
|
|
|
|
|
|
|
|
let res1 = await fetch(nfcReaderUrl + '/getnfcid', {
|
|
|
|
|
method: 'GET',
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
res1 = await res1.json()
|
|
|
|
|
|
|
|
|
|
if (res1.code !== 200) {
|
|
|
|
|
this.vcodeMsg = res1.error
|
|
|
|
|
this.vcodeStatus = false
|
|
|
|
|
setTimeout(() => {
|
|
|
|
|
this.vcodeMsg = '請將卡片靠近讀卡機'
|
|
|
|
|
this.vcodeStatus = true
|
|
|
|
|
this.showCodeScan = false
|
|
|
|
|
return this.$message.success('操作失敗')
|
|
|
|
|
}, 2000)
|
|
|
|
|
|
|
|
|
|
return
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
this.vcode.code = this.vcode.code.toUpperCase()
|
|
|
|
|
this.vcodeMsg = '讀取卡號' + res1.sid
|
|
|
|
|
this.vcode.code = res1.sid
|
|
|
|
|
|
|
|
|
|
const res = await updateVerifyCode(
|
|
|
|
|
let res2 = await updateVerifyCode(
|
|
|
|
|
this.vcode
|
|
|
|
|
)
|
|
|
|
|
|
|
|
|
|
this.vcode.code = ''
|
|
|
|
|
|
|
|
|
|
if (res.code !== 200) {
|
|
|
|
|
// return this.$message.error(res.data);
|
|
|
|
|
this.vcodeMsg = res.data
|
|
|
|
|
if (res2.code !== 200) {
|
|
|
|
|
this.vcodeMsg = res2.data
|
|
|
|
|
this.vcodeStatus = false
|
|
|
|
|
|
|
|
|
|
setTimeout(() => {
|
|
|
|
|
this.vcodeStatus = true
|
|
|
|
|
this.vcodeMsg = '請將卡片靠近讀卡機'
|
|
|
|
|
this.showCodeScan = false
|
|
|
|
|
return this.$message.success('操作失敗')
|
|
|
|
|
}, 2000)
|
|
|
|
|
|
|
|
|
|
return
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
this.vcodeMsg = '開始寫入卡片...'
|
|
|
|
|
|
|
|
|
|
const data = new URLSearchParams();
|
|
|
|
|
data.append('data', res2.data);
|
|
|
|
|
|
|
|
|
|
let res3 = await fetch(nfcReaderUrl + '/writenfc', {
|
|
|
|
|
method: 'POST',
|
|
|
|
|
body: data,
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
res3 = await res3.json()
|
|
|
|
|
|
|
|
|
|
if (res3.code !== 200) {
|
|
|
|
|
this.vcodeMsg = res3.error
|
|
|
|
|
this.vcodeStatus = false
|
|
|
|
|
setTimeout(() => {
|
|
|
|
|
this.showCodeScan = false
|
|
|
|
|
return this.$message.success('操作失敗')
|
|
|
|
|
}, 2000)
|
|
|
|
|
return
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
this.vcodeMsg = '寫入成功'
|
|
|
|
|
this.vcodeStatus = true
|
|
|
|
|
this.vcode.code = ''
|
|
|
|
|
this.vcode.id = null
|
|
|
|
|
|
|
|
|
|
this.genTable()
|
|
|
|
|
|
|
|
|
|
setTimeout(() => {
|
|
|
|
|
this.showCodeScan = false
|
|
|
|
|
return this.$message.success('操作成功')
|
|
|
|
|
}, 2000)
|
|
|
|
|
},
|
|
|
|
|
closeModal() {
|
|
|
|
|
this.vcode = { id: null, code: '' }
|
|
|
|
|
|
