|
@@ -0,0 +1,230 @@
|
|
|
+<template>
|
|
|
+ <view class="p-content">
|
|
|
+ <view class="p-head">
|
|
|
+ <view>
|
|
|
+ <text>条形码:</text>
|
|
|
+ <view style="flex-grow: 1;display: flex;align-items: center;">
|
|
|
+ <input
|
|
|
+ style="width: 100%;text-align: left;font-size: 32rpx;padding: 6rpx 0 6rpx 7rpx;"
|
|
|
+ class="uni-input"
|
|
|
+ placeholder="扫描或输入条码"
|
|
|
+ border="surround"
|
|
|
+ v-model="query.qrCode">
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view>
|
|
|
+ <text>产品编码:</text>
|
|
|
+ <view style="flex-grow: 1;display: flex;align-items: center;">
|
|
|
+ <input
|
|
|
+ style="width: 100%;text-align: left;font-size: 32rpx;padding: 6rpx 0 6rpx 7rpx;"
|
|
|
+ class="uni-input"
|
|
|
+ placeholder="请输入产品编码"
|
|
|
+ border="surround"
|
|
|
+ v-model="query.code">
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view>
|
|
|
+ <text>产品名称:</text>
|
|
|
+ <view style="flex-grow: 1;display: flex;align-items: center;">
|
|
|
+ <input
|
|
|
+ style="width: 100%;text-align: left;font-size: 32rpx;padding: 6rpx 0 6rpx 7rpx;"
|
|
|
+ class="uni-input"
|
|
|
+ placeholder="请输入产品名称"
|
|
|
+ border="surround"
|
|
|
+ v-model="query.name">
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view>
|
|
|
+ <button type="primary" size="mini" @click="queryProduct" :style="{padding:'5px 20px'}">查询</button>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="p-body">
|
|
|
+ <uni-table border emptyText="暂无数据" :loading="loading" >
|
|
|
+ <!-- 表头行 -->
|
|
|
+ <uni-tr>
|
|
|
+ <uni-td align="center">条形码</uni-td>
|
|
|
+ <uni-td align="center">产品编码</uni-td>
|
|
|
+ <uni-td align="center">产品名称</uni-td>
|
|
|
+ </uni-tr>
|
|
|
+ <!-- 表格数据行 -->
|
|
|
+ <uni-tr
|
|
|
+ v-for="item in detailList" :key="item.id"
|
|
|
+ :checkedRow="tempProduct&&tempProduct.id == item.id"
|
|
|
+ @click="toEdit(item)">
|
|
|
+ <uni-td width="40%" align="center">{{item.qrCode}}</uni-td>
|
|
|
+ <uni-td width="30%" align="center">{{item.code}}</uni-td>
|
|
|
+ <uni-td width="30%" align="center">{{item.name}}</uni-td>
|
|
|
+ </uni-tr>
|
|
|
+ </uni-table>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <scanCode></scanCode>
|
|
|
+ <uni-popup ref="popup" :mask-click="false" type="dialog">
|
|
|
+ <view
|
|
|
+ style="
|
|
|
+ font-size: 30rpx;
|
|
|
+ background-color: #fff;
|
|
|
+ padding: 30rpx 50rpx;
|
|
|
+ border-radius: 30rpx;
|
|
|
+ width: 80%;
|
|
|
+ margin: 0 auto;">
|
|
|
+ <view style="line-height: 60rpx;" v-if="tempProduct">
|
|
|
+ <view>
|
|
|
+ 产品编码:{{tempProduct.code}}
|
|
|
+ </view>
|
|
|
+ <view>
|
|
|
+ 产品名称:{{tempProduct.name}}
|
|
|
+ </view>
|
|
|
+ <view style="display: flex;align-items: center;padding-top: 15rpx;">
|
|
|
+ 条形码:
|
|
|
+ <input
|
|
|
+ :focus="true"
|
|
|
+ style="width: 70%;text-align: left;border: 1px solid #eee;font-size: 32rpx;padding: 6rpx 0 6rpx 7rpx;"
|
|
|
+ class="uni-input"
|
|
|
+ placeholder="扫描或输入条码"
|
|
|
+ border="surround"
|
|
|
+ v-model="code">
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view style="display: flex;padding: 50rpx 15rpx 10rpx;justify-content: center;">
|
|
|
+ <button size="mini" @click="closePop" :style="{padding:'5px 20px'}">取消</button>
|
|
|
+ <button size="mini" type="primary" :loading="subloading" @click="okPop" :style="{padding:'5px 20px'}">确定</button>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </uni-popup>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ import {
|
|
|
+ dealerProductList,
|
|
|
+ dealerProductSave
|
|
|
+ } from '@/config/api.js'
|
|
|
+ import scanCode from '@/libs/scan-code.vue';
|
|
|
+ import { playAudio } from '@/libs/tools.js'
|
|
|
+ export default {
|
|
|
+ components: { scanCode },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ loading: false,
|
|
|
+ subloading: false,
|
|
|
+ query:{
|
|
|
+ qrCode:'',
|
|
|
+ name:'',
|
|
|
+ code:''
|
|
|
+ },
|
|
|
+ detailList:[],
|
|
|
+ code:'',
|
|
|
+ tempProduct: null
|
|
|
+ };
|
|
|
+ },
|
|
|
+ onLoad(opts) {
|
|
|
+ var _this = this
|
|
|
+ uni.$on('scancodedate', function(content) {
|
|
|
+ console.log("扫描到的内容为:", content)
|
|
|
+ _this.code = content||''
|
|
|
+ })
|
|
|
+
|
|
|
+ },
|
|
|
+ onShow() {
|
|
|
+ this.hideKeyborder()
|
|
|
+ },
|
|
|
+ onUnload() {
|
|
|
+ uni.$off('scancodedate')
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ closePop(){
|
|
|
+ this.$refs.popup.close()
|
|
|
+ },
|
|
|
+ okPop(){
|
|
|
+ if(this.code){
|
|
|
+ this.productSave()
|
|
|
+ }else{
|
|
|
+ uni.$u.toast("请输入或扫描条码!")
|
|
|
+ }
|
|
|
+ },
|
|
|
+ hideKeyborder(){
|
|
|
+ uni.hideKeyboard()
|
|
|
+ },
|
|
|
+ productSave(){
|
|
|
+ this.subloading = true
|
|
|
+ this.tempProduct.qrCode = this.code
|
|
|
+ dealerProductSave(this.tempProduct).then(res => {
|
|
|
+ if(res.status == 200){
|
|
|
+ this.queryProduct()
|
|
|
+ this.code == ''
|
|
|
+ this.closePop()
|
|
|
+ }
|
|
|
+ this.subloading = false
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 查询产品
|
|
|
+ queryProduct(){
|
|
|
+ if(this.query.code==''&&this.query.qrCode==''&&this.query.name==''){
|
|
|
+ uni.$u.toast("请输入查询条件!")
|
|
|
+ playAudio('error')
|
|
|
+ return
|
|
|
+ }
|
|
|
+ const params = {
|
|
|
+ pageNo:1,
|
|
|
+ pageSize:10 ,
|
|
|
+ sysFlag: "0"
|
|
|
+ }
|
|
|
+ console.log(params)
|
|
|
+ dealerProductList({...params,...this.query}).then(res => {
|
|
|
+ console.log(res)
|
|
|
+ if(res.status == 200){
|
|
|
+ this.detailList = res.data && res.data.list || []
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 编辑
|
|
|
+ toEdit(item) {
|
|
|
+ this.tempProduct = item
|
|
|
+ this.$refs.popup.open()
|
|
|
+ this.hideKeyborder()
|
|
|
+ }
|
|
|
+ },
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss">
|
|
|
+ .p-content{
|
|
|
+ button{
|
|
|
+ line-height: 1.7;
|
|
|
+ }
|
|
|
+ .p-head{
|
|
|
+ font-size: 32upx;
|
|
|
+ color: $uni-text-color;
|
|
|
+ >view{
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ padding: 15upx 20upx;
|
|
|
+ border-bottom: 1px solid #eee;
|
|
|
+ justify-content: space-between;
|
|
|
+ > view{
|
|
|
+ display: flex;
|
|
|
+ padding: 0 10upx;
|
|
|
+ align-items: center;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .uni-input{
|
|
|
+ border: 1px solid #eee;
|
|
|
+ width: 150upx;
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .p-body{
|
|
|
+ overflow: auto;
|
|
|
+ flex-grow: 1;
|
|
|
+ height: 50%;
|
|
|
+ }
|
|
|
+ .p-footer{
|
|
|
+ padding:20upx 30upx;
|
|
|
+ display: flex;
|
|
|
+ > button{
|
|
|
+ width: 30%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+</style>
|