123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564 |
- <template>
- <div>
- <div class="search">
- <el-form ref="advancedForm" :model="advancedForm" label-width="160px">
- <el-row>
- <el-col :span="12">
- <el-form-item label="sku">
- <el-input v-model="advancedForm.sku" placeholder="请输入内容" clearable></el-input>
- </el-form-item>
- </el-col>
- <el-col :span="12">
- <el-form-item label="状态">
- <el-select v-model="advancedForm.status" clearable>
- <el-option v-for="item in statusList" :key="item.id" :label="item.label" :value="item.value" />
- </el-select>
- </el-form-item>
- </el-col>
- <el-col :span="8">
- <!-- <el-form-item label="出入库">
- <el-select v-model="advancedForm.status">
- <el-option key="WAIT" label="出库" value="WAIT" />
- <el-option key="NEW" label="入库" value="NEW" />
- </el-select>
- </el-form-item> -->
- </el-col>
- </el-row>
- </el-form>
- <el-button @click="searchEvent"> 搜索 </el-button>
- </div>
- <en-table-layout :tableData="tableData.data" :loading="loading" @selection-change="handleSelectionChange">
- <div slot="toolbar" class="inner-toolbar">
- <div class="toolbar-btns">
- <el-button size="mini" v-if="checkPermission(['stock:add'])" type="primary"
- @click="handleAddWarehouse">新增</el-button>
- <!-- <el-button
- size="mini"
- type="delect"
- :disabled="multipleSelection.length === 0"
- @click="handleDelectWarehous"
- >删除</el-button
- > -->
- <el-button size="mini" type="primary" :disabled="multipleSelection.length === 0"
- @click="batchPrint">批量打印</el-button>
- </div>
- <!--
- <div class="toolbar-search" style="display: flex; align-items: center">
- <span>商品编号/条码:</span>
- <en-table-search
- @search="searchEvent"
- placeholder="请输入关键字搜索"
- />
- </div> -->
- </div>
- <template slot="table-columns">
- <el-table-column type="selection" width="55" />
- <el-table-column prop="goods_vo.sn" label="商品编号" />
- <el-table-column prop="goods_vo.name" label="商品名称" />
- <el-table-column prop="product_vo.spec_name" label="规格型号" />
- <el-table-column prop="sku" label="sku" />
- <el-table-column prop="sn_code" label="序列号" />
- <el-table-column prop="status" label="状态">
- <template slot-scope="scope">
- {{ typeName(scope.row.status) }}
- </template>
- </el-table-column>
- <el-table-column prop="out_house_id" label="出库单编号" />
- <el-table-column prop="entry_house_id" label="入库单编号" />
- <el-table-column label="操作" width="310">
- <template slot-scope="scope">
- <el-button size="mini" v-if="checkPermission(['stock:edit'])"
- @click="handleEditWarehouse(scope.$index, scope.row)">查看</el-button>
- <!-- <el-button
- size="mini"
- v-if="checkPermission(['stock:del'])"
- type="danger"
- @click="handleDeleteWarehouse(scope.$index, scope.row)"
- >删除</el-button
- > -->
- <el-button size="mini" @click="editPrintIng(scope.row)">编辑序列号</el-button>
- <el-button size="mini" @click="PrintIng(scope.row)">打印序列号</el-button>
- </template>
- </el-table-column>
- </template>
- <el-pagination v-if="tableData" slot="pagination" @size-change="handlePageSizeChange"
- @current-change="handlePageCurrentChange" :current-page="tableData.page_no" :page-sizes="[10, 20, 50, 100]"
- :page-size="tableData.page_size" layout="total, sizes, prev, pager, next, jumper" :total="tableData.data_total">
- </el-pagination>
- </en-table-layout>
- <el-dialog :title="title" :visible.sync="dialogVisible" width="600px" @open="handleDialogOpen"
- :modal-append-to-body="false" :close-on-click-modal="false" :close-on-press-escape="false" @close="close">
- <div class="header">
- <span>商品编号/sku</span>
- <el-input v-model="stockForm.sn"></el-input>
- <el-button>搜索</el-button>
- </div>
- <div class="center">
- <el-table :data="snTableData.records" border ref="table" style="width: 100%"
- @selection-change="snHandleSelectionChange">
- <el-table-column type="selection" width="55" />
- <el-table-column prop="goods_vo.sn" label="商品编号">
- </el-table-column>
- <el-table-column prop="goods_vo.name" label="商品名称" />
- <el-table-column prop="sku" label="sku" v-if="title !== '查看序列号'">
- </el-table-column>
- <el-table-column prop="product_vo.sku" label="sku" v-else>
- </el-table-column>
- <el-table-column prop="spec_name" label="规格型号" v-if="title !== '查看序列号'">
- </el-table-column>
- <el-table-column prop="product_vo.spec_name" label="规格型号" v-else>
- </el-table-column>
- </el-table>
- </div>
- <el-pagination @size-change="goodsPageSizeChange" @current-change="goodsPageCurrentChange"
- :current-page="snTableData.current" :page-sizes="[10, 20, 50, 100]" :page-size="snTableData.size"
- layout="total, sizes, prev, pager, next, jumper" :total="snTableData.total"></el-pagination>
- <!-- <el-form :model="stockForm" :rules="stockRules" ref="stockForm" label-width="120px">
- <el-form-item label="商品编码/条码">
- <span>
- <el-input v-model="stockForm.sn"></el-input><el-button>搜索</el-button>
- </span>
- </el-form-item>
- <el-form-item label="仓库名称" prop="name">
- <el-input v-model="stockForm.name" :minlength="2" :maxlength="20" clearable placeholder="请输入仓库名称"></el-input>
- </el-form-item>
- <el-form-item label="备注" prop="description">
- <el-input v-model="stockForm.description" type="textarea" :autosize="{ minRows: 3, maxRows: 4 }"
- placeholder="请输入备注"></el-input>
- </el-form-item>
- </el-form> -->
- <div class="dialog-footer">
- <el-input :disabled="title == '查看序列号'" v-model="stockForm.qty" placeholder="请输入要生成序列号的数量"></el-input>
- <el-button :disabled="title == '查看序列号'" @click="saveQ">生成</el-button>
- <!-- <el-button @click="dialogVisible = false">取 消</el-button>
- <el-button type="primary" @click="submitWarehouseForm">确 定</el-button> -->
- </div>
- <div class="info">
- <p>生成规则:序号号=商品编号+4位规格编码+当前生成时间+4位自然序号</p>
- <p>
- 注意:如果没有规格的商品默认规格编码就是0000,单次生成数量不得超过9999
- </p>
- </div>
- </el-dialog>
- <el-dialog title="打印预览" :visible.sync="PrintVisible" width="940px" center @close="handleCancle">
- <el-button size="mini" type="primary" @click="handlePrintGoodsLend" class="print">打印</el-button>
- <div id="deliverySheet" style="width: 900px">
- <div class="tips-t" v-for="(item, index) in codeList" :key="index">
- <div>
- <!-- <div class="qrcode-pic" ref="codeItem" ></div> -->
- <div class="numOrder">
- </div>
- <div style="margin-top: 10px; font-size: 20px; text-align: center">
- <barcode :value="item" format="CODE128"></barcode>
- </div>
- </div>
- </div>
- </div>
- </el-dialog>
- <el-dialog title="修改序列号" :visible.sync="SKUVisible" width="30%" center @close="snCodeCancle" >
- <el-form ref="SKUForm" :model="SKUForm" :rules="SKUFormRule" label-width="160px" inline class="change-form">
- <el-form-item label="序列号" prop="snCode" class="change-form-item">
- <el-input v-model="SKUForm.snCode" placeholder="请输入" style="width: 300px;"></el-input>
- </el-form-item>
- </el-form>
- <span slot="footer">
- <el-button @click="snCodeCancle">取消</el-button>
- <el-button @click="snCodeEdit">修改</el-button>
- </span>
- </el-dialog>
- </div>
- </template>
- <script>
- import * as API_BasicSetting from "@/api/basicSetting";
- import * as API_Setting from "@/api/setting";
- import * as API_Auth from "@/api/auth";
- import { Foundation } from "~/ui-utils";
- import { mapGetters } from "vuex";
- import Print from "print-js";
- export default {
- name: "warehouse",
- data() {
- return {
- deptList: [],
- adminList: [],
- // postList: [],
- // 列表loading状态
- loading: false,
- // 列表参数
- params: {
- page_no: 1,
- page_size: 10,
- },
- // 列表数据
- tableData: "",
- // 仓库表单
- stockForm: {
- qty: 0,
- },
- // 仓库表单 规则
- stockRules: {
- sn: [{ required: true, message: "请输入仓库编号", trigger: "blur" }],
- name: [
- { required: true, message: "请选择输入仓库名称", trigger: "blur" },
- ],
- },
- // 仓库表单 dialog
- dialogVisible: false,
- snTableData: [],
- // 当前已选择的行
- multipleSelection: [],
- PrintVisible: false,
- codeList: [],
- // 新增窗口选中的值
- snMultipleSelection: [],
- title: "",
- statusList: [],
- // 高级搜索数据
- advancedForm: {},
- barcodeValue: "",
- SKUForm: {
- snCode: '',
- id: ''
- },
- SKUFormRule: {
- snCode: [{
- required: true,
- message: '请输入序列号',
- trigger: 'blur'
- }
- ],
- },
- SKUVisible: false
- };
- },
- mounted() {
- this.GET_WarehouseList();
- this.GET_DeptList();
- // this.GET_StationAllList()
- this.GET_AdministratorList();
- },
- watch: {
- },
- computed: {
- ...mapGetters(["user"]),
- },
- methods: {
- snCodeCancle() {
- this.SKUForm.id = ""
- this.SKUForm.snCode = ""
- this.SKUVisible = false
- },
- snCodeEdit() {
- API_Setting.updateSnCode(this.SKUForm.id, this.SKUForm.snCode).then(res => {
- this.$message.success('修改成功!')
- this.SKUForm.id = ""
- this.SKUForm.snCode = ""
- this.SKUVisible = false
- this.GET_WarehouseList();
- })
- },
- editPrintIng(row) {
- this.SKUForm.id = row.id
- this.SKUForm.snCode = row.sn_code
- this.SKUVisible = true
- },
- /* 分页 */
- goodsPageSizeChange(size) {
- this.params.page_size = size;
- API_Setting.getSnProduct(this.params).then((res) => {
- this.snTableData = res; //this.tableData.data
- });
- },
- goodsPageCurrentChange(page) {
- this.params.page_no = page;
- API_Setting.getSnProduct(this.params).then((res) => {
- this.snTableData = res; //this.tableData.data
- });
- },
- typeName(val) {
- let name = "";
- this.statusList.map((el) => {
- if (el.value == val) {
- return (name = el.label);
- }
- });
- return name;
- },
- close() {
- this.dialogVisible = false;
- this.snTableData = [];
- },
- snHandleSelectionChange(val) {
- if (val.length > 1) {
- // 如果当前选中数量超过1,移除先前选中的,保留最后选中的
- const lastSelected = val[val.length - 1];
- this.$refs.table.clearSelection(); // 清除所有选中
- this.$refs.table.toggleRowSelection(lastSelected, true); // 重新选中最后一个
- }
- this.snMultipleSelection = val; // 更新当前选中的行
- },
- // 批量打印
- batchPrint() {
- const ids = this.multipleSelection.map((item) => item.sn_code);
- this.codeList = ids;
- this.PrintVisible = true;
- },
- /** 打印对账详情 */
- handlePrintGoodsLend() {
- Print({
- printable: "deliverySheet",
- type: "html",
- targetStyles: ["*"],
- ignoreElements: ["no-logs", "goods-image", "no-btn"],
- });
- },
- handleCancle() {
- this.dialogVisible = false;
- this.codeList = [];
- },
- // 打印
- PrintIng(row) {
- this.barcodeValue = row.sn_code;
- this.$nextTick(() => {
- this.codeList.push(row.sn_code);
- this.PrintVisible = true;
- });
- },
- // 删除
- handleDelectWarehous() {
- /* if (!this.multipleSelection || !this.multipleSelection.length)
- return this.$message.error("请先选择!");
- this.$confirm("确定要删除这些吗?", "提示", { type: "warning" })
- .then(() => {
- const ids = this.multipleSelection.map((item) => item.id);
- API_Setting.deleteSn(ids).then(() => {
- this.$message.success("删除成功!");
- this.GET_WarehouseList();
- });
- })
- .catch(() => {}); */
- },
- /** 多选改变 */
- handleSelectionChange(val) {
- this.multipleSelection = val;
- },
- // 生成序列号
- saveQ() {
- // if (!this.snMultipleSelection || !this.snMultipleSelection.length)
- API_Setting.addCreateSnCode({
- product_id: this.snMultipleSelection[0].id,
- num: Number(this.stockForm.qty),
- }).then((res) => {
- this.dialogVisible = false;
- this.snTableData = [];
- this.GET_WarehouseList();
- });
- },
- /** 获取人员列表 */
- GET_AdministratorList() {
- API_Auth.getAdministratorList({
- page_no: 1,
- page_size: 9999,
- user_state: 0,
- }).then((response) => {
- this.adminList = response.data;
- });
- },
- // /** 获取岗位 */
- // GET_StationAllList() {
- // API_Setting.getStationAllList().then(response => {
- // this.postList = response
- // })
- // },
- /** 获取部门 */
- GET_DeptList() {
- API_Setting.getDeptList().then((response) => {
- this.deptList = Foundation.buildTree(response, "0");
- });
- },
- /** 分页大小发生改变 */
- handlePageSizeChange(size) {
- this.params.page_size = size;
- this.GET_WarehouseList();
- },
- /** 分页页数发生改变 */
- handlePageCurrentChange(page) {
- this.params.page_no = page;
- this.GET_WarehouseList();
- },
- /** 添加仓库 */
- handleAddWarehouse() {
- /* this.stockForm = {
- dept_id: 0,
- admin_id: this.user.uid,
- }; */
- this.title = "新增序列号";
- API_Setting.getSnProduct(this.params).then((res) => {
- this.snTableData = res; //this.tableData.data
- this.dialogVisible = true;
- });
- },
- /** 编辑仓库 */
- handleEditWarehouse(index, row) {
- this.title = "查看序列号";
- this.snTableData.push(row);
- this.dialogVisible = true;
- },
- /** 删除 */
- handleDeleteWarehouse(index, row) {
- /* this.$confirm("确定要删除这个仓库吗?", "提示", { type: "warning" })
- .then(() => {
- API_Setting.deleteSn(row.id).then(() => {
- this.$message.success("删除成功!");
- this.GET_WarehouseList();
- });
- })
- .catch(() => {}); */
- },
- /** dialog打开后重置form表单校验结果 */
- handleDialogOpen() {
- setTimeout(() => {
- this.$refs["stockForm"].clearValidate();
- });
- },
- /** 提交仓库表单 */
- submitWarehouseForm() {
- this.$refs["stockForm"].validate((valid) => {
- if (valid) {
- const { id } = this.stockForm;
- const params = this.MixinClone(this.stockForm);
- if (!params.real_name) delete params.real_name;
- params.role_id === "超级仓库" ? (params.role_id = 0) : null;
- delete params.admin_name;
- if (id) {
- API_BasicSetting.editWarehouse(id, params).then((response) => {
- this.dialogVisible = false;
- this.$message.success("修改成功!");
- this.GET_WarehouseList();
- });
- } else {
- API_BasicSetting.addWarehouse(params).then(() => {
- this.dialogVisible = false;
- this.$message.success("添加成功!");
- this.GET_WarehouseList();
- });
- }
- } else {
- this.$message.error("表单填写有误,请核对!");
- return false;
- }
- });
- },
- /** 搜索事件触发 */
- searchEvent(data) {
- this.params = {
- ...this.params,
- ...this.advancedForm,
- };
- this.params.page_no = 1;
- this.GET_WarehouseList();
- },
- /** 获取序列号列表 */
- GET_WarehouseList() {
- this.loading = true;
- API_Setting.getDictSn(this.params)
- .then((response) => {
- this.loading = false;
- this.tableData = response;
- })
- .catch(() => {
- this.loading = false;
- });
- API_Setting.getPage({ dictType: "sn_code_status" }).then((res) => {
- this.statusList = res.data;
- });
- },
- },
- };
- </script>
- <style type="text/scss" lang="scss" scoped>
- .print {
- margin-left: 790px;
- }
- .face-image {
- display: block;
- width: 50px;
- height: 50px;
- margin: 0 auto;
- }
- /deep/ .el-dialog__body {
- padding: 10px 20px;
- }
- .header {
- display: flex;
- justify-content: flex-start;
- align-items: center;
- .el-input {
- width: 200px;
- margin: 15px;
- }
- }
- .dialog-footer {
- margin-top: 30px;
- margin-bottom: 20px;
- display: flex;
- justify-content: center;
- .el-input {
- width: 200px;
- margin-right: 15px;
- }
- }
- .info {
- text-align: center;
- color: #aaaaaa;
- }
- .search {
- display: flex;
- align-items: center;
- background: #fff;
- overflow: hidden;
- padding: 30px 10px 10px 10px;
- /deep/ .el-form-item {
- .el-form-item__content {
- .el-input {
- width: 200px;
- }
- }
- }
- .el-button {
- margin-top: -19px;
- margin-left: 20px;
- }
- }
- .numOrder {
- display: flex;
- justify-content: center;
- }
- </style>
|