|
@@ -1,12 +1,20 @@
|
|
|
<template>
|
|
|
<div class="app-container">
|
|
|
- <el-form :model="queryParams" class="main-search" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
|
|
|
+ <el-form
|
|
|
+ :model="queryParams"
|
|
|
+ class="main-search"
|
|
|
+ ref="queryForm"
|
|
|
+ size="small"
|
|
|
+ :inline="true"
|
|
|
+ v-show="showSearch"
|
|
|
+ label-width="68px"
|
|
|
+ >
|
|
|
<el-form-item label="设备名称" prop="name">
|
|
|
<el-input
|
|
|
v-model="queryParams.name"
|
|
|
placeholder="请输入打印机名称"
|
|
|
clearable
|
|
|
- style="width: 200px;"
|
|
|
+ style="width: 200px"
|
|
|
@keyup.enter.native="handleQuery"
|
|
|
/>
|
|
|
</el-form-item>
|
|
@@ -15,7 +23,7 @@
|
|
|
v-model="queryParams.sn"
|
|
|
placeholder="请输入打印机编号"
|
|
|
clearable
|
|
|
- style="width: 200px;"
|
|
|
+ style="width: 200px"
|
|
|
@keyup.enter.native="handleQuery"
|
|
|
/>
|
|
|
</el-form-item>
|
|
@@ -26,7 +34,12 @@
|
|
|
clearable
|
|
|
style="width: 180px"
|
|
|
>
|
|
|
- <el-option v-for="storeInfo in storeList" :key="storeInfo.id" :label="storeInfo.name" :value="storeInfo.id"/>
|
|
|
+ <el-option
|
|
|
+ v-for="storeInfo in storeList"
|
|
|
+ :key="storeInfo.id"
|
|
|
+ :label="storeInfo.name"
|
|
|
+ :value="storeInfo.id"
|
|
|
+ />
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="状态" prop="status">
|
|
@@ -36,13 +49,21 @@
|
|
|
clearable
|
|
|
style="width: 100px"
|
|
|
>
|
|
|
- <el-option key="A" label="启用" value="A"/>
|
|
|
- <el-option key="N" label="禁用" value="N"/>
|
|
|
+ <el-option key="A" label="启用" value="A" />
|
|
|
+ <el-option key="N" label="禁用" value="N" />
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
<el-form-item>
|
|
|
- <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
|
|
|
- <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
|
|
|
+ <el-button
|
|
|
+ type="primary"
|
|
|
+ icon="el-icon-search"
|
|
|
+ size="mini"
|
|
|
+ @click="handleQuery"
|
|
|
+ >搜索</el-button
|
|
|
+ >
|
|
|
+ <el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
|
|
|
+ >重置</el-button
|
|
|
+ >
|
|
|
<el-button
|
|
|
type="primary"
|
|
|
plain
|
|
@@ -50,19 +71,26 @@
|
|
|
size="mini"
|
|
|
@click="handleAdd"
|
|
|
v-hasPermi="['printer:index']"
|
|
|
- >新增云打印设备</el-button>
|
|
|
- <el-button type="primary" icon="el-icon-setting" size="mini" v-hasPermi="['printer:setting']" @click="handleSetting">设置芯烨账号</el-button>
|
|
|
+ >新增云打印设备</el-button
|
|
|
+ >
|
|
|
</el-form-item>
|
|
|
</el-form>
|
|
|
|
|
|
- <el-table ref="tables" v-loading="loading" :data="list" @selection-change="handleSelectionChange" :default-sort="defaultSort" @sort-change="handleSortChange">
|
|
|
- <el-table-column label="ID" prop="id" width="55"/>
|
|
|
+ <el-table
|
|
|
+ ref="tables"
|
|
|
+ v-loading="loading"
|
|
|
+ :data="list"
|
|
|
+ @selection-change="handleSelectionChange"
|
|
|
+ :default-sort="defaultSort"
|
|
|
+ @sort-change="handleSortChange"
|
|
|
+ >
|
|
|
+ <el-table-column label="ID" prop="id" width="55" />
|
|
|
<el-table-column label="设备名称" align="center" prop="name" />
|
|
|
<el-table-column label="设备编号" align="center" prop="sn" />
|
|
|
<el-table-column label="所属店铺" align="center" prop="store">
|
|
|
<template slot-scope="scope">
|
|
|
<span v-if="scope.row.storeId && scope.row.storeId > 0">
|
|
|
- <span>{{ getName(storeList, scope.row.storeId) }}</span>
|
|
|
+ <span>{{ getName(storeList, scope.row.storeId) }}</span>
|
|
|
</span>
|
|
|
<span v-else>公共所有</span>
|
|
|
</template>
|
|
@@ -87,7 +115,11 @@
|
|
|
></el-switch>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
- <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
|
|
+ <el-table-column
|
|
|
+ label="操作"
|
|
|
+ align="center"
|
|
|
+ class-name="small-padding fixed-width"
|
|
|
+ >
|
|
|
<template slot-scope="scope">
|
|
|
<el-button
|
|
|
size="mini"
|
|
@@ -95,20 +127,22 @@
|
|
|
icon="el-icon-edit"
|
|
|
v-hasPermi="['printer:index']"
|
|
|
@click="handleUpdate(scope.row)"
|
|
|
- >修改</el-button>
|
|
|
+ >修改</el-button
|
|
|
+ >
|
|
|
<el-button
|
|
|
size="mini"
|
|
|
type="text"
|
|
|
icon="el-icon-delete"
|
|
|
v-hasPermi="['printer:index']"
|
|
|
@click="handleDelete(scope.row)"
|
|
|
- >删除</el-button>
|
|
|
+ >删除</el-button
|
|
|
+ >
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
</el-table>
|
|
|
|
|
|
<pagination
|
|
|
- v-show="total>0"
|
|
|
+ v-show="total > 0"
|
|
|
:total="total"
|
|
|
:page.sync="queryParams.page"
|
|
|
:limit.sync="queryParams.pageSize"
|
|
@@ -116,19 +150,33 @@
|
|
|
/>
|
|
|
|
|
|
<!-- 添加或修改对话框 start-->
|
|
|
- <el-dialog :title="title" :visible.sync="open" class="common-dialog" width="700px" append-to-body>
|
|
|
+ <el-dialog
|
|
|
+ :title="title"
|
|
|
+ :visible.sync="open"
|
|
|
+ class="common-dialog"
|
|
|
+ width="700px"
|
|
|
+ append-to-body
|
|
|
+ >
|
|
|
<el-form ref="form" :model="form" :rules="rules" label-width="120px">
|
|
|
<el-row>
|
|
|
<el-col :span="24">
|
|
|
<el-form-item label="设备名称" prop="name">
|
|
|
- <el-input v-model="form.name" placeholder="请输入打印机名称" maxlength="200" />
|
|
|
+ <el-input
|
|
|
+ v-model="form.name"
|
|
|
+ placeholder="请输入打印机名称"
|
|
|
+ maxlength="200"
|
|
|
+ />
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
<el-row>
|
|
|
<el-col :span="24">
|
|
|
<el-form-item label="设备编号" prop="sn">
|
|
|
- <el-input v-model="form.sn" placeholder="请输入打印机编号" maxlength="200" />
|
|
|
+ <el-input
|
|
|
+ v-model="form.sn"
|
|
|
+ placeholder="请输入打印机编号"
|
|
|
+ maxlength="200"
|
|
|
+ />
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
@@ -140,8 +188,18 @@
|
|
|
style="width: 260px"
|
|
|
placeholder="所属店铺,空则为公共所有"
|
|
|
>
|
|
|
- <el-option :key="0" label="公共所有" v-if="!this.$store.getters.storeId" :value="0"/>
|
|
|
- <el-option v-for="storeInfo in storeList" :key="storeInfo.id" :label="storeInfo.name" :value="storeInfo.id"/>
|
|
|
+ <el-option
|
|
|
+ :key="0"
|
|
|
+ label="公共所有"
|
|
|
+ v-if="!this.$store.getters.storeId"
|
|
|
+ :value="0"
|
|
|
+ />
|
|
|
+ <el-option
|
|
|
+ v-for="storeInfo in storeList"
|
|
|
+ :key="storeInfo.id"
|
|
|
+ :label="storeInfo.name"
|
|
|
+ :value="storeInfo.id"
|
|
|
+ />
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
@@ -179,7 +237,12 @@
|
|
|
<el-row>
|
|
|
<el-col :span="24">
|
|
|
<el-form-item label="备注信息">
|
|
|
- <el-input v-model="form.description" type="textarea" rows="5" placeholder="请输入备注信息"></el-input>
|
|
|
+ <el-input
|
|
|
+ v-model="form.description"
|
|
|
+ type="textarea"
|
|
|
+ rows="5"
|
|
|
+ placeholder="请输入备注信息"
|
|
|
+ ></el-input>
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
@@ -202,19 +265,38 @@
|
|
|
<!-- 添加或修改对话框 end-->
|
|
|
|
|
|
<!-- 打印设置对话框 start-->
|
|
|
- <el-dialog title="芯烨云打印设置" :visible.sync="openSetting" class="common-dialog" width="700px" append-to-body>
|
|
|
- <el-form ref="settingForm" :model="settingForm" :rules="settingRules" label-width="120px">
|
|
|
+ <el-dialog
|
|
|
+ title="芯烨云打印设置"
|
|
|
+ :visible.sync="openSetting"
|
|
|
+ class="common-dialog"
|
|
|
+ width="700px"
|
|
|
+ append-to-body
|
|
|
+ >
|
|
|
+ <el-form
|
|
|
+ ref="settingForm"
|
|
|
+ :model="settingForm"
|
|
|
+ :rules="settingRules"
|
|
|
+ label-width="120px"
|
|
|
+ >
|
|
|
<el-row>
|
|
|
<el-col :span="24">
|
|
|
<el-form-item label="开发者ID" prop="userName">
|
|
|
- <el-input v-model="settingForm.userName" placeholder="请输入开发者ID" maxlength="200" />
|
|
|
+ <el-input
|
|
|
+ v-model="settingForm.userName"
|
|
|
+ placeholder="请输入开发者ID"
|
|
|
+ maxlength="200"
|
|
|
+ />
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
<el-row>
|
|
|
<el-col :span="24">
|
|
|
<el-form-item label="开发者密钥" prop="userKey">
|
|
|
- <el-input v-model="settingForm.userKey" placeholder="请输入开发者密钥" maxlength="200" />
|
|
|
+ <el-input
|
|
|
+ v-model="settingForm.userKey"
|
|
|
+ placeholder="请输入开发者密钥"
|
|
|
+ maxlength="200"
|
|
|
+ />
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
@@ -239,7 +321,14 @@
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-import { getPrinterList, updatePrinterStatus, getPrinterInfo, savePrinter, saveSetting, getSettingInfo } from "@/api/printer";
|
|
|
+import {
|
|
|
+ getPrinterList,
|
|
|
+ updatePrinterStatus,
|
|
|
+ getPrinterInfo,
|
|
|
+ savePrinter,
|
|
|
+ saveSetting,
|
|
|
+ getSettingInfo,
|
|
|
+} from "@/api/printer";
|
|
|
export default {
|
|
|
name: "PrinterList",
|
|
|
data() {
|
|
@@ -261,45 +350,75 @@ export default {
|
|
|
// 是否显示弹出层
|
|
|
open: false,
|
|
|
// 默认排序
|
|
|
- defaultSort: {prop: 'sort', order: 'ascending'},
|
|
|
+ defaultSort: { prop: "sort", order: "ascending" },
|
|
|
// 表单参数
|
|
|
- form: { id: '', name: '', sn: '', beforePay: 'Y', afterPay: 'Y', autoPrint: 'Y', storeId: 0, status: "A", sort: 0 },
|
|
|
+ form: {
|
|
|
+ id: "",
|
|
|
+ name: "",
|
|
|
+ sn: "",
|
|
|
+ beforePay: "Y",
|
|
|
+ afterPay: "Y",
|
|
|
+ autoPrint: "Y",
|
|
|
+ storeId: 0,
|
|
|
+ status: "A",
|
|
|
+ sort: 0,
|
|
|
+ },
|
|
|
// 店铺列表
|
|
|
storeList: [],
|
|
|
// 查询参数
|
|
|
queryParams: {
|
|
|
page: 1,
|
|
|
pageSize: 10,
|
|
|
- name: '',
|
|
|
- sn: '',
|
|
|
- storeId: '',
|
|
|
- status: ''
|
|
|
+ name: "",
|
|
|
+ sn: "",
|
|
|
+ storeId: "",
|
|
|
+ status: "",
|
|
|
},
|
|
|
// 表单校验
|
|
|
rules: {
|
|
|
name: [
|
|
|
{ required: true, message: "名称不能为空", trigger: "blur" },
|
|
|
- { min: 2, max: 200, message: '名称长度必须介于2 和 50 之间', trigger: 'blur' }
|
|
|
+ {
|
|
|
+ min: 2,
|
|
|
+ max: 200,
|
|
|
+ message: "名称长度必须介于2 和 50 之间",
|
|
|
+ trigger: "blur",
|
|
|
+ },
|
|
|
],
|
|
|
sn: [
|
|
|
{ required: true, message: "编号不能为空", trigger: "blur" },
|
|
|
- { min: 2, max: 200, message: '编号长度必须介于2 和 64 之间', trigger: 'blur' }
|
|
|
+ {
|
|
|
+ min: 2,
|
|
|
+ max: 200,
|
|
|
+ message: "编号长度必须介于2 和 64 之间",
|
|
|
+ trigger: "blur",
|
|
|
+ },
|
|
|
],
|
|
|
},
|
|
|
// 打印设置
|
|
|
openSetting: false,
|
|
|
- settingForm: { userName: '', userKey: '', enable: 'Y' },
|
|
|
+ settingForm: { userName: "", userKey: "", enable: "Y" },
|
|
|
// 表单校验
|
|
|
settingRules: {
|
|
|
userName: [
|
|
|
{ required: true, message: "名称不能为空", trigger: "blur" },
|
|
|
- { min: 2, max: 200, message: '名称长度必须介于2 和 50 之间', trigger: 'blur' }
|
|
|
+ {
|
|
|
+ min: 2,
|
|
|
+ max: 200,
|
|
|
+ message: "名称长度必须介于2 和 50 之间",
|
|
|
+ trigger: "blur",
|
|
|
+ },
|
|
|
],
|
|
|
userKey: [
|
|
|
{ required: true, message: "编号不能为空", trigger: "blur" },
|
|
|
- { min: 2, max: 200, message: '编号长度必须介于2 和 64 之间', trigger: 'blur' }
|
|
|
+ {
|
|
|
+ min: 2,
|
|
|
+ max: 200,
|
|
|
+ message: "编号长度必须介于2 和 64 之间",
|
|
|
+ trigger: "blur",
|
|
|
+ },
|
|
|
],
|
|
|
- }
|
|
|
+ },
|
|
|
};
|
|
|
},
|
|
|
created() {
|
|
@@ -309,13 +428,12 @@ export default {
|
|
|
// 查询列表
|
|
|
getList() {
|
|
|
this.loading = true;
|
|
|
- getPrinterList(this.queryParams).then( response => {
|
|
|
- this.list = response.data.paginationResponse.content;
|
|
|
- this.total = response.data.paginationResponse.totalElements;
|
|
|
- this.storeList = response.data.storeList;
|
|
|
- this.loading = false;
|
|
|
- }
|
|
|
- );
|
|
|
+ getPrinterList(this.queryParams).then((response) => {
|
|
|
+ this.list = response.data.paginationResponse.content;
|
|
|
+ this.total = response.data.paginationResponse.totalElements;
|
|
|
+ this.storeList = response.data.storeList;
|
|
|
+ this.loading = false;
|
|
|
+ });
|
|
|
},
|
|
|
// 搜索按钮操作
|
|
|
handleQuery() {
|
|
@@ -324,7 +442,7 @@ export default {
|
|
|
},
|
|
|
// 打印设置
|
|
|
handleSetting() {
|
|
|
- getSettingInfo().then(response => {
|
|
|
+ getSettingInfo().then((response) => {
|
|
|
this.settingForm.userName = response.data.userName;
|
|
|
this.settingForm.userKey = response.data.userKey;
|
|
|
this.settingForm.enable = response.data.enable;
|
|
@@ -334,24 +452,28 @@ export default {
|
|
|
// 重置按钮操作
|
|
|
resetQuery() {
|
|
|
this.resetForm("queryForm");
|
|
|
- this.$refs.tables.sort(this.defaultSort.prop, this.defaultSort.order)
|
|
|
+ this.$refs.tables.sort(this.defaultSort.prop, this.defaultSort.order);
|
|
|
this.handleQuery();
|
|
|
},
|
|
|
// 状态修改
|
|
|
handleStatusChange(row) {
|
|
|
let text = row.status == "A" ? "启用" : "禁用";
|
|
|
- this.$modal.confirm('确认要' + text + '"' + row.title + '"吗?').then(function() {
|
|
|
- return updatePrinterStatus(row.id, row.status);
|
|
|
- }).then(() => {
|
|
|
- this.$modal.msgSuccess(text + "成功");
|
|
|
- }).catch(function() {
|
|
|
- row.status = row.status === "N" ? "A" : "N";
|
|
|
- });
|
|
|
+ this.$modal
|
|
|
+ .confirm("确认要" + text + '"' + row.title + '"吗?')
|
|
|
+ .then(function () {
|
|
|
+ return updatePrinterStatus(row.id, row.status);
|
|
|
+ })
|
|
|
+ .then(() => {
|
|
|
+ this.$modal.msgSuccess(text + "成功");
|
|
|
+ })
|
|
|
+ .catch(function () {
|
|
|
+ row.status = row.status === "N" ? "A" : "N";
|
|
|
+ });
|
|
|
},
|
|
|
// 多选框选中数据
|
|
|
handleSelectionChange(selection) {
|
|
|
- this.ids = selection.map(item => item.id)
|
|
|
- this.multiple = !selection.length
|
|
|
+ this.ids = selection.map((item) => item.id);
|
|
|
+ this.multiple = !selection.length;
|
|
|
},
|
|
|
// 排序触发事件
|
|
|
handleSortChange(column, prop, order) {
|
|
@@ -373,8 +495,8 @@ export default {
|
|
|
sn: "",
|
|
|
storeId: "",
|
|
|
autoPrint: "Y",
|
|
|
- beforePay: 'Y',
|
|
|
- afterPay: 'Y',
|
|
|
+ beforePay: "Y",
|
|
|
+ afterPay: "Y",
|
|
|
description: "",
|
|
|
status: "A",
|
|
|
};
|
|
@@ -386,21 +508,21 @@ export default {
|
|
|
this.reset();
|
|
|
},
|
|
|
// 提交按钮
|
|
|
- submitForm: function() {
|
|
|
- this.$refs["form"].validate(valid => {
|
|
|
+ submitForm: function () {
|
|
|
+ this.$refs["form"].validate((valid) => {
|
|
|
if (valid) {
|
|
|
if (this.form.id) {
|
|
|
- savePrinter(this.form).then(response => {
|
|
|
- this.$modal.msgSuccess("修改成功");
|
|
|
- this.open = false;
|
|
|
- this.getList();
|
|
|
- });
|
|
|
+ savePrinter(this.form).then((response) => {
|
|
|
+ this.$modal.msgSuccess("修改成功");
|
|
|
+ this.open = false;
|
|
|
+ this.getList();
|
|
|
+ });
|
|
|
} else {
|
|
|
- savePrinter(this.form).then(response => {
|
|
|
- this.$modal.msgSuccess("新增成功");
|
|
|
- this.open = false;
|
|
|
- this.getList();
|
|
|
- });
|
|
|
+ savePrinter(this.form).then((response) => {
|
|
|
+ this.$modal.msgSuccess("新增成功");
|
|
|
+ this.open = false;
|
|
|
+ this.getList();
|
|
|
+ });
|
|
|
}
|
|
|
}
|
|
|
});
|
|
@@ -409,7 +531,7 @@ export default {
|
|
|
handleUpdate(row) {
|
|
|
this.reset();
|
|
|
const id = row.id || this.ids;
|
|
|
- getPrinterInfo(id).then(response => {
|
|
|
+ getPrinterInfo(id).then((response) => {
|
|
|
this.form = response.data.printerInfo;
|
|
|
this.open = true;
|
|
|
this.title = "编辑打印机";
|
|
@@ -417,24 +539,28 @@ export default {
|
|
|
},
|
|
|
// 删除按钮操作
|
|
|
handleDelete(row) {
|
|
|
- const name = row.name
|
|
|
- this.$modal.confirm('是否确认删除"' + name + '"打印机?').then(function() {
|
|
|
- return updatePrinterStatus(row.id, 'D');
|
|
|
- }).then(() => {
|
|
|
- this.getList();
|
|
|
- this.$modal.msgSuccess("删除成功");
|
|
|
- }).catch((e) => {
|
|
|
+ const name = row.name;
|
|
|
+ this.$modal
|
|
|
+ .confirm('是否确认删除"' + name + '"打印机?')
|
|
|
+ .then(function () {
|
|
|
+ return updatePrinterStatus(row.id, "D");
|
|
|
+ })
|
|
|
+ .then(() => {
|
|
|
+ this.getList();
|
|
|
+ this.$modal.msgSuccess("删除成功");
|
|
|
+ })
|
|
|
+ .catch((e) => {
|
|
|
console.log(e.toString());
|
|
|
- });
|
|
|
+ });
|
|
|
},
|
|
|
// 提交设置按钮
|
|
|
- submitSettingForm: function() {
|
|
|
- this.$refs["settingForm"].validate(valid => {
|
|
|
+ submitSettingForm: function () {
|
|
|
+ this.$refs["settingForm"].validate((valid) => {
|
|
|
if (valid) {
|
|
|
- saveSetting(this.settingForm).then(response => {
|
|
|
- this.$modal.msgSuccess("保存设置成功");
|
|
|
- this.openSetting = false;
|
|
|
- });
|
|
|
+ saveSetting(this.settingForm).then((response) => {
|
|
|
+ this.$modal.msgSuccess("保存设置成功");
|
|
|
+ this.openSetting = false;
|
|
|
+ });
|
|
|
}
|
|
|
});
|
|
|
},
|
|
@@ -442,6 +568,6 @@ export default {
|
|
|
cancelSetting() {
|
|
|
this.openSetting = false;
|
|
|
},
|
|
|
- }
|
|
|
+ },
|
|
|
};
|
|
|
</script>
|