Commit 19146f55 by duxingshan

1、设备台账模块接口对接(导入、打印二维码样式未完成)

parent c2f4f001
...@@ -56,6 +56,7 @@ ...@@ -56,6 +56,7 @@
"moment": "^2.29.4", "moment": "^2.29.4",
"nprogress": "0.2.0", "nprogress": "0.2.0",
"print-js": "^1.6.0", "print-js": "^1.6.0",
"qrcodejs2": "0.0.2",
"quill": "1.3.7", "quill": "1.3.7",
"screenfull": "5.0.2", "screenfull": "5.0.2",
"socket.io-client": "^4.6.1", "socket.io-client": "^4.6.1",
......
import request from "@/utils/request";
//查询设备台账列表
export function getEquipmentLedger(params) {
return request({
url: "/equipmentLedger/list",
method: "GET",
params,
});
}
//根据ID查看设备台账详细信息
export function getEquipmentLedgerDetailByID(id) {
return request({
url: `equipmentLedger/${id}`,
method: "GET",
});
}
//设备台账入库 新增
export function addEquipmentLedger(data) {
return request({
url: "/equipmentLedger/add",
method: "POST",
data,
});
}
//设备台账编辑
export function editEquipmentLedger(data) {
return request({
url: "/equipmentLedger/edit",
method: "PUT",
data,
});
}
//根据分类编码ID获取设备型号
export function getModelByID(id) {
return request({
url: `productCategory/getEquipmentByCode/${id}`,
method: "GET",
});
}
//设备台账出库 删除
export function deleteEquipmentLedger(id) {
return request({
url: `equipmentLedger/outStock/${id}`,
method: "POST",
});
}
...@@ -36,7 +36,6 @@ ...@@ -36,7 +36,6 @@
<template slot-scope="{ row }"> <template slot-scope="{ row }">
<div>{{ selectDictLabel(dict.type.section_type, row.selectedCourse) }}</div> <div>{{ selectDictLabel(dict.type.section_type, row.selectedCourse) }}</div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="所分班级" prop="divisionClassesName" align="center" /> <el-table-column label="所分班级" prop="divisionClassesName" align="center" />
</el-table> </el-table>
......
<template> <template>
<div class="app-container"> <div class="app-container">
<el-form :model="queryParams" ref="queryForm" size="small" v-show="showSearch" inline> <el-form :model="queryParams" ref="queryForm" size="small" inline>
<el-row>
<el-col :span="5">
<el-form-item label="设备名称"> <el-form-item label="设备名称">
<el-input v-model="queryParams.equipmentName" @keyup.enter.native="handleQuery" clearable <el-input style="width: 100%" v-model="queryParams.equipmentName" clearable placeholder="请输入设备名称"></el-input>
placeholder="请输入设备名称"></el-input>
</el-form-item> </el-form-item>
</el-col>
<el-col :span="5">
<el-form-item label="分类编码"> <el-form-item label="分类编码">
<el-input v-model="queryParams.equipmentCode" @keyup.enter.native="handleQuery" clearable <treeselect v-model="queryParams.classificationCode" :options="classificationOptions"
placeholder="请输入分类编码"></el-input> :normalizer="normalizer" placeholder="请选择分类编码"/>
</el-form-item> </el-form-item>
</el-col>
<el-col :span="5">
<el-form-item label="设备状态"> <el-form-item label="设备状态">
<el-select v-model="queryParams.equipmentStatus" @keyup.enter.native="handleQuery" clearable <el-select v-model="queryParams.equipmentState" clearable placeholder="请选择设备状态">
placeholder="请选择设备状态"> <el-option v-for="dict in dict.type.equipment_state" :key="dict.value" :label="dict.label"
<el-option v-for="dict in dict.type.EquipmentStatus" :key="dict.value" :label="dict.label"
:value="dict.value" /> :value="dict.value" />
</el-select> </el-select>
</el-form-item> </el-form-item>
</el-col>
<el-col :span="5">
<el-form-item label="归属类型"> <el-form-item label="归属类型">
<el-select v-model="queryParams.belongType" @keyup.enter.native="handleQuery" clearable <el-select v-model="queryParams.affiliationType" clearable placeholder="请选择归属类型">
placeholder="请选择归属类型"> <el-option v-for="dict in dict.type.affiliation_type" :key="dict.value" :label="dict.label"
<el-option v-for="dict in dict.type.BelongType" :key="dict.value" :label="dict.label"
:value="dict.value" /> :value="dict.value" />
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-button class="ml20" type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索 </el-col>
</el-button> <el-col :span="4">
<el-button class="ml20" type="primary" icon="el-icon-search" size="mini" @click="getList">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button> <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-col>
</el-row>
</el-form> </el-form>
<el-row :gutter="10" class="mb8"> <el-row :gutter="10" class="mb8">
<el-col :span="1.5"> <el-col :span="1.5">
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd">入库 <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="showDetail(0)">入库</el-button>
</el-button> <el-button type="danger" plain icon="el-icon-minus" size="mini"
<el-button type="danger" plain icon="el-icon-minus" size="mini" @click="handleDelete">出库 @click="handleDelete(0)" :disabled="isDisabledBtn">批量出库</el-button>
</el-button>
</el-col> </el-col>
<el-col :span="1.5"> <el-col :span="1.5">
<el-button type="success" icon="el-icon-download" size="mini" @click="handleImport">导入 <el-button type="success" icon="el-icon-download" size="mini" @click="handleImport">导入</el-button>
</el-button>
</el-col> </el-col>
<el-col :span="1.5"> <el-col :span="1.5">
<el-button type="warning" icon="el-icon-upload2" size="mini" @click="handleExportClass">导出 <el-button type="warning" icon="el-icon-upload2" size="mini" @click="handleExportClass">导出</el-button>
</el-button>
</el-col> </el-col>
<el-col :span="1.5"> <el-col :span="1.5">
<el-button type="warning" icon="el-icon-printer" size="mini" @click="printBarcodes">批量打印条码</el-button> <el-button type="warning" icon="el-icon-printer" size="mini"
@click="printBarcodes" :disabled="isDisabledBtn">批量打印条码</el-button>
</el-col> </el-col>
</el-row> </el-row>
<!-- 表单数据 --> <!-- 表单数据 -->
<el-table v-loading="loading" stripe :data="ClassList" @selection-change="handleSelectionChange" width="100%"> <el-table v-loading="loading" stripe :data="deviceData" @selection-change="handleSelectionChange" width="100%">
<el-table-column type="selection" width="55" align="center" /> <el-table-column type="selection" width="55" align="center" />
<el-table-column header-align="center" align="center" type="index" label="序号" width="55" fixed="left" /> <el-table-column align="center" type="index" label="序号" width="55" fixed="left" />
<el-table-column header-align="center" align="center" prop="equipmentCode" fixed="left" label="自编码" width="120" <el-table-column align="center" prop="encode" label="自编码"></el-table-column>
show-overflow-tooltip> <el-table-column align="center" prop="equipmentName" label="设备名称"></el-table-column>
</el-table-column> <el-table-column align="center" prop="model" label="型号"></el-table-column>
<el-table-column header-align="center" align="center" prop="equipmentName" fixed="left" label="设备名称" <el-table-column align="center" prop="specification" label="规格"></el-table-column>
show-overflow-tooltip> <el-table-column align="center" prop="classificationCode" label="分类编码"></el-table-column>
</el-table-column> <el-table-column align="center" prop="unit" label="单位"></el-table-column>
<el-table-column header-align="center" align="center" prop="equipmentModel" fixed="left" label="型号" <el-table-column align="center" prop="affiliationType" label="归属类型">
show-overflow-tooltip> <template slot-scope="{ row }">
</el-table-column> <div>{{ selectDictLabel(dict.type.affiliation_type, row.affiliationType) }}</div>
<el-table-column header-align="center" align="center" prop="equipmentSpec" fixed="left" label="规格" </template>
show-overflow-tooltip>
</el-table-column>
<el-table-column header-align="center" align="center" prop="equipmentTypeCode" label="分类编码"
show-overflow-tooltip>
</el-table-column>
<el-table-column header-align="center" align="center" prop="equipmentUnit" label="单位" show-overflow-tooltip>
</el-table-column>
<el-table-column header-align="center" align="center" prop="belongType" label="归属类型" show-overflow-tooltip>
</el-table-column>
<el-table-column header-align="center" align="center" prop="equipmentStatus" label="设备状态" show-overflow-tooltip>
</el-table-column>
<el-table-column header-align="center" align="center" prop="isAllowBorrow" label="是否允许借出" width="120px"
show-overflow-tooltip>
</el-table-column>
<el-table-column header-align="center" align="center" prop="isBorrow" label="是否借出" show-overflow-tooltip>
</el-table-column>
<el-table-column header-align="center" align="center" prop="productionDate" label="投产日期" show-overflow-tooltip>
</el-table-column>
<el-table-column header-align="center" align="center" prop="equipmentPrice" label="价格(元)" width="120px"
show-overflow-tooltip>
</el-table-column>
<el-table-column header-align="center" align="center" prop="usefulLife" label="效用年限(年)" width="120px"
show-overflow-tooltip>
</el-table-column> </el-table-column>
<el-table-column header-align="center" align="center" prop="equipmentPlace" label="地点" show-overflow-tooltip> <el-table-column align="center" prop="equipmentState" label="设备状态">
<template slot-scope="{ row }">
<div>{{ selectDictLabel(dict.type.equipment_state, row.equipmentState) }}</div>
</template>
</el-table-column> </el-table-column>
<el-table-column header-align="center" align="center" prop="equipmentUser" label="使用人" show-overflow-tooltip> <el-table-column align="center" prop="isAllowLend" label="是否允许借出">
<template slot-scope="{ row }">
<div>{{ selectDictLabel(dict.type.is_lend, row.isAllowLend) }}</div>
</template>
</el-table-column> </el-table-column>
<el-table-column header-align="center" align="center" prop="remark" label="备注" show-overflow-tooltip> <el-table-column align="center" prop="isLend" label="是否借出">
<template slot-scope="{ row }">
<div>{{ selectDictLabel(dict.type.is_lend, row.isLend) }}</div>
</template>
</el-table-column> </el-table-column>
<el-table-column align="center" prop="dateOfProduction" label="投产日期"></el-table-column>
<el-table-column align="center" prop="price" label="价格(元)"></el-table-column>
<el-table-column align="center" prop="lifeOfUtility" label="效用年限(年)"></el-table-column>
<el-table-column align="center" prop="place" label="地点"></el-table-column>
<el-table-column align="center" prop="useName" label="使用人"></el-table-column>
<el-table-column align="center" prop="remark" label="备注"></el-table-column>
<el-table-column label="操作" align="center" min-width="220px" fixed="right"> <el-table-column label="操作" align="center" min-width="220px" fixed="right">
<template slot-scope="scope"> <template slot-scope="scope">
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)" <el-button size="mini" type="text" icon="el-icon-edit" @click="showDetail(1,scope.row.id)">编辑</el-button>
v-hasPermi="['system:grade:edit']">编辑 <el-button size="mini" type="text" icon="el-icon-view" @click="showDetail(2,scope.row.id)">查看</el-button>
</el-button> <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(1,scope.row)">出库</el-button>
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
v-hasPermi="['system:grade:edit']">查看
</el-button>
<el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
v-hasPermi="['system:grade:remove']">出库
</el-button>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum"
@pagination="getList" /> :limit.sync="queryParams.pageSize" @pagination="getList" />
<!-- 添加或修改对话框 --> <!-- 添加或修改对话框 -->
<el-dialog :title="title" :visible.sync="dialogVisibleforClass" width="50%" append-to-body> <el-dialog :title="title" :visible.sync="dialogVisible" width="50%" append-to-body>
<el-form ref="form" :model="form" :rules="rules" :disabled="!isEdit" label-width="140px"> <el-form ref="form" :model="form" :rules="rules" label-width="100px">
<el-row :gutter="20"> <el-row :gutter="20">
<el-col :span="12"> <el-col :span="24">
<el-form-item label="自编码:" prop="teacherName"> <el-form-item v-if="nowOptionType != 0" label="自编码:" prop="encode">
<el-input v-model="form.teacherName" placeholder="请输入自编码" clearable></el-input> <el-input v-model="form.encode" placeholder="请输入自编码" disabled></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="设备名称:" prop="equipmentName">
<el-input v-model="form.equipmentName" placeholder="请输入设备名称" clearable></el-input>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row :gutter="20"> <el-row :gutter="20">
<el-col :span="12"> <el-col :span="12">
<el-form-item label="型号:" prop="equipmentModel"> <el-form-item label="分类编码:" prop="classificationCode">
<el-input v-model="form.equipmentModel" placeholder="请输入型号" clearable></el-input> <treeselect v-model="form.classificationCode" :options="classificationOptions"
:normalizer="normalizer" @select="selectNode"
placeholder="请选择分类编码" :disabled="nowOptionType==2?true:false"/>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="规格:" prop="equipmentSpec"> <el-form-item label="设备名称:" prop="equipmentName">
<el-input v-model="form.equipmentSpec" placeholder="请输入规格" clearable></el-input> <el-input v-model="form.equipmentName" placeholder="请输入设备名称"
:disabled="nowOptionType==2?true:false" clearable></el-input>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row :gutter="20"> <el-row :gutter="20">
<el-col :span="12"> <el-col :span="12">
<el-form-item label="分类编码:" prop="equipmentType"> <el-form-item label="型号:" prop="model">
<el-input v-model="form.equipmentType" placeholder="请输入分类编码" clearable></el-input> <el-input v-model="form.model" placeholder="请输入型号"
:disabled="nowOptionType==2?true:false" clearable></el-input>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="单位:" prop="equipmentUnit"> <el-form-item label="规格:" prop="specification">
<el-input v-model="form.equipmentUnit" placeholder="请输入单位" clearable></el-input> <el-input v-model="form.specification" placeholder="请输入规格"
:disabled="nowOptionType==2?true:false" clearable></el-input>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row :gutter="20"> <el-row :gutter="20">
<el-col :span="12"> <el-col :span="12">
<el-form-item label="归属类型:" prop="equipmentBelongType"> <el-form-item label="单位:" prop="unit">
<el-input v-model="form.equipmentBelongType" placeholder="请输入归属类型" clearable></el-input> <el-input v-model="form.unit" placeholder="请输入单位"
:disabled="nowOptionType==2?true:false" clearable></el-input>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="设备状态:"> <el-form-item label="归属类型:" prop="affiliationType">
<el-select v-model="queryParams.equipmentStatus" clearable placeholder="请选择设备状态" <el-select v-model="form.affiliationType" clearable placeholder="请选择归属类型"
style="width: 100%;"> :disabled="nowOptionType==2?true:false" class="selectWidth">
<el-option v-for="dict in dict.type.EquipmentStatus" :key="dict.value" :label="dict.label" <el-option v-for="dict in dict.type.affiliation_type" :key="dict.value" :label="dict.label"
:value="dict.value" /> :value="dict.value" />
</el-select> </el-select>
</el-form-item> </el-form-item>
...@@ -165,19 +157,19 @@ ...@@ -165,19 +157,19 @@
</el-row> </el-row>
<el-row :gutter="20"> <el-row :gutter="20">
<el-col :span="12"> <el-col :span="12">
<el-form-item label="是否允许借出:" prop="equipmentIsBorrow"> <el-form-item label="设备状态:" prop="equipmentState">
<el-select v-model="queryParams.equipmentIsBorrow" clearable placeholder="请选择是否允许借出" <el-select v-model="form.equipmentState" clearable placeholder="请选择设备状态"
style="width: 100%;"> :disabled="nowOptionType==2?true:false" class="selectWidth">
<el-option v-for="dict in dict.type.EquipmentIsBorrow" :key="dict.value" :label="dict.label" <el-option v-for="dict in dict.type.equipment_state" :key="dict.value" :label="dict.label"
:value="dict.value" /> :value="dict.value" />
</el-select> </el-select>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="是否借出:" prop="equipmentIsBorrow"> <el-form-item label="是否允许借出:" prop="isAllowLend">
<el-select v-model="queryParams.equipmentIsBorrow" clearable placeholder="请选择是否借出" <el-select v-model="form.isAllowLend" clearable placeholder="请选择是否允许借出"
style="width: 100%;"> :disabled="nowOptionType==2?true:false" class="selectWidth">
<el-option v-for="dict in dict.type.EquipmentIsBorrow" :key="dict.value" :label="dict.label" <el-option v-for="dict in dict.type.is_lend" :key="dict.value" :label="dict.label"
:value="dict.value" /> :value="dict.value" />
</el-select> </el-select>
</el-form-item> </el-form-item>
...@@ -185,118 +177,168 @@ ...@@ -185,118 +177,168 @@
</el-row> </el-row>
<el-row :gutter="20"> <el-row :gutter="20">
<el-col :span="12"> <el-col :span="12">
<el-form-item label="投产日期:" prop="equipmentProductionDate"> <el-form-item label="是否借出:" prop="isLend">
<el-date-picker v-model="form.equipmentProductionDate" type="date" placeholder="选择日期" <el-select v-model="form.isLend" clearable placeholder="请选择是否借出"
style="width: 100%;" value-format="yyyy-MM-dd" clearable></el-date-picker> :disabled="nowOptionType==2?true:false" class="selectWidth">
<el-option v-for="dict in dict.type.is_lend" :key="dict.value" :label="dict.label"
:value="dict.value" />
</el-select>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="价格:" prop="equipmentPrice"> <el-form-item label="投产日期:" prop="dateOfProduction">
<el-input v-model="form.equipmentPrice" placeholder="请输入价格" clearable></el-input> <el-date-picker v-model="form.dateOfProduction" type="date" placeholder="选择日期"
class="selectWidth" value-format="yyyy-MM-dd"
:disabled="nowOptionType==2?true:false" clearable>
</el-date-picker>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row :gutter="20"> <el-row :gutter="20">
<el-col :span="12"> <el-col :span="12">
<el-form-item label="效用年限(年):" prop="equipmentUseYear"> <el-form-item label="价格:" prop="price">
<el-input v-model="form.equipmentUseYear" placeholder="请输入效用年限(年)" clearable></el-input> <el-input v-model="form.price" placeholder="请输入价格"
:disabled="nowOptionType==2?true:false" clearable></el-input>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="地点:" prop="equipmentAddress"> <el-form-item label="效用年限:" prop="lifeOfUtility">
<el-input v-model="form.equipmentAddress" placeholder="请输入地点" clearable></el-input> <el-input v-model="form.lifeOfUtility" placeholder="请输入效用年限(年)"
:disabled="nowOptionType==2?true:false" clearable></el-input>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row :gutter="20"> <el-row :gutter="20">
<el-col :span="12"> <el-col :span="12">
<el-form-item label="使用人:" prop="equipmentUsePerson"> <el-form-item label="地点:" prop="place">
<el-input v-model="form.equipmentUsePerson" placeholder="请输入使用人" clearable></el-input> <el-input v-model="form.place" placeholder="请输入地点"
:disabled="nowOptionType==2?true:false" clearable></el-input>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="使用人:" prop="useName">
<el-input v-model="form.useName" placeholder="请输入使用人"
:disabled="nowOptionType==2?true:false" clearable></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="24">
<el-form-item label="备注:" prop="remark"> <el-form-item label="备注:" prop="remark">
<el-input v-model="form.remark" placeholder="请输入备注" clearable></el-input> <el-input type="textarea" v-model="form.remark" placeholder="请输入备注"
:disabled="nowOptionType==2?true:false" clearable></el-input>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
</el-form> </el-form>
<div slot="footer" class="dialog-footer"> <div slot="footer" class="dialog-footer">
<el-button v-show="isEdit" type="primary" @click="submitForm">确 定</el-button> <el-button v-if="nowOptionType != 2" type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">{{ !isEdit ? '退 出' : '取 消' }}</el-button> <el-button @click="dialogVisible = false">取 消</el-button>
</div> </div>
</el-dialog> </el-dialog>
<!-- 导入对话框--> <!-- 导入对话框-->
<el-dialog :title="upload.title" :visible.sync="upload.open" width="400px" append-to-body> <!-- <el-dialog :title="upload.title" :visible.sync="upload.open" width="400px" append-to-body>-->
<el-upload ref="upload" :limit="1" accept=".xlsx, .xls" :headers="upload.headers" :action="upload.url" <!-- <el-upload ref="upload" :limit="1" accept=".xlsx, .xls" :headers="upload.headers" :action="upload.url"-->
:disabled="upload.isUploading" :on-progress="handleFileUploadProgress" :on-success="handleFileSuccess" <!-- :disabled="upload.isUploading" :on-progress="handleFileUploadProgress" :on-success="handleFileSuccess"-->
:auto-upload="false" drag> <!-- :auto-upload="false" drag>-->
<i class="el-icon-upload"></i> <!-- <i class="el-icon-upload"></i>-->
<div class="el-upload__text">将文件拖到此处,或<em>点击上传</em></div> <!-- <div class="el-upload__text">将文件拖到此处,或<em>点击上传</em></div>-->
<div class="el-upload__tip text-center" slot="tip"> <!-- <div class="el-upload__tip text-center" slot="tip">-->
<span>仅允许导入xls、xlsx格式文件。</span> <!-- <span>仅允许导入xls、xlsx格式文件。</span>-->
<el-link type="primary" :underline="false" style="font-size: 12px; vertical-align: baseline" <!-- <el-link type="primary" :underline="false" style="font-size: 12px; vertical-align: baseline"-->
@click="importTemplate">下载模板 <!-- @click="importTemplate">下载模板-->
</el-link> <!-- </el-link>-->
<!-- </div>-->
<!-- </el-upload>-->
<!-- <div slot="footer" class="dialog-footer">-->
<!-- <el-button type="primary" @click="submitFileForm">确 定</el-button>-->
<!-- <el-button @click="upload.open = false">取 消</el-button>-->
<!-- </div>-->
<!-- </el-dialog>-->
<!-- 打印二维码 弹框部分 -->
<el-dialog title="打印条码预览" :visible.sync="printDialog" width="30%">
<div class="qrCodeList">
<div v-for="(item,index) in chooseList" :key="index" class="flexBlock qrCode">
<div class="qrCodeLeft">
<div :id="'qrcode' + index"></div>
<div>{{item.encode}}</div>
</div>
<div class="qrCodeRight">
<div>东营市二中</div>
<div>型号:{{ item.model }}</div>
<div>设备名称:{{ item.equipmentName }}</div>
</div>
</div>
</div> </div>
</el-upload>
<div slot="footer" class="dialog-footer"> <div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitFileForm">确 定</el-button> <el-button type="primary" @click="printCode">打 印</el-button>
<el-button @click="upload.open = false">取 消</el-button>
</div> </div>
</el-dialog> </el-dialog>
<!-- 打印二维码 弹框部分 -->
<!-- 隐藏二维码页面样式 -->
<div id="printBlock">
<div v-for="(item,index) in printList" :key="index" class="flexBlock printQrCode">
<div class="qrCodeLeft">
<div :id="'print' + index" class="printImg"></div>
<div>{{item.encode}}</div>
</div>
<div class="printRight">
<div>东营市二中</div>
<div>型号:{{ item.model }}</div>
<div>设备名称:{{ item.equipmentName }}</div>
</div>
<div style="page-break-after:always"></div>
</div>
</div>
<!-- 隐藏二维码页面样式 -->
</div> </div>
</template> </template>
<script> <script>
import {
getClassList,
getDetailInfo,
addClass,
editClass,
deleteClass,
allBY, editBatch,
} from "@/api/smartSchool/teachAffairAdministration/affairClassManage/index";
import { getToken } from "@/utils/auth"; import { getToken } from "@/utils/auth";
import {
addEquipmentLedger, deleteEquipmentLedger, editEquipmentLedger,
getEquipmentLedger,
getEquipmentLedgerDetailByID, getModelByID
} from "../../../../api/smartSchool/schoolProperty/equipmenTledger";
import { getProduct } from "../../../../api/smartSchool/schoolProperty/classiFication";
import Treeselect from "@riophae/vue-treeselect";
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
import QRCode from "qrcodejs2"; // 生成二维码插件
import printJS from "print-js"; // 打印插件
export default { export default {
name: "index", name: "index",
dicts: [], dicts: ['equipment_state','affiliation_type','is_lend'],
components: { Treeselect },
data() { data() {
return { return {
// 遮罩层 loading: true, // 遮罩层
loading: true, total: 0, // 总条数
// 选中数组 deviceData: [], // 设备台账表格数据
ids: [], title: "", // 弹出层标题
// 非单个禁用 dialogVisible: false, // 添加或修改
single: true, queryParams: { // 查询参数
// 非多个禁用 pageNum: 1,
multiple: true, pageSize: 10,
// 显示搜索条件 equipmentName:'',
showSearch: true, classificationCode:undefined,
// 总条数 equipmentState:'',
total: 0, affiliationType:'',
// 学校班级表格数据 },
ClassList: [], classificationOptions:[], // 分类编码树状结构
// 弹出层标题
title: "",
// 添加或修改学校班级对话框
dialogVisibleforClass: false,
// 批量操作对话框
dialogVisibleforBatch: false,
// 班级导入参数
upload: { upload: {
// 是否显示弹出层(班级导入) // 是否显示弹出层
open: false, open: false,
// 弹出层标题(班级导入) // 弹出层标题
title: "", title: "",
// 是否禁用上传 // 是否禁用上传
isUploading: false, isUploading: false,
...@@ -305,294 +347,324 @@ export default { ...@@ -305,294 +347,324 @@ export default {
// 上传的地址 // 上传的地址
url: process.env.VUE_APP_BASE_API + "/schoolClass/importData" url: process.env.VUE_APP_BASE_API + "/schoolClass/importData"
}, },
// 查询参数 form: {
queryParams: { id:'',
pageNum: 1, encode:'',
pageSize: 10, equipmentName:'',
model:'',
specification:'',
classificationCode:undefined,
unit:'',
affiliationType:'',
equipmentState:'',
isAllowLend:'',
isLend:'',
dateOfProduction:'',
price:'',
lifeOfUtility:'',
place:'',
useName:'',
remark:'',
}, },
// 表单参数 rules: { // 表单校验
form: {}, equipmentName:[
batchForm: {}, { required: true, message: '请输入设备名称', trigger: 'blur' },
// 表单校验 ],
rules: { classificationCode: [
{ required: true, message: '请选择分类编码', trigger: 'change' }
],
equipmentState: [
{ required: true, message: '请选择设备状态', trigger: 'change' }
],
}, },
nowOptionType:'', // 0 入库 1 编辑 2 查看
electItem:[], // 选中的数据
// 表单是否可以修改、 isDisabledBtn:true,
isEdit: true, chooseList:[], //用户选择的table数据
printDialog:false, // 打印二维码预览
printList:[]
}; };
}, },
created() { created() {
this.getClassificationCodeTree()
this.getList() this.getList()
}, },
methods: { methods: {
//获取分类编码树形下拉框
getClassificationCodeTree(){
getProduct().then(res=>{
if(res.code == 200){
this.classificationOptions = this.handleTree(res.rows, "id")
}
})
},
/** 查询列表 */ /** 查询列表 */
getList() { getList() {
this.loading = true; this.loading = true
getClassList(this.queryParams).then((response) => { getEquipmentLedger({...this.queryParams}).then(res=>{
this.ClassList = response.rows; if(res.code == 200){
this.total = response.total; this.total = res.total
this.loading = false; this.deviceData = res.rows
}); this.loading = false
}, }
// 取消按钮 })
cancel() {
this.dialogVisibleforClass = false;
this.reset();
}, },
// 表单重置
reset() {
this.form = {
};
// this.imageUrl = '';
//表单可编辑
this.isEdit = true;
this.resetForm("form");
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1;
this.getList();
},
/** 重置按钮操作 */ /** 重置按钮操作 */
resetQuery() { resetQuery() {
this.queryParams = { this.queryParams = {
pageNum: 1, pageNum: 1,
pageSize: 10, pageSize: 10,
equipmentName:'',
classificationCode:undefined,
equipmentState:'',
affiliationType:'',
}
this.getList()
},
/** 转换分类编码数据结构 */
normalizer(node) {
if (node.children && !node.children.length) {
delete node.children;
}
return {
id: node.classificationCode,
label: node.equipmentType,
children: node.children
}; };
this.newYear();
//
},
// 多选框选中数据
handleSelectionChange(selection) {
this.ids = selection.map((item) => item.id);
this.single = selection.length !== 1;
this.multiple = !selection.length;
}, },
/** 新增按钮操作 */ //弹出层分类编码选择事件 获取当前分类编码的型号
handleAdd() { selectNode(node){
this.reset(); const id = node.classificationCode
this.dialogVisibleforClass = true; getModelByID(id).then(res=>{
this.title = "新增"; if(res.code == 200){
}, this.form.model = res.data.model
/** 修改按钮操作 */ }
handleUpdate(row) {
this.reset();
const id = row.id || this.ids;
this.$modal.loading('正在加载数据,请稍等...');
getDetailInfo(id).then((response) => {
this.$modal.closeLoading();
this.form = response.data;
this.dialogVisibleforClass = true;
this.title = "修改";
}).catch(error => {
this.$modal.closeLoading();
}) })
}, },
//出库按钮操作
// handleOut(row) {
// this.reset();
// const id = row.id || this.ids;
// this.$modal.loading('正在加载数据,请稍等...');
// getDetailInfo(id).then((response) => {
// this.$modal.closeLoading();
// this.form = response.data;
// this.dialogVisibleforOut = true;
// this.title = "出库";
// }).catch(error => {
// this.$modal.closeLoading();
// })
// },
/** 上传过程 */
handleFileUploadProgress() {
this.upload.isUploading = true;
},
/** 上传成功 */
handleFileSuccess(response) {
this.upload.open = false;
this.upload.isUploading = false;
this.$refs.upload.clearFiles();
this.$alert("<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" + response.msg + "</div>", "导入结果", { dangerouslyUseHTMLString: true });
this.getList();
},
/** 查看详情 */ //0 入库 1 编辑 2 查看
handleDetail(row) { showDetail(type,id){
this.reset(); this.form = {
const id = row.id || this.ids; id:'',
this.$modal.loading('正在加载数据,请稍等...'); encode:'',
getDetailInfo(id).then(response => { equipmentName:'',
this.$modal.closeLoading(); model:'',
this.form = response.data; specification:'',
this.dialogVisibleforClass = true; classificationCode:undefined,
this.title = "查看详情"; unit:'',
this.isEdit = false; affiliationType:'',
}).catch(error => { equipmentState:'',
this.$modal.closeLoading(); isAllowLend:'',
isLend:'',
dateOfProduction:'',
price:'',
lifeOfUtility:'',
place:'',
useName:'',
remark:'',
}
this.nowOptionType = type
if(type != 0){
getEquipmentLedgerDetailByID(id).then(res=>{
if(res.code == 200){
Object.keys(this.form).forEach(key => {
res.data[key] && (this.form[key] = res.data[key])
})
console.log("this.form",this.form)
}
}) })
}
this.dialogVisible = true
}, },
/** 提交按钮 */
submitForm() { //表单提交
this.$refs["form"].validate((valid) => { submitForm(){
this.$refs['form'].validate((valid) => {
if (valid) { if (valid) {
this.$modal.loading('正在上传数据,请稍等...'); if(this.nowOptionType == 0){
if (this.form.id != null) { //0 入库 1 编辑 2 查看
editClass(this.form).then((response) => { const data = {
this.$modal.closeLoading(); equipmentName:this.form.equipmentName,
this.$modal.msgSuccess("修改成功"); model:this.form.model,
this.dialogVisibleforClass = false; specification:this.form.specification,
this.getList(); classificationCode:this.form.classificationCode,
}).catch(error => { unit:this.form.unit,
this.$modal.closeLoading(); affiliationType:this.form.affiliationType,
equipmentState:this.form.equipmentState,
isAllowLend:this.form.isAllowLend,
isLend:this.form.isLend,
dateOfProduction:this.form.dateOfProduction,
price:this.form.price,
lifeOfUtility:this.form.lifeOfUtility,
place:this.form.place,
useName:this.form.useName,
remark:this.form.remark,
}
addEquipmentLedger(data).then(res=>{
if(res.code == 200){
this.$message.success("设备台账入库成功!")
this.dialogVisible = false
this.getList()
}
}) })
} else { }else if(this.nowOptionType == 1){
addClass({ //1 编辑
...this.form, editEquipmentLedger({...this.form}).then(res=>{
gradeType: 4 if(res.code == 200){
}).then((response) => { this.$message.success("设备台账编辑成功!")
this.$modal.closeLoading(); this.dialogVisible = false
this.$modal.msgSuccess("新增成功"); this.getList()
this.dialogVisibleforClass = false; }
this.getList();
}).catch(error => {
this.$modal.closeLoading();
}) })
} }
} }
});
},
handleBaseInfo() {
this.form.gradeName = this.dict.type.Grade.find(item => item.value == this.form.gradeValue).label;
this.form.className = this.dict.type.Class.find(item => item.value == this.form.classValue).label;
},
/** 删除按钮操作 */
handleDelete(row) {
const ids = row.id || this.ids;
this.$modal.confirm('是否确认出库?').then(() => {
this.$modal.loading('正在出库,请稍等...');
return deleteClass(ids);
}).then(response => {
this.$modal.closeLoading();
this.$modal.msgSuccess("出库成功");
this.getList();
}).catch(error => {
this.$modal.closeLoading();
}) })
}, },
//出库
handleDelete(type,item){
let idString = type == 0?this.electItem.toString():item.id
let message = type == 0?'是否确认批量出库选中设备?':`是否确认出库${item.model}设备?`
this.$confirm(message, '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
deleteEquipmentLedger(idString).then(res=>{
if(res.code == 200){
this.$message({
type: 'success',
message: '出库成功!'
});
}
})
}).catch(() => {
this.$message({
type: 'info',
message: '已取消出库!'
});
});
// 批量打印
printBarcodes() {
// this.$modal.confirm('是否确认打印所选班级条码?').then(() => {
// this.$modal.loading('正在打印,请稍等...');
// return printBarcodes(this.ids);
// }).then(response => {
// this.$modal.closeLoading();
// this.$modal.msgSuccess("打印成功");
// this.getList();
// }).catch(error => {
// this.$modal.closeLoading();
// })
}, },
// 取消按钮 //导入
cancelForBatch() { handleImport(){},
this.dialogVisibleforBatch = false;
this.reset(); //导出
handleExportClass(){
const data = {
equipmentName:this.queryParams.equipmentName,
classificationCode:this.queryParams.classificationCode,
equipmentState:this.queryParams.equipmentState,
affiliationType:this.queryParams.affiliationType,
}
this.download('/equipmentLedger/export', {
...data,
}, `设备台账_${Date.now()}.xlsx`)
}, },
//生成批量打印条码
printBarcodes(){
this.printDialog = true
this.printList = this.chooseList
this.$nextTick(()=>{
this.chooseList.map((item,index) => {
new QRCode(`qrcode${index}`, {
width: 150,
height: 150,
text: item.encode,
});
})
this.printList.map((item,index) =>{
new QRCode(`print${index}`, {
width: 80,
height: 80,
text: item.encode,
});
})
// 下载模板 })
importTemplate() {
this.download(
"/schoolClass/importTemplate",
{},
`设备台帐.xlsx`
);
}, },
/** 导入按钮操作 */ //打印条码
handleImport() { printCode(){
this.upload.title = "导入"; printJS({
this.upload.open = true; printable: 'printBlock', // 标签元素id
type: 'html',
targetStyles: ['*'],
style:'#printBlock{display:block!important}'
})
}, },
/** 导出按钮操作 */ // 多选框选中数据
handleExportClass() { handleSelectionChange(selection) {
const length = this.ids.length; this.chooseList = selection
const ids = this.ids; console.log("selection",selection)
if (!length) { this.electItem = selection.map(item=>{
this.download( return item.id
"/schoolClass/export", })
{ this.isDisabledBtn = selection.length != 0?false:true
...this.queryParams,
},
`设备台帐.xlsx`
);
} else {
this.download(
"/schoolClass/export/" + ids,
{
...this.queryParams,
},
`class_${new Date().getTime()}.xlsx`
);
}
}, },
/** 提交 */
submitFileForm() {
this.$refs.upload.submit();
}
}, },
}; };
</script> </script>
<style> <style scoped>
.avatar-uploader .el-upload { ::v-deep .el-form-item,
border: 1px dashed #d9d9d9; ::v-deep .el-select{
border-radius: 6px; width: 100%;
cursor: pointer;
position: relative;
overflow: hidden;
} }
::v-deep .el-form-item--small .el-form-item__content {
.avatar-uploader .el-upload:hover { width: 75%;
border-color: #409eff;
} }
.qrCodeList{
.avatar-uploader-icon { max-height: 500px;
font-size: 28px; overflow-y: scroll;
color: #8c939d; }
width: 178px; .qrCode {
height: 178px; width: 300px;
line-height: 178px; font-size: 14px;
line-height: 30px;
align-items: flex-start;
margin: 0 auto 20px auto;
}
.qrCodeLeft {
text-align: center; text-align: center;
} }
.qrCodeRight {
.avatar { padding:20px 0 20px 15px;
width: 178px; }
height: 178px; .qrCodeRight div:first-child {
font-size: 18px;
font-weight: bold;
text-align: center;
}
#printBlock {
display: none;
}
.printQrCode {
font-size: 10px;
line-height: 30px;
align-items: flex-start;
padding: 10px;
}
.printRight {
padding:10px 0 10px 5px;
}
.printRight div:first-child {
font-size: 12px;
font-weight: bold;
text-align: center;
}
.printImg {
display: block; display: block;
margin-left: 30px;
} }
</style> </style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment