816 lines
28 KiB
Vue
816 lines
28 KiB
Vue
<template>
|
||
<div class="app-container">
|
||
<el-form :model="queryParams" ref="queryRef" v-show="showSearch" :inline="true" label-width="68px">
|
||
<el-form-item label="导入时间" prop="importTime">
|
||
<el-date-picker
|
||
v-model="importTime"
|
||
type="datetimerange"
|
||
start-placeholder="开始时间"
|
||
end-placeholder="结束时间"
|
||
format="YYYY/MM/DD HH:mm:ss"
|
||
value-format="YYYY-MM-DD HH:mm:ss"
|
||
@keyup.enter="handleQuery"
|
||
/>
|
||
</el-form-item>
|
||
<el-form-item label="项目号" prop="xmNo">
|
||
<el-input
|
||
v-model="queryParams.xmNo"
|
||
placeholder="请输入项目号"
|
||
clearable
|
||
style="width: 200px"
|
||
@keyup.enter="handleQuery"
|
||
/>
|
||
</el-form-item>
|
||
<el-form-item label="物料号" prop="wlNo">
|
||
<el-input
|
||
v-model="queryParams.wlNo"
|
||
placeholder="请输入物料号"
|
||
clearable
|
||
style="width: 200px"
|
||
@keyup.enter="handleQuery"
|
||
/>
|
||
</el-form-item>
|
||
<el-form-item label="供应商" prop="gysMc">
|
||
<el-input
|
||
v-model="queryParams.gysMc"
|
||
placeholder="请输入供应商名称"
|
||
clearable
|
||
style="width: 200px"
|
||
@keyup.enter="handleQuery"
|
||
/>
|
||
</el-form-item>
|
||
<el-form-item label="订单编号" prop="sapNo">
|
||
<el-input
|
||
v-model="queryParams.sapNo"
|
||
placeholder="请输入订单编号"
|
||
clearable
|
||
style="width: 200px"
|
||
@keyup.enter="handleQuery"
|
||
/>
|
||
</el-form-item>
|
||
|
||
<!-- <el-col :span="4">
|
||
<el-form-item>
|
||
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
|
||
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
|
||
</el-form-item>
|
||
</el-col> -->
|
||
<el-form-item label="项目描述" prop="xmMs">
|
||
<el-input
|
||
v-model="queryParams.xmMs"
|
||
placeholder="项目描述"
|
||
clearable
|
||
style="width: 200px"
|
||
@keyup.enter="handleQuery"
|
||
/>
|
||
</el-form-item>
|
||
<el-form-item label="物料描述" prop="wlMs">
|
||
<el-input
|
||
v-model="queryParams.wlMs"
|
||
placeholder="物料描述"
|
||
clearable
|
||
style="width: 200px"
|
||
@keyup.enter="handleQuery"
|
||
/>
|
||
</el-form-item>
|
||
<el-form-item label="状态" prop="status" >
|
||
<el-select v-model="queryParams.status" placeholder="请选择状态" clearable style="width: 200px">
|
||
<el-option v-for="dict in statusList" :key="dict.value" :label="dict.label" :value="dict.value" />
|
||
</el-select>
|
||
</el-form-item>
|
||
<el-form-item>
|
||
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
|
||
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
|
||
</el-form-item>
|
||
</el-form>
|
||
|
||
<el-row :gutter="10" class="mb8">
|
||
<el-col :span="1.5">
|
||
<el-button
|
||
type="primary"
|
||
plain
|
||
icon="Plus"
|
||
@click="handleAdd"
|
||
v-hasPermi="['plan:jh:add']"
|
||
>新增</el-button>
|
||
</el-col>
|
||
<el-col :span="1.5">
|
||
<el-button
|
||
type="success"
|
||
plain
|
||
icon="Edit"
|
||
:disabled="single"
|
||
@click="handleUpdate"
|
||
v-hasPermi="['plan:jh:edit']"
|
||
>修改</el-button>
|
||
</el-col>
|
||
<el-col :span="1.5">
|
||
<el-button
|
||
type="danger"
|
||
plain
|
||
icon="Delete"
|
||
:disabled="multiple"
|
||
@click="handleDelete"
|
||
v-hasPermi="['plan:jh:remove']"
|
||
>删除</el-button>
|
||
</el-col>
|
||
<el-col :span="1.5">
|
||
<el-button
|
||
type="primary"
|
||
plain
|
||
icon="Upload"
|
||
@click="handleImport(1)"
|
||
v-hasPermi="['plan:jh:import']"
|
||
>自定义导入</el-button>
|
||
</el-col>
|
||
<el-col :span="1.5">
|
||
<el-button
|
||
type="primary"
|
||
plain
|
||
icon="collection"
|
||
@click="handleImport(2)"
|
||
>模版导入</el-button>
|
||
</el-col>
|
||
<el-col :span="1.5">
|
||
<el-button
|
||
type="warning"
|
||
plain
|
||
icon="Download"
|
||
@click="handleExport"
|
||
v-hasPermi="['plan:jh:export']"
|
||
>导出</el-button>
|
||
</el-col>
|
||
<el-col :span="1.5">
|
||
<el-button
|
||
type="primary"
|
||
plain
|
||
icon="printer"
|
||
@click="handlePrint"
|
||
v-print="printViewInfo"
|
||
>打印</el-button>
|
||
</el-col>
|
||
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
|
||
</el-row>
|
||
|
||
<el-table v-loading="loading" border :data="jhList" style="width: 100%" show-overflow-tooltip @selection-change="handleSelectionChange">
|
||
<el-table-column type="selection" width="55" align="center" />
|
||
<!-- <el-table-column label="序号" align="center" prop="indexNo" /> -->
|
||
<!-- <el-table-column label="县局" align="center" prop="xj" /> -->
|
||
<el-table-column label="导入时间" align="center" prop="createTime" width="200">
|
||
<template #default="scoped">
|
||
{{ parseTime(scoped.row.createTime, '{y}-{m}-{d} {h}:{i}:{s}') }}
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column label="状态" align="center" prop="status" width="100">
|
||
<template #default="scoped">
|
||
<el-tag :type="scoped.row.status == 1 ? 'success' : scoped.row.status == 0 ? 'danger' : 'warning'">{{ statusList.filter(item => item.value == scoped.row.status)[0].label }}</el-tag>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column label="项目号" align="center" prop="xmNo" width="150"/>
|
||
<el-table-column label="项目描述" align="center" prop="xmMs" width="240" />
|
||
<el-table-column label="物料号" align="center" prop="wlNo" width="100"/>
|
||
<el-table-column label="物料描述" align="center" prop="wlMs" width="300"/>
|
||
<el-table-column label="供应商编码" align="center" prop="gysNo" width="150"/>
|
||
<el-table-column label="供应商名称" align="center" prop="gysMc" width="200"/>
|
||
<el-table-column label="计划交货金额" align="center" prop="jhAmt" width="120"/>
|
||
<el-table-column label="合同单价" align="center" prop="htDj" />
|
||
<el-table-column label="订单编号" align="center" prop="sapNo" width="100"/>
|
||
<el-table-column label="行号" align="center" prop="xh" />
|
||
<el-table-column label="计划交货数量" align="center" prop="jhQty" width="120"/>
|
||
<el-table-column label="合同数量" align="center" prop="htQty" />
|
||
<el-table-column label="计量单位" align="center" prop="dw" />
|
||
<el-table-column label="身份码" align="center" prop="entityId" width="150"/>
|
||
<el-table-column label="备注" align="center" prop="remark" />
|
||
<el-table-column label="操作" fixed="right" align="center" class-name="small-padding fixed-width" width="150">
|
||
<template #default="scope">
|
||
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['plan:jh:edit']">修改</el-button>
|
||
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['plan:jh:remove']">删除</el-button>
|
||
</template>
|
||
</el-table-column>
|
||
</el-table>
|
||
|
||
<pagination
|
||
v-show="total>0"
|
||
:total="total"
|
||
v-model:page="queryParams.pageNum"
|
||
v-model:limit="queryParams.pageSize"
|
||
@pagination="getList"
|
||
/>
|
||
<!-- 打印 -->
|
||
<div id="printMe" class="printMeBox" v-show="showContent">
|
||
<div class="titleBox">
|
||
<div>项目编号：{{ printList.length>0 ? printList[0].xmNo:"" }}</div>
|
||
<div>项目描述：{{ printList.length>0 ? printList[0].xmMs:"" }}</div>
|
||
<!-- <img :src="qrcodeDataURL" alt="二维码" /> -->
|
||
|
||
</div>
|
||
<el-col :span="24" class="card-box">
|
||
<!-- <el-collapse > -->
|
||
|
||
|
||
<div class="el-table el-table--enable-row-hover el-table--medium">
|
||
<table cellspacing="0" style="width: 100%;">
|
||
<thead>
|
||
<tr>
|
||
<th class="el-table__cell is-leaf"><div class="cell">订单号</div></th>
|
||
<th class="el-table__cell is-leaf"><div class="cell">二维码</div></th>
|
||
<th class="el-table__cell is-leaf"><div class="cell">供应商名称</div></th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr v-for="item in printList" :key="item.id">
|
||
<td class="el-table__cell is-leaf"><div class="cell">{{ item.sapNo }}</div></td>
|
||
<td class="el-table__cell is-leaf"><div class="cell" ><qrcode-vue :value="item.sapNo" :size="60" level="H"></qrcode-vue></div></td>
|
||
<td class="el-table__cell is-leaf"><div class="cell" >{{ item.gysMc }}</div></td>
|
||
</tr>
|
||
<!-- <tr>
|
||
<td class="el-table__cell is-leaf"><div class="cell">已用库位</div></td>
|
||
<td class="el-table__cell is-leaf"><div class="cell" >89</div></td>
|
||
</tr>
|
||
<tr>
|
||
<td class="el-table__cell is-leaf"><div class="cell">可用库位</div></td>
|
||
<td class="el-table__cell is-leaf"><div class="cell" >20</div></td>
|
||
</tr>
|
||
<tr>
|
||
<td class="el-table__cell is-leaf"><div class="cell">当前空闲率</div></td>
|
||
<td class="el-table__cell is-leaf"><div class="cell" >20%</div></td>
|
||
</tr> -->
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
<!-- </el-collapse> -->
|
||
</el-col>
|
||
</div>
|
||
<!-- 添加或修改供应计划对话框 -->
|
||
<el-dialog :title="title" v-model="open" width="800px" append-to-body>
|
||
<el-form ref="jhRef" :model="form" :rules="rules" label-width="100px">
|
||
<el-row :gutter="20">
|
||
<el-col :span="12">
|
||
<el-form-item label="序号" prop="indexNo">
|
||
<el-input v-model="form.indexNo" placeholder="请输入序号" />
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="县局" prop="xj">
|
||
<el-input v-model="form.xj" placeholder="请输入县局" />
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="项目号" prop="xmNo">
|
||
<el-input v-model="form.xmNo" placeholder="请输入项目号" />
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="项目描述" prop="xmMs">
|
||
<el-input v-model="form.xmMs" placeholder="请输入项目描述" />
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="物料号" prop="wlNo">
|
||
<el-input v-model="form.wlNo" placeholder="请输入物料号" />
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="物料描述" prop="wlMs">
|
||
<el-input v-model="form.wlMs" placeholder="请输入物料描述" />
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="供应商编码" prop="gysNo">
|
||
<el-input v-model="form.gysNo" placeholder="请输入供应商编码" />
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="供应商名称" prop="gysMc">
|
||
<el-input v-model="form.gysMc" placeholder="请输入供应商名称" />
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="计划交货金额" prop="jhAmt">
|
||
<el-input v-model="form.jhAmt" placeholder="请输入计划交货金额" />
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="合同单价" prop="htDj">
|
||
<el-input v-model="form.htDj" placeholder="请输入合同单价" />
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="SAP订单编号" prop="sapNo">
|
||
<el-input v-model="form.sapNo" placeholder="请输入SAP订单编号" />
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="行号" prop="xh">
|
||
<el-input v-model="form.xh" placeholder="请输入行号" />
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="计划交货数量" prop="jhQty">
|
||
<el-input v-model="form.jhQty" placeholder="请输入计划交货数量" />
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="合同数量" prop="htQty">
|
||
<el-input v-model="form.htQty" placeholder="请输入合同数量" />
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="计量单位" prop="dw">
|
||
<el-input v-model="form.dw" placeholder="请输入计量单位" />
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="身份码" prop="entityId">
|
||
<el-input v-model="form.entityId" placeholder="请输入身份码" />
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="24">
|
||
<el-form-item label="备注" prop="remark">
|
||
<el-input v-model="form.remark" type="textarea" placeholder="请输入备注" />
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
</el-form>
|
||
<template #footer>
|
||
<div class="dialog-footer">
|
||
<el-button type="primary" @click="submitForm">确 定</el-button>
|
||
<el-button @click="cancel">取 消</el-button>
|
||
</div>
|
||
</template>
|
||
</el-dialog>
|
||
|
||
<!-- 导入对话框 -->
|
||
<el-dialog :title="upload.title" v-model="upload.open" width="400px" append-to-body>
|
||
<el-upload ref="uploadRef" :limit="1" accept=".xlsx, .xls" :headers="upload.headers" :action="upload.url" :disabled="upload.isUploading" :on-progress="handleFileUploadProgress" :on-success="handleFileSuccess" :on-change="handleFileChange" :auto-upload="false" drag>
|
||
<el-icon class="el-icon--upload"><upload-filled /></el-icon>
|
||
<div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
|
||
<template #tip>
|
||
<div class="el-upload__tip text-center">
|
||
<span>仅允许导入xls、xlsx格式文件。</span>
|
||
</div>
|
||
</template>
|
||
</el-upload>
|
||
<template #footer>
|
||
<div class="dialog-footer">
|
||
<el-button type="primary" @click="submitFileForm">确 定</el-button>
|
||
<el-button @click="upload.open = false">取 消</el-button>
|
||
</div>
|
||
</template>
|
||
</el-dialog>
|
||
<el-dialog title="导入数据" v-model="selectOpen" :close-on-click-modal="false" width="40%" append-to-body>
|
||
<el-form ref="stockRef" label-width="120">
|
||
<el-row v-for="itemInfo in columnsArr" :key="itemInfo.label" >
|
||
<el-col >
|
||
<el-form-item :label="itemInfo.name">
|
||
<el-select v-model="itemInfo.prop" clearable >
|
||
<el-option v-for="dict in oneLineHeaders" :key="dict.value" :label="dict.label" :value="dict.value" />
|
||
</el-select>
|
||
</el-form-item>
|
||
</el-col>
|
||
|
||
</el-row>
|
||
</el-form>
|
||
<template #footer>
|
||
<div class="dialog-footer">
|
||
<el-button type="primary" @click="submitPlanData" :loading="buttonLoading">确 定</el-button>
|
||
</div>
|
||
</template>
|
||
</el-dialog>
|
||
|
||
</div>
|
||
</template>
|
||
|
||
<script setup name="Jh">
|
||
import { getToken } from "@/utils/auth";
|
||
import { listJh, getJh, delJh, addJh, updateJh,uploadPlan } from "@/api/plan/jh";
|
||
import * as XLSX from 'xlsx'
|
||
import { ref } from 'vue'
|
||
//生成二维码
|
||
import QrcodeVue from 'qrcode.vue';
|
||
const { proxy } = getCurrentInstance();
|
||
const selectOpen = ref(false)
|
||
const jhList = ref([]);
|
||
const open = ref(false);
|
||
const loading = ref(true);
|
||
const buttonLoading = ref(false);
|
||
|
||
const showSearch = ref(true);
|
||
const ids = ref([]);
|
||
const single = ref(true);
|
||
const multiple = ref(true);
|
||
const total = ref(0);
|
||
const title = ref("");
|
||
const statusList = ref([
|
||
{ value: 0, label: "未到货"},
|
||
{ value: 1, label: "已入库"},
|
||
{ value: 2, label: "部分入库"}
|
||
])
|
||
const printList = ref([]);
|
||
const showContent = ref(false); // 控制打印内容是否显示
|
||
const columnsArr = ref([
|
||
{ name: "物料号", label: "wlNo" ,prop:""},
|
||
{ name: "物料描述", label: "wlMs",prop:"" },
|
||
{ name: "项目号", label: "xmNo",prop:"" },
|
||
{ name: "项目描述", label: "xmMs",prop:"" },
|
||
{ name: "计量单位", label: "dw",prop:"" },
|
||
{ name: "供应商编码", label: "gysNo",prop:"" },
|
||
{ name: "供应商名称", label: "gysMc",prop:""},
|
||
{ name: "计划交货金额", label: "jhAmt",prop:""},
|
||
{ name: "计划交货数量", label: "jhQty",prop:""},
|
||
{ name: "合同单价", label: "htDj",prop:""},
|
||
{ name: "合同数量", label: "htQty",prop:""},
|
||
{ name: "采购订单号", label: "sapNo",prop:""},
|
||
{ name: "身份码", label: "entityId",prop:""}
|
||
])
|
||
const planData = ref([])
|
||
const excelFile = ref(null)
|
||
const importTime = ref([])
|
||
const data = reactive({
|
||
form: {},
|
||
queryParams: {
|
||
pageNum: 1,
|
||
pageSize: 10,
|
||
xmNo: null,
|
||
wlNo: null,
|
||
gysMc: null,
|
||
sapNo: null,
|
||
status: null,
|
||
xmMs:"",
|
||
wlMs:""
|
||
},
|
||
rules: {
|
||
},
|
||
printViewInfo: {
|
||
id: "printMe", //打印区域的唯一的id属性
|
||
popTitle: '入库信息打印', // 页眉文字 （不设置时显示undifined）（页眉页脚可以在打印页面的更多设置的选项中取消勾选）
|
||
|
||
|
||
beforeOpenCallback () {
|
||
showContent.value = false;
|
||
}, // 开始打印之前的callback
|
||
openCallback () { }, // 调用打印时的callback
|
||
closeCallback () { }, // 关闭打印的callback(无法区分确认or取消)
|
||
clickMounted () { },
|
||
|
||
standard: '',
|
||
extarCss: ''
|
||
},
|
||
});
|
||
const oneLineHeaders = ref([])
|
||
const error = ref('')
|
||
const { queryParams, form, rules,printViewInfo } = toRefs(data);
|
||
|
||
/** 查询供应计划列表 */
|
||
function getList() {
|
||
loading.value = true;
|
||
listJh(queryParams.value).then(response => {
|
||
jhList.value = response.rows;
|
||
total.value = response.total;
|
||
loading.value = false;
|
||
});
|
||
}
|
||
|
||
// 取消按钮
|
||
function cancel() {
|
||
open.value = false;
|
||
reset();
|
||
}
|
||
|
||
// 表单重置
|
||
function reset() {
|
||
form.value = {
|
||
id: null,
|
||
indexNo: null,
|
||
xj: null,
|
||
xmNo: null,
|
||
xmMs: null,
|
||
wlNo: null,
|
||
wlMs: null,
|
||
gysNo: null,
|
||
gysMc: null,
|
||
jhAmt: null,
|
||
htDj: null,
|
||
sapNo: null,
|
||
xh: null,
|
||
jhQty: null,
|
||
htQty: null,
|
||
dw: null,
|
||
status: null,
|
||
remark: null,
|
||
createBy: null,
|
||
createTime: null,
|
||
updateBy: null,
|
||
updateTime: null,
|
||
isDelete: null
|
||
};
|
||
proxy.resetForm("jhRef");
|
||
}
|
||
function selectChange(label,value){
|
||
console.log(34333)
|
||
planData.value.push({
|
||
label:label,
|
||
value:value
|
||
})
|
||
console.log(planData.value)
|
||
}
|
||
/** 搜索按钮操作 */
|
||
function handleQuery() {
|
||
if(importTime.value && importTime.value.length>0){
|
||
queryParams.value.beginTime = importTime.value[0]
|
||
queryParams.value.endTime = importTime.value[1]
|
||
}else{
|
||
queryParams.value.beginTime = ""
|
||
queryParams.value.endTime = ""
|
||
}
|
||
queryParams.value.pageNum = 1;
|
||
getList();
|
||
}
|
||
|
||
/** 重置按钮操作 */
|
||
function resetQuery() {
|
||
proxy.resetForm("queryRef");
|
||
importTime.value=''
|
||
handleQuery();
|
||
}
|
||
|
||
// 多选框选中数据
|
||
function handleSelectionChange(selection) {
|
||
ids.value = selection.map(item => item.id);
|
||
single.value = selection.length != 1;
|
||
multiple.value = !selection.length;
|
||
printList.value = selection
|
||
}
|
||
|
||
/** 新增按钮操作 */
|
||
function handleAdd() {
|
||
reset();
|
||
open.value = true;
|
||
title.value = "添加供应计划";
|
||
}
|
||
|
||
/** 修改按钮操作 */
|
||
function handleUpdate(row) {
|
||
reset();
|
||
const _id = row.id || ids.value
|
||
getJh(_id).then(response => {
|
||
form.value = response.data;
|
||
open.value = true;
|
||
title.value = "修改供应计划";
|
||
});
|
||
}
|
||
|
||
/** 提交按钮 */
|
||
function submitForm() {
|
||
proxy.$refs["jhRef"].validate(valid => {
|
||
if (valid) {
|
||
if (form.value.id != null) {
|
||
updateJh(form.value).then(response => {
|
||
proxy.$modal.msgSuccess("修改成功");
|
||
open.value = false;
|
||
getList();
|
||
});
|
||
} else {
|
||
addJh(form.value).then(response => {
|
||
proxy.$modal.msgSuccess("新增成功");
|
||
open.value = false;
|
||
getList();
|
||
});
|
||
}
|
||
}
|
||
});
|
||
}
|
||
|
||
/** 删除按钮操作 */
|
||
function handleDelete(row) {
|
||
const _ids = row.id || ids.value;
|
||
proxy.$modal.confirm('是否确认删除供应计划编号为"' + _ids + '"的数据项？').then(function() {
|
||
return delJh(_ids);
|
||
}).then(() => {
|
||
getList();
|
||
proxy.$modal.msgSuccess("删除成功");
|
||
}).catch(() => {});
|
||
}
|
||
|
||
/** 导出按钮操作 */
|
||
function handleExport() {
|
||
proxy.download('plan/jh/export', {
|
||
...queryParams.value
|
||
}, `jh_${new Date().getTime()}.xlsx`)
|
||
}
|
||
|
||
|
||
//文件上传--供应计划导入
|
||
const upload = reactive({
|
||
// 是否显示弹出层（用户导入）
|
||
open: false,
|
||
// 弹出层标题（用户导入）
|
||
title: "",
|
||
// 是否禁用上传
|
||
isUploading: false,
|
||
// 是否更新已经存在的用户数据
|
||
updateSupport: 0,
|
||
// 设置上传的请求头部
|
||
headers: { Authorization: "Bearer " + getToken() },
|
||
// 上传的地址
|
||
url: import.meta.env.VITE_APP_BASE_API + "/plan/jh/importData"
|
||
});
|
||
|
||
const importType = ref(null); // 1-供应计划导入 2-模版导入
|
||
function handleImport(type) {
|
||
upload.title = "供应计划导入";
|
||
upload.open = true;
|
||
importType.value = type;
|
||
};
|
||
/**文件上传中处理 */
|
||
const handleFileUploadProgress = (event, file, fileList) => {
|
||
upload.isUploading = true;
|
||
};
|
||
//选择供应计划excel文件
|
||
function handleFileChange(event){
|
||
excelFile.value = event.raw
|
||
if (!excelFile.value) return
|
||
// 重置状态
|
||
oneLineHeaders.value = []
|
||
error.value = ''
|
||
const reader = new FileReader()
|
||
// console.log(555)
|
||
reader.onload = (e) => {
|
||
// console.log(3333)
|
||
try {
|
||
const data = new Uint8Array(e.target.result)
|
||
const workbook = XLSX.read(data, { type: 'array' })
|
||
|
||
// 获取第一个工作表
|
||
const firstSheetName = workbook.SheetNames[0]
|
||
// console.log('firstSheetName', firstSheetName)
|
||
// return
|
||
const worksheet = workbook.Sheets[firstSheetName]
|
||
|
||
// 将工作表转为二维数组（每行一个数组）
|
||
const sheetJson = XLSX.utils.sheet_to_json(worksheet, { header: 1 })
|
||
|
||
if (sheetJson.length === 0) {
|
||
error.value = 'Excel 文件为空'
|
||
return
|
||
}
|
||
|
||
// 第一行即为标题行
|
||
const firstRow = sheetJson[0] // 注意：这里已经是数组
|
||
// console.log(firstRow)
|
||
// var colnames = {};
|
||
// var i=0;
|
||
// for(var k in firstRow){
|
||
// var l = getColLetter(i);
|
||
// colnames[l] = k;
|
||
// i++;
|
||
// }
|
||
// console.log(colnames)
|
||
// 清理可能的 undefined 或 null，转为字符串
|
||
oneLineHeaders.value = firstRow.map((item,i)=>({
|
||
value:getColLetter(i),
|
||
label:item
|
||
}))
|
||
for(let i=0;i<columnsArr.value.length;i++){
|
||
for(let j=0;j<oneLineHeaders.value.length;j++){
|
||
if(oneLineHeaders.value[j].label==columnsArr.value[i].name){
|
||
columnsArr.value[i].prop = oneLineHeaders.value[j].value
|
||
}
|
||
}
|
||
}
|
||
// console.log(oneLineHeaders.value)
|
||
} catch (err) {
|
||
console.error(err)
|
||
error.value = '解析 Excel 失败：' + err.message
|
||
}
|
||
}
|
||
reader.onerror = () => {
|
||
error.value = '文件读取失败'
|
||
}
|
||
reader.readAsArrayBuffer(excelFile.value)
|
||
|
||
}
|
||
function getColLetter(idx){
|
||
var letter = ['A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P','Q','R','S','T','U','V','W','X','Y','Z'];
|
||
if(idx<26){
|
||
return letter[idx];
|
||
}
|
||
var idx1 = Math.ceil(idx/26)-1
|
||
var a1 = letter[idx1];
|
||
var idx2 = idx%26;
|
||
var a2 = letter[idx2];
|
||
var res = ""+a1+a2;
|
||
return res;
|
||
}
|
||
//提交供应计划数据
|
||
function submitPlanData(){
|
||
buttonLoading.value = true;
|
||
// let submitPlanData = {};
|
||
let disableSub = false
|
||
columnsArr.value.forEach(item=>{
|
||
if(item.label == "wlNo" || item.label == "gysMc" || item.label=="wlMs" || item.label=="dw" || item.label=="htQty"|| item.label=="sapNo"){
|
||
if(!item.prop){
|
||
proxy.$modal.msgError("供应商名称、物料号、物料描述、单位、合同数量、采购订单号不能为空");
|
||
disableSub = true
|
||
buttonLoading.value = false
|
||
return
|
||
}
|
||
}
|
||
// submitPlanData[item.prop] = item.letter
|
||
|
||
})
|
||
if(disableSub){
|
||
return
|
||
}
|
||
// console.log(submitPlanData)
|
||
// return
|
||
// for(var key in columnsArr.value){
|
||
// json[key] = $("#"+key).val();
|
||
// // alert("#"+key+":"+$("#"+key).val());
|
||
// if(key == "wlh" || key == "wlms" || key=="jldw" || key=="htsl" || key=="cgddh"|| key=="hxmh"){
|
||
// if(json[key] == -1){
|
||
// layer.alert("所属单位、物料号、物料描述、单位、合同数量、采购订单号、行项目号列不能为空");
|
||
// return;
|
||
// }
|
||
// }
|
||
// }
|
||
// const submitPlanData = columnsArr.value.map(item=>({
|
||
// [item.prop]:item.letter
|
||
// }))
|
||
const formData = new FormData();
|
||
formData.append('file', excelFile.value);
|
||
formData.append('mapping', JSON.stringify(columnsArr.value));
|
||
uploadPlan(formData).then(response => {
|
||
if(response.code==200){
|
||
buttonLoading.value = false;
|
||
proxy.$refs["uploadRef"].handleRemove(excelFile.value);
|
||
proxy.$refs['uploadRef'].clearFiles();
|
||
proxy.$modal.msgSuccess("操作成功");
|
||
columnsArr.value = ref([
|
||
{ name: "物料号", label: "wlNo" ,prop:""},
|
||
{ name: "物料描述", label: "wlMs",prop:"" },
|
||
{ name: "项目号", label: "xmNo",prop:"" },
|
||
{ name: "项目描述", label: "xmMs",prop:"" },
|
||
{ name: "计量单位", label: "dw",prop:"" },
|
||
{ name: "供应商编码", label: "gysNo",prop:"" },
|
||
{ name: "供应商名称", label: "gysMc",prop:""},
|
||
{ name: "计划交货金额", label: "jhAmt",prop:""},
|
||
{ name: "计划交货数量", label: "jhQty",prop:""},
|
||
{ name: "合同单价", label: "htDj",prop:""},
|
||
{ name: "合同数量", label: "htQty",prop:""},
|
||
{ name: "采购订单号", label: "sapNo",prop:""},
|
||
{ name: "身份码", label: "entityId",prop:""}
|
||
])
|
||
upload.open = false
|
||
selectOpen.value = false
|
||
excelFile.value = null
|
||
getList();
|
||
}
|
||
|
||
// this.fileList = [];
|
||
});
|
||
// console.log(submitPlanData)
|
||
|
||
}
|
||
/** 文件上传成功处理 */
|
||
const handleFileSuccess = (response, file, fileList) => {
|
||
upload.open = false;
|
||
upload.isUploading = false;
|
||
proxy.$refs["uploadRef"].handleRemove(file);
|
||
proxy.$alert("<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" + response.msg + "</div>", "导入结果", { dangerouslyUseHTMLString: true });
|
||
getList();
|
||
};
|
||
|
||
/** 提交上传文件 */
|
||
function submitFileForm() {
|
||
if(oneLineHeaders.value.length===0){
|
||
proxy.$modal.msgError("请上传文件");
|
||
return
|
||
}
|
||
if (importType.value == 1) {
|
||
selectOpen.value = true
|
||
} else {
|
||
proxy.$refs["uploadRef"].submit();
|
||
}
|
||
};
|
||
// 打印
|
||
function handlePrint(){
|
||
showContent.value = true;
|
||
// setTimeout(() => {
|
||
// showContent.value = false;
|
||
// }, 300)
|
||
// Print.print('printMe');
|
||
// showContent.value = false;
|
||
}
|
||
getList();
|
||
</script>
|
||
|
||
|
||
<style scoped lang="scss">
|
||
.maxWith {
|
||
::v-deep .el-form-item__label{
|
||
width: 90px !important;
|
||
}
|
||
}
|
||
</style>
|