|
@@ -0,0 +1,184 @@
|
|
|
+<template>
|
|
|
+ <f7-page name="home">
|
|
|
+
|
|
|
+ <div class="view view-main">
|
|
|
+ <!-- Navbar -->
|
|
|
+ <div class="navbar">
|
|
|
+ <div class="navbar-inner">
|
|
|
+ <div class="left">
|
|
|
+ <a href="#" @click="scanner" class="link icon-only"><i class="f7-icons size-50">add_round</i></a>
|
|
|
+ </div>
|
|
|
+ <div class="center sliding">KixScanner</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- Pages -->
|
|
|
+ <div class="pages navbar-through toolbar-through">
|
|
|
+ <div data-page="index" class="page">
|
|
|
+ <div class="page-content" v-if="loading=='1'">
|
|
|
+ <div class="card">
|
|
|
+ <div class="card-content">
|
|
|
+ <div class="load-wrapp">
|
|
|
+ <div class="load-3">
|
|
|
+ <div class="line"></div>
|
|
|
+ <div class="line"></div>
|
|
|
+ <div class="line"></div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="page-content" v-else>
|
|
|
+ <template v-if="error_message!=''">
|
|
|
+ <div class="content-block-title">錯誤訊息</div>
|
|
|
+ <div class="content-block">
|
|
|
+ <div class="content-block-inner">
|
|
|
+ <h3>{{ error_message }}</h3>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template v-if="message=='NA'">
|
|
|
+ <div class="content-block">
|
|
|
+ <div class="searchbar">
|
|
|
+ <div class="searchbar-inner">
|
|
|
+ <div class="searchbar-input-wrap">
|
|
|
+ <input type="search" placeholder="Search SKU" v-model="sku_text" @keyup.enter="textFind">
|
|
|
+ <i class="searchbar-icon"></i>
|
|
|
+ <span class="input-clear-button" @click="textFind"></span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="content-block" @click="scanner">
|
|
|
+ <img src="img/scanner.png" width="100%" alt="開始掃瞄">
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template v-else>
|
|
|
+ <div class="content-block">
|
|
|
+ <div class="searchbar">
|
|
|
+ <div class="searchbar-inner">
|
|
|
+ <div class="searchbar-input-wrap">
|
|
|
+ <input type="search" placeholder="Search SKU" v-model="sku_text" @keyup.enter="textFind">
|
|
|
+ <i class="searchbar-icon"></i>
|
|
|
+ <span class="input-clear-button" @click="textFind"></span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <template v-for="barcode in last_product">
|
|
|
+ <div :key="barcode.SKU">
|
|
|
+ <f7-card>
|
|
|
+ <f7-card-content :padding="false">
|
|
|
+ <img :src="barcode.Pics" width="100%"/>
|
|
|
+ </f7-card-content>
|
|
|
+ </f7-card>
|
|
|
+ <f7-card-content>
|
|
|
+ <p>型號: {{ barcode.SKU }}</p>
|
|
|
+ <p>品名: {{ barcode.Name }}</p>
|
|
|
+ <p>KName: {{ barcode.Kname }}</p>
|
|
|
+ <p>價格: {{ barcode.MSRP }}</p>
|
|
|
+ </f7-card-content>
|
|
|
+
|
|
|
+ <f7-block-title>庫存</f7-block-title>
|
|
|
+ <f7-list accordion-list>
|
|
|
+ <template v-for="(stock, index) in barcode.Stock.BranchStock">
|
|
|
+ <f7-list-item :key="index" accordion-item :title="stock.name">
|
|
|
+ <f7-accordion-content>
|
|
|
+ <f7-list>
|
|
|
+ <f7-list-item v-for="(key, val) in stock.size" :key="val">
|
|
|
+ {{ val }} : {{ key }}
|
|
|
+ </f7-list-item>
|
|
|
+ </f7-list>
|
|
|
+ </f7-accordion-content>
|
|
|
+ </f7-list-item>
|
|
|
+ </template>
|
|
|
+ </f7-list>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </template>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </f7-page>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import axios from 'axios'
|
|
|
+export default {
|
|
|
+ data () {
|
|
|
+ return {
|
|
|
+ url: "https://preerp.tranyi.com/scanners",
|
|
|
+ error_message: '',
|
|
|
+ message: '',
|
|
|
+ last_product: [],
|
|
|
+ loading: '0',
|
|
|
+ sku_text: '',
|
|
|
+ error_message: '',
|
|
|
+ message: 'NA',
|
|
|
+ response_json: '',
|
|
|
+ history: []
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ scanner () {
|
|
|
+ axios.get(this.url,{params: {barcode: this.sku_text}}).then(res => {
|
|
|
+ if (!res || JSON.stringify(res) == '{}') {
|
|
|
+ //無資料
|
|
|
+ this.error_message = this.sku_text + "(查無資料)"
|
|
|
+ this.last_product = []
|
|
|
+ } else {
|
|
|
+ //有資料
|
|
|
+ this.error_message = ''
|
|
|
+ this.message = this.sku_text
|
|
|
+ this.last_product = []
|
|
|
+ this.last_product.push(res)
|
|
|
+ }
|
|
|
+ }).catch(err => {
|
|
|
+ alert("網路連接錯誤,請確保內部網路連線正常。\n如仍有問題,請回報錯誤資訊:" + JSON.stringify(err))
|
|
|
+ })
|
|
|
+
|
|
|
+ // cordova.plugins.barcodeScanner.scan(
|
|
|
+ // function (result) {
|
|
|
+ // },
|
|
|
+ // function (error) {
|
|
|
+ // alert(error)
|
|
|
+ // },
|
|
|
+ // {
|
|
|
+ // // preferFrontCamera : true, // iOS and Android
|
|
|
+ // // showFlipCameraButton : true, // iOS and Android
|
|
|
+ // showTorchButton: true, // iOS and Android
|
|
|
+ // // torchOn: true, // Android, launch with the torch switched on (if available)
|
|
|
+ // prompt: "提示:點選右上角按鈕,可開啟手機閃光燈", // Android
|
|
|
+ // resultDisplayDuration: 500, // Android, display scanned text for X ms. 0 suppresses it entirely, default 1500
|
|
|
+ // formats: "CODE_128,EAN_13", // default: all but PDF_417 and RSS_EXPANDED
|
|
|
+ // // orientation : "landscape", // Android only (portrait|landscape), default unset so it rotates with the device
|
|
|
+ // // disableAnimations : true // iOS
|
|
|
+ // }
|
|
|
+ // )
|
|
|
+ },
|
|
|
+ textFind () {
|
|
|
+ axios.get(this.url, {params: {sku: this.sku_text}}).then(res => {
|
|
|
+ if (!res || JSON.stringify(res) == '{}') {
|
|
|
+ //無資料
|
|
|
+ this.error_message = this.sku_text + "(查無資料)"
|
|
|
+ this.last_product = []
|
|
|
+ } else {
|
|
|
+ //有資料
|
|
|
+ this.error_message = ''
|
|
|
+ this.message = this.sku_text
|
|
|
+ this.last_product = []
|
|
|
+ this.last_product.push(res.data)
|
|
|
+ console.log(res.data)
|
|
|
+ }
|
|
|
+ }).catch(err => {
|
|
|
+ alert("網路連接錯誤,請確保內部網路連線正常。\n如仍有問題,請回報錯誤資訊:" + JSON.stringify(err))
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|