|
@@ -0,0 +1,173 @@
|
|
|
|
|
+<template>
|
|
|
|
|
+ <scTable ref="table" :apiObj="list.apiObj" :params="searchKey" @selectionChange="selectionChange" row-key="id">
|
|
|
|
|
+ <el-table-column type="selection" width="50" fixed="left"></el-table-column>
|
|
|
|
|
+ <el-table-column label="序列号" prop="sn" width="220" fixed="left">
|
|
|
|
|
+ <template #default="scope">
|
|
|
|
|
+ <span v-if="scope.row.sn">{{ scope.row.sn }}</span>
|
|
|
|
|
+ <span class="status-danger" v-else>未设置</span>
|
|
|
|
|
+ </template>
|
|
|
|
|
+ </el-table-column>
|
|
|
|
|
+ <el-table-column label="打印机名称" prop="name" width="220">
|
|
|
|
|
+ <template #default="scope">
|
|
|
|
|
+ <span v-if="scope.row.name">{{ scope.row.name }}</span>
|
|
|
|
|
+ <span class="status-danger" v-else>未设置</span>
|
|
|
|
|
+ </template>
|
|
|
|
|
+ </el-table-column>
|
|
|
|
|
+ <el-table-column label="所属代理" prop="status" width="160">
|
|
|
|
|
+ <template #default="scope">
|
|
|
|
|
+ <span>{{ scope.row.agent?scope.row.agent.name:'未绑定' }}</span>
|
|
|
|
|
+ </template>
|
|
|
|
|
+ </el-table-column>
|
|
|
|
|
+ <el-table-column label="所属店铺" prop="status" width="160">
|
|
|
|
|
+ <template #default="scope">
|
|
|
|
|
+ <span>{{ scope.row.store?scope.row.store.store_name:'未绑定' }}</span>
|
|
|
|
|
+ </template>
|
|
|
|
|
+ </el-table-column>
|
|
|
|
|
+ <el-table-column label="设备状态" prop="device_state" width="160">
|
|
|
|
|
+ <template #default="scope">
|
|
|
|
|
+ <div class="status-success" v-if="scope.row.device_state==0"><sc-status-indicator type="success"></sc-status-indicator> 正常</div>
|
|
|
|
|
+ <div class="status-danger" v-if="scope.row.device_state==1"><sc-status-indicator type="danger"></sc-status-indicator> 开盖</div>
|
|
|
|
|
+ <div class="status-info" v-if="scope.row.device_state==2"><sc-status-indicator type="info"></sc-status-indicator> 粘纸</div>
|
|
|
|
|
+ <div class="status-info" v-if="scope.row.device_state==3"><sc-status-indicator type="info"></sc-status-indicator> 缺纸</div>
|
|
|
|
|
+ </template>
|
|
|
|
|
+ </el-table-column>
|
|
|
|
|
+ <el-table-column label="在线状态" prop="status" width="160">
|
|
|
|
|
+ <template #default="scope">
|
|
|
|
|
+ <div class="status-success" v-if="scope.row.online=='ONLINE'"><sc-status-indicator type="success"></sc-status-indicator> 正常</div>
|
|
|
|
|
+ <div class="status-danger" v-if="scope.row.online=='OFFLINE'"><sc-status-indicator type="danger"></sc-status-indicator> 离线</div>
|
|
|
|
|
+ <div class="status-info" v-if="scope.row.online=='UNACTIVE'"><sc-status-indicator type="info"></sc-status-indicator> 未激活</div>
|
|
|
|
|
+ <div class="status-info" v-if="scope.row.online=='DISABLE'"><sc-status-indicator type="info"></sc-status-indicator> 已禁用</div>
|
|
|
|
|
+ </template>
|
|
|
|
|
+ </el-table-column>
|
|
|
|
|
+ <el-table-column label="创建时间" prop="create_at" width="180"></el-table-column>
|
|
|
|
|
+ <el-table-column label="操作" width="220" align="right" fixed="right">
|
|
|
|
|
+ <template #default="scope">
|
|
|
|
|
+ <el-button-group>
|
|
|
|
|
+ <el-button text type="warning" size="small" @click="table_bind(scope.row)">绑定门店</el-button>
|
|
|
|
|
+ <el-button text type="success" size="small" @click="table_print(scope.row)">打印测试</el-button>
|
|
|
|
|
+ <el-popconfirm title="确定删除并解绑该打印机吗?" @confirm="table_del(scope.row, scope.$index)">
|
|
|
|
|
+ <template #reference>
|
|
|
|
|
+ <el-button text type="danger" size="small">删除</el-button>
|
|
|
|
|
+ </template>
|
|
|
|
|
+ </el-popconfirm>
|
|
|
|
|
+ </el-button-group>
|
|
|
|
|
+ </template>
|
|
|
|
|
+ </el-table-column>
|
|
|
|
|
+ </scTable>
|
|
|
|
|
+ <formMain ref="formMain" @success="handleSuccess"></formMain>
|
|
|
|
|
+ <storeData ref="storeData" :multiple="false" @success="handleStore"></storeData>
|
|
|
|
|
+</template>
|
|
|
|
|
+
|
|
|
|
|
+<script>
|
|
|
|
|
+import formMain from './form';
|
|
|
|
|
+import storeData from "@/views/manage/components/store";
|
|
|
|
|
+export default {
|
|
|
|
|
+ components: {
|
|
|
|
|
+ formMain,
|
|
|
|
|
+ storeData
|
|
|
|
|
+ },
|
|
|
|
|
+ data(){
|
|
|
|
|
+ return {
|
|
|
|
|
+ list: {
|
|
|
|
|
+ apiObj: this.$API.print.list
|
|
|
|
|
+ },
|
|
|
|
|
+ dataSelect:[],
|
|
|
|
|
+ dataSelectFull:[],
|
|
|
|
|
+ searchKey:{},
|
|
|
|
|
+ bindData:{}
|
|
|
|
|
+ }
|
|
|
|
|
+ },
|
|
|
|
|
+ methods: {
|
|
|
|
|
+ async table_print(data){
|
|
|
|
|
+ var loading = this.$loading();
|
|
|
|
|
+ var resp = await this.$API.print.test.post({'sn':data.sn});
|
|
|
|
|
+ loading.close();
|
|
|
|
|
+ if (resp.code == 0) {
|
|
|
|
|
+ return this.$message.error(resp.msg);
|
|
|
|
|
+ }
|
|
|
|
|
+ this.$message.success(resp.msg);
|
|
|
|
|
+ },
|
|
|
|
|
+ async handleStore(data){
|
|
|
|
|
+ var loading = this.$loading();
|
|
|
|
|
+ var resp = await this.$API.print.edit.post({"sn":this.bindData.sn,'id':this.bindData.id,'agent_id':data.agent_id,'store_id':data.store_id});
|
|
|
|
|
+ loading.close();
|
|
|
|
|
+ if (resp.code == 0) {
|
|
|
|
|
+ return this.$message.error(resp.msg);
|
|
|
|
|
+ }
|
|
|
|
|
+ this.$message.success(resp.msg);
|
|
|
|
|
+ var that = this;
|
|
|
|
|
+ setTimeout(function(){
|
|
|
|
|
+ that.refresh()
|
|
|
|
|
+ },1500);
|
|
|
|
|
+ },
|
|
|
|
|
+ table_bind(data){
|
|
|
|
|
+ this.bindData = data;
|
|
|
|
|
+ this.$nextTick(() => {
|
|
|
|
|
+ this.$refs.storeData.open()
|
|
|
|
|
+ })
|
|
|
|
|
+ },
|
|
|
|
|
+ refresh(){
|
|
|
|
|
+ this.$refs.table.refresh()
|
|
|
|
|
+ },
|
|
|
|
|
+ upData(data){
|
|
|
|
|
+ this.$refs.table.upData(data)
|
|
|
|
|
+ },
|
|
|
|
|
+ handleSuccess(){
|
|
|
|
|
+ this.$refs.table.refresh()
|
|
|
|
|
+ },
|
|
|
|
|
+ sortChange(event){
|
|
|
|
|
+ if (event.order) {
|
|
|
|
|
+ var data = {
|
|
|
|
|
+ "field":event.prop,
|
|
|
|
|
+ "order":event.order
|
|
|
|
|
+ }
|
|
|
|
|
+ this.$refs.table.upData(data)
|
|
|
|
|
+ } else {
|
|
|
|
|
+ this.$refs.table.reload(this.searchKey)
|
|
|
|
|
+ }
|
|
|
|
|
+ return ;
|
|
|
|
|
+ },
|
|
|
|
|
+ selectionChange(event){
|
|
|
|
|
+ this.dataSelect = [];
|
|
|
|
|
+ var arr = [];
|
|
|
|
|
+ var arrCompany = [];
|
|
|
|
|
+ event.forEach(function(val,index){
|
|
|
|
|
+ arr[index] = val.id;
|
|
|
|
|
+ arrCompany[index] = val;
|
|
|
|
|
+ });
|
|
|
|
|
+ this.dataSelectFull = arrCompany;
|
|
|
|
|
+ this.dataSelect = arr;
|
|
|
|
|
+ this.$emit("success",this.dataSelect);
|
|
|
|
|
+ this.$emit("successFull",this.dataSelectFull);
|
|
|
|
|
+ },
|
|
|
|
|
+ }
|
|
|
|
|
+}
|
|
|
|
|
+</script>
|
|
|
|
|
+
|
|
|
|
|
+<style>
|
|
|
|
|
+.desc{
|
|
|
|
|
+ color: #999;
|
|
|
|
|
+ font-size: 12px;
|
|
|
|
|
+}
|
|
|
|
|
+.flex-btn{
|
|
|
|
|
+ display: flex;
|
|
|
|
|
+ flex-wrap: wrap;
|
|
|
|
|
+ gap: 5px;
|
|
|
|
|
+}
|
|
|
|
|
+.flex-tags {
|
|
|
|
|
+ display: flex;
|
|
|
|
|
+ gap: 2px;
|
|
|
|
|
+ flex-wrap: wrap;
|
|
|
|
|
+}
|
|
|
|
|
+.flex-btn .el-button.is-text{
|
|
|
|
|
+ margin-left: 0;
|
|
|
|
|
+}
|
|
|
|
|
+.flex-tags-size{
|
|
|
|
|
+ font-size: 12px;
|
|
|
|
|
+}
|
|
|
|
|
+.flex-tags-size span{
|
|
|
|
|
+ display: block;
|
|
|
|
|
+ margin-bottom: 5px;
|
|
|
|
|
+ color: #999;
|
|
|
|
|
+}
|
|
|
|
|
+</style>
|