完成仓库模块
This commit is contained in:
Zy
147
src/views/system/Sdb/ChargeItem/add.vue
Normal file
147
src/views/system/Sdb/ChargeItem/add.vue
Normal file
@@ -0,0 +1,147 @@
|
||||
<template>
|
||||
<div class="AddBuildingBox">
|
||||
<PageHeader></PageHeader>
|
||||
<div class="AddBuildingBody">
|
||||
<div class="title">基本信息</div>
|
||||
<div class="addBuildingFormBody">
|
||||
<el-form class="formBody" label-position="right" ref="formRef" :model="form" :rules="rules" label-width="130px">
|
||||
<el-form-item label="项目名称" prop="materialName">
|
||||
<span>{{ form.materialName }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="品牌" prop="brand">
|
||||
<span>{{ form.brand }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="规格型号" prop="model">
|
||||
<span>{{ form.model }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="计量单位" prop="unit">
|
||||
<span>{{ form.unit }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="成本" prop="unit">
|
||||
<span>{{ form.unit }}</span>
|
||||
<el-input v-model.trim="form.remark" placeholder="请输入成本" />
|
||||
</el-form-item>
|
||||
<el-form-item label="当前库存" prop="unit">
|
||||
<span>{{ form.unit }}</span>
|
||||
<el-input v-model.trim="form.remark" placeholder="请输入当前库存" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item style="margin-top: 30px">
|
||||
<el-button type="primary" @click="submitForm">提交</el-button>
|
||||
<el-button @click="cancelForm">返回</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref } from 'vue';
|
||||
import PageHeader from '@/components/Pageheader/index.vue';
|
||||
import { getMaterial, updateMaterial, addMaterial } from '@/api/system/Tmaterial';
|
||||
|
||||
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
||||
|
||||
const router = useRouter();
|
||||
const route = useRoute();
|
||||
|
||||
const formRef = ref();
|
||||
const form = ref({
|
||||
id: null,
|
||||
materialName: '', // 物料名称
|
||||
brand: '', // 联系电话
|
||||
model: '', // 邮箱
|
||||
unit: '', // 地址
|
||||
remark: '' // 备注
|
||||
});
|
||||
const rules = ref({
|
||||
materialName: [{ required: true, message: '请输入 物料名称', trigger: 'blur' }],
|
||||
brand: [{ required: true, message: '请输入 品牌', trigger: 'blur' }],
|
||||
model: [{ required: true, message: '请输入 规格型号', trigger: 'blur' }],
|
||||
unit: [{ required: true, message: '请输入 计量单位', trigger: 'blur' }]
|
||||
});
|
||||
const userid = ref(null);
|
||||
if (route.query.id) {
|
||||
userid.value = route.query.id;
|
||||
getMaterial(userid.value).then((res) => {
|
||||
form.value = {
|
||||
id: res.data.id,
|
||||
materialName: res.data.materialName,
|
||||
brand: res.data.brand,
|
||||
model: res.data.model,
|
||||
unit: res.data.unit,
|
||||
remark: res.data.remark
|
||||
};
|
||||
});
|
||||
}
|
||||
// !== 提交 =============================================================================
|
||||
// 提交
|
||||
const submitForm = () => {
|
||||
formRef.value?.validate(async (valid: boolean) => {
|
||||
if (valid) {
|
||||
if (userid.value) {
|
||||
updateMaterial(form.value).then((res) => {
|
||||
ElMessage.success('编辑成功');
|
||||
cancelForm();
|
||||
});
|
||||
} else {
|
||||
addMaterial(form.value).then((res) => {
|
||||
ElMessage.success('添加成功');
|
||||
cancelForm();
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
};
|
||||
// 推出
|
||||
const cancelForm = () => {
|
||||
router.back();
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.AddBuildingBox {
|
||||
padding: 15px;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
.AddBuildingBody {
|
||||
margin-top: 20px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
background-color: white;
|
||||
padding: 15px;
|
||||
.title {
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
padding-left: 20px;
|
||||
background-color: rgba(255, 255, 255, 1);
|
||||
color: rgba(16, 16, 16, 1);
|
||||
border-bottom: 1px solid #bbbbbb;
|
||||
margin-bottom: 60px;
|
||||
}
|
||||
|
||||
.formBody {
|
||||
width: 650px;
|
||||
margin: 0 auto;
|
||||
&:deep(.el-form-item__content, .el-select, .el-input) {
|
||||
width: 350px !important;
|
||||
margin-right: 10px;
|
||||
.el-cascader {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
.el-form-item {
|
||||
margin-bottom: 20px;
|
||||
align-items: center;
|
||||
}
|
||||
.el-button {
|
||||
width: 80px;
|
||||
height: 35px;
|
||||
margin-right: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
249
src/views/system/Sdb/ChargeItem/index.vue
Normal file
249
src/views/system/Sdb/ChargeItem/index.vue
Normal file
@@ -0,0 +1,249 @@
|
||||
<template>
|
||||
<div class="flex flex-col h-full p-2">
|
||||
<pageheader></pageheader>
|
||||
<transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
|
||||
<div v-show="showSearch" class="mb-[10px]">
|
||||
<el-card shadow="hover">
|
||||
<el-form ref="queryFormRef" :model="queryParams" :inline="true">
|
||||
<el-form-item label="项目名称" prop="name">
|
||||
<el-input v-model="queryParams.name" placeholder="请输入项目名称" clearable @keyup.enter="handleQuery" />
|
||||
</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-card>
|
||||
</div>
|
||||
</transition>
|
||||
|
||||
<el-card class="flex-1" shadow="never">
|
||||
<template #header>
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<el-button type="primary" plain icon="Plus" @click="handleAdd" v-hasPermi="['chargeItem:chargeItem:add']">新增</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate()" v-hasPermi="['chargeItem:chargeItem:edit']"
|
||||
>修改</el-button
|
||||
>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete()" v-hasPermi="['chargeItem:chargeItem:remove']"
|
||||
>删除</el-button
|
||||
>
|
||||
</el-col>
|
||||
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
</template>
|
||||
|
||||
<el-table v-loading="loading" border :data="chargeItemList" @selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<el-table-column label="项目名称" align="center" prop="name" />
|
||||
<el-table-column label="计费方式" align="center" prop="billingMethod">
|
||||
<template #default="scope">
|
||||
<dict-tag :options="com_charge_item_method" :value="scope.row.billingMethod"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="单价" align="center" prop="price" />
|
||||
<el-table-column label="单位" align="center" prop="unit">
|
||||
<template #default="scope">
|
||||
<dict-tag :options="com_charge_item_unit" :value="scope.row.unit"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="精度" align="center" prop="precision">
|
||||
<template #default="scope">
|
||||
<dict-tag :options="com_charge_item_precision" :value="scope.row.precision"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="进位方式" align="center" prop="carryMethod">
|
||||
<template #default="scope">
|
||||
<dict-tag :options="com_charge_item_carry_method" :value="scope.row.carryMethod"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="滞纳金比例" align="center" prop="lateFee" />
|
||||
<el-table-column label="小区" align="center" prop="villageId" />
|
||||
<el-table-column label="备注" align="center" prop="remark" />
|
||||
<el-table-column label="操作" align="center" fixed="right" class-name="small-padding fixed-width">
|
||||
<template #default="scope">
|
||||
<el-tooltip content="修改" placement="top">
|
||||
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['chargeItem:chargeItem:edit']"></el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip content="删除" placement="top">
|
||||
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['chargeItem:chargeItem:remove']"></el-button>
|
||||
</el-tooltip>
|
||||
</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" />
|
||||
</el-card>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup name="ChargeItem" lang="ts">
|
||||
import { listChargeItem, getChargeItem, delChargeItem, addChargeItem, updateChargeItem } from '@/api/system/SdbChargeItem';
|
||||
import { ChargeItemVO, ChargeItemQuery, ChargeItemForm } from '@/api/system/SdbChargeItem/type';
|
||||
|
||||
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
||||
const { com_charge_item_method } = toRefs<any>(proxy?.useDict('com_charge_item_method'));
|
||||
const { com_charge_item_unit } = toRefs<any>(proxy?.useDict('com_charge_item_unit'));
|
||||
const { com_charge_item_precision } = toRefs<any>(proxy?.useDict('com_charge_item_precision'));
|
||||
const { com_charge_item_carry_method } = toRefs<any>(proxy?.useDict('com_charge_item_carry_method'));
|
||||
|
||||
const chargeItemList = ref<ChargeItemVO[]>([]);
|
||||
const buttonLoading = ref(false);
|
||||
const loading = ref(true);
|
||||
const showSearch = ref(true);
|
||||
const ids = ref<Array<string | number>>([]);
|
||||
const single = ref(true);
|
||||
const multiple = ref(true);
|
||||
const total = ref(0);
|
||||
|
||||
const queryFormRef = ref<ElFormInstance>();
|
||||
const chargeItemFormRef = ref<ElFormInstance>();
|
||||
|
||||
const dialog = reactive<DialogOption>({
|
||||
visible: false,
|
||||
title: ''
|
||||
});
|
||||
|
||||
const initFormData: ChargeItemForm = {
|
||||
id: undefined,
|
||||
name: undefined,
|
||||
billingMethod: undefined,
|
||||
price: undefined,
|
||||
unit: undefined,
|
||||
precision: undefined,
|
||||
carryMethod: undefined,
|
||||
lateFee: undefined,
|
||||
remark: undefined,
|
||||
villageId: undefined
|
||||
};
|
||||
const data = reactive<PageData<ChargeItemForm, ChargeItemQuery>>({
|
||||
form: { ...initFormData },
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
name: undefined,
|
||||
billingMethod: undefined,
|
||||
price: undefined,
|
||||
unit: undefined,
|
||||
precision: undefined,
|
||||
carryMethod: undefined,
|
||||
lateFee: undefined,
|
||||
villageId: undefined,
|
||||
params: {}
|
||||
},
|
||||
rules: {
|
||||
id: [{ required: true, message: '收费项目管理表id不能为空', trigger: 'blur' }]
|
||||
}
|
||||
});
|
||||
|
||||
const { queryParams, form, rules } = toRefs(data);
|
||||
|
||||
/** 查询收费项目管理列表 */
|
||||
const getList = async () => {
|
||||
loading.value = true;
|
||||
const res = await listChargeItem(queryParams.value);
|
||||
chargeItemList.value = res.rows;
|
||||
total.value = res.total;
|
||||
loading.value = false;
|
||||
};
|
||||
|
||||
/** 取消按钮 */
|
||||
const cancel = () => {
|
||||
reset();
|
||||
dialog.visible = false;
|
||||
};
|
||||
|
||||
/** 表单重置 */
|
||||
const reset = () => {
|
||||
form.value = { ...initFormData };
|
||||
chargeItemFormRef.value?.resetFields();
|
||||
};
|
||||
|
||||
/** 搜索按钮操作 */
|
||||
const handleQuery = () => {
|
||||
queryParams.value.pageNum = 1;
|
||||
getList();
|
||||
};
|
||||
|
||||
/** 重置按钮操作 */
|
||||
const resetQuery = () => {
|
||||
queryFormRef.value?.resetFields();
|
||||
handleQuery();
|
||||
};
|
||||
|
||||
/** 多选框选中数据 */
|
||||
const handleSelectionChange = (selection: ChargeItemVO[]) => {
|
||||
ids.value = selection.map((item) => item.id);
|
||||
single.value = selection.length != 1;
|
||||
multiple.value = !selection.length;
|
||||
};
|
||||
|
||||
const router = useRouter();
|
||||
/** 新增按钮操作 */
|
||||
const handleAdd = () => {
|
||||
router.push({
|
||||
path: '/sdb/addchargeItem'
|
||||
});
|
||||
};
|
||||
|
||||
/** 修改按钮操作 */
|
||||
const handleUpdate = async (row?: ChargeItemVO) => {
|
||||
router.push({
|
||||
path: '/sdb/addchargeItem',
|
||||
query: {
|
||||
id: row.id
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
/** 提交按钮 */
|
||||
const submitForm = () => {
|
||||
chargeItemFormRef.value?.validate(async (valid: boolean) => {
|
||||
if (valid) {
|
||||
buttonLoading.value = true;
|
||||
if (form.value.id) {
|
||||
await updateChargeItem(form.value).finally(() => (buttonLoading.value = false));
|
||||
} else {
|
||||
await addChargeItem(form.value).finally(() => (buttonLoading.value = false));
|
||||
}
|
||||
proxy?.$modal.msgSuccess('操作成功');
|
||||
dialog.visible = false;
|
||||
await getList();
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
/** 删除按钮操作 */
|
||||
const handleDelete = async (row?: ChargeItemVO) => {
|
||||
const _ids = row?.id || ids.value;
|
||||
await proxy?.$modal.confirm('是否确认删除收费项目管理编号为"' + _ids + '"的数据项？').finally(() => (loading.value = false));
|
||||
await delChargeItem(_ids);
|
||||
proxy?.$modal.msgSuccess('删除成功');
|
||||
await getList();
|
||||
};
|
||||
|
||||
/** 导出按钮操作 */
|
||||
const handleExport = () => {
|
||||
proxy?.download(
|
||||
'chargeItem/chargeItem/export',
|
||||
{
|
||||
...queryParams.value
|
||||
},
|
||||
`chargeItem_${new Date().getTime()}.xlsx`
|
||||
);
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
getList();
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.el-table {
|
||||
height: calc(100% - 80px);
|
||||
}
|
||||
</style>
|
||||
@@ -6,7 +6,7 @@
|
||||
<el-card shadow="hover">
|
||||
<el-form ref="queryFormRef" :model="queryParams" :inline="true">
|
||||
<el-form-item label="执行状态" prop="status">
|
||||
<el-select>
|
||||
<el-select v-model="queryParams.status">
|
||||
<el-option v-for="item in com_inspection_task_status" :key="item.value" :value="item.value" :label="item.label"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
@@ -74,6 +74,7 @@
|
||||
<script setup name="Record" lang="ts">
|
||||
import { listRecord, getRecord, delRecord, addRecord, updateRecord } from '@/api/system/InspectionRecord/index';
|
||||
import { RecordVO, RecordQuery, RecordForm } from '@/api/system/InspectionRecord/type';
|
||||
import { getUserByRoleKey } from '@/api/system/user';
|
||||
|
||||
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
||||
const { com_inspection_task_status } = toRefs<any>(proxy?.useDict('com_inspection_task_status'));
|
||||
@@ -123,6 +124,7 @@ const { queryParams, form } = toRefs(data);
|
||||
/** 查询巡检记录主列表 */
|
||||
const getList = async () => {
|
||||
loading.value = true;
|
||||
|
||||
const res = await listRecord(queryParams.value);
|
||||
recordList.value = res.rows;
|
||||
total.value = res.total;
|
||||
|
||||
@@ -107,7 +107,6 @@ function checkoutItem(id: string) {
|
||||
checkoutPointlist.value.push(id);
|
||||
const find = pointslist.value.find((item) => item.id === id);
|
||||
if (find && find.location) {
|
||||
console.log(find.location, find.pointName);
|
||||
if (find && find.location) {
|
||||
addPointMarker(id, find.location, find.pointName);
|
||||
}
|
||||
@@ -172,7 +171,6 @@ function init() {
|
||||
pathPoints: res.data.pathPoints, // 巡检路线经纬度
|
||||
totalPoints: res.data.totalPoints // 巡检点
|
||||
};
|
||||
console.log('巡检路线详情：', form.value);
|
||||
nextTick(() => {
|
||||
if (routeid.value) {
|
||||
checkoutPointlist.value = res.data.totalPoints ? res.data.totalPoints.split(',') : [];
|
||||
@@ -187,7 +185,6 @@ function init() {
|
||||
}
|
||||
// 回显路线
|
||||
if (res.data.pathPoints) {
|
||||
console.log('回显巡检点：', res.data.pathPoints);
|
||||
renderSavedPath(res.data.pathPoints);
|
||||
}
|
||||
}
|
||||
@@ -242,7 +239,6 @@ onMounted(async () => {
|
||||
if (drawnPolylines.value.length > 0) {
|
||||
map.value.remove(drawnPolylines.value[0]);
|
||||
}
|
||||
|
||||
drawnPolylines.value = [e.obj];
|
||||
// 画完继续允许画下一条（但永远只保留一条）
|
||||
initDrawTool();
|
||||
@@ -315,47 +311,67 @@ function clearAll() {
|
||||
// !!! 核心：获取绘制的路线经纬度数组
|
||||
function getPolylinePath() {
|
||||
if (drawnPolylines.value.length === 0) return [];
|
||||
const lastLine = drawnPolylines.value.at(-1);
|
||||
console.log('最后一条线的路径：', lastLine.getPath());
|
||||
const lastLine = drawnPolylines.value.pop();
|
||||
const path = lastLine.getPath().map((p) => [p.lng, p.lat]);
|
||||
return path;
|
||||
}
|
||||
/**
|
||||
* 修复高德地图 Polyline 闭合路线最后一段不显示
|
||||
* 解决：最后两点坐标相同 → 长度0 → 不渲染
|
||||
*/
|
||||
function fixClosePath(path: number[][]): number[][] {
|
||||
if (!path || path.length < 2) return path;
|
||||
|
||||
const newPath = [...path];
|
||||
|
||||
// 如果是闭合路线（最后一点 ≈ 第一点）
|
||||
const first = newPath[0];
|
||||
const last = newPath[newPath.length - 1];
|
||||
|
||||
// 判断是否几乎重合
|
||||
const isSame = Math.abs(last[0] - first[0]) < 1e-8 && Math.abs(last[1] - first[1]) < 1e-8;
|
||||
|
||||
if (isSame) {
|
||||
// 【关键】最后一点极微小偏移，强制生成线段
|
||||
newPath[newPath.length - 1] = [last[0] + 0.0000001, last[1] + 0.0000001];
|
||||
}
|
||||
|
||||
return newPath;
|
||||
}
|
||||
|
||||
// !== 提交 =============================================================================
|
||||
const submitForm = () => {
|
||||
formRef.value?.validate(async (valid: boolean) => {
|
||||
if (valid) {
|
||||
// 获取路线经纬度
|
||||
const path = getPolylinePath() as [number, number][];
|
||||
if (path.length === 0) {
|
||||
ElMessage.warning('请绘制巡检路线');
|
||||
return;
|
||||
}
|
||||
// 转成字符串传给后端
|
||||
const [start_lng, start_lat] = path.shift() as [number, number];
|
||||
const [end_lng, end_lat] = path.pop() as [number, number];
|
||||
|
||||
form.value.startLng = `${start_lng}`;
|
||||
form.value.startLat = `${start_lat}`;
|
||||
form.value.endLng = `${end_lng}`;
|
||||
form.value.endLat = `${end_lat}`;
|
||||
|
||||
form.value.pathPoints = JSON.stringify(path);
|
||||
form.value.totalPoints = checkoutPointlist.value.join(',');
|
||||
|
||||
console.log('提交数据：', form.value);
|
||||
if (routeid.value) {
|
||||
updateRoute(form.value).then(() => {
|
||||
ElMessage.success('编辑成功');
|
||||
cancelForm();
|
||||
});
|
||||
} else {
|
||||
addRoute(form.value).then(() => {
|
||||
ElMessage.success('添加成功');
|
||||
cancelForm();
|
||||
});
|
||||
}
|
||||
// if (valid) {
|
||||
// 获取路线经纬度
|
||||
const path = getPolylinePath() as [number, number][];
|
||||
if (path.length === 0) {
|
||||
ElMessage.warning('请绘制巡检路线');
|
||||
return;
|
||||
}
|
||||
// 转成字符串传给后端
|
||||
const [start_lng, start_lat] = path.at(0) as [number, number];
|
||||
const [end_lng, end_lat] = path.at(-1) as [number, number];
|
||||
|
||||
form.value.startLng = `${start_lng}`;
|
||||
form.value.startLat = `${start_lat}`;
|
||||
form.value.endLng = `${end_lng}`;
|
||||
form.value.endLat = `${end_lat}`;
|
||||
|
||||
form.value.pathPoints = JSON.stringify(path);
|
||||
form.value.totalPoints = checkoutPointlist.value.join(',');
|
||||
if (routeid.value) {
|
||||
updateRoute(form.value).then(() => {
|
||||
ElMessage.success('编辑成功');
|
||||
cancelForm();
|
||||
});
|
||||
} else {
|
||||
addRoute(form.value).then(() => {
|
||||
ElMessage.success('添加成功');
|
||||
cancelForm();
|
||||
});
|
||||
}
|
||||
// }
|
||||
});
|
||||
};
|
||||
// 返回
|
||||
|
||||
@@ -55,6 +55,7 @@
|
||||
|
||||
<script setup name="Route" lang="ts">
|
||||
import { list_statapi } from '@/api/system/Inspection';
|
||||
import { getUserByRoleKey } from '@/api/system/user';
|
||||
|
||||
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
||||
|
||||
@@ -74,12 +75,15 @@ const data = reactive({
|
||||
});
|
||||
|
||||
const checkdata = ref([]);
|
||||
// TODO 巡检人员名称
|
||||
|
||||
const { queryParams } = toRefs(data);
|
||||
|
||||
const inspectionUserlist = ref([]);
|
||||
/** 查询巡检路线列表 */
|
||||
const getList = async () => {
|
||||
loading.value = true;
|
||||
// const inspectionUseres = await getUserByRoleKey('inspection');
|
||||
// inspectionUserlist.value = inspectionUseres.data;
|
||||
const res = await list_statapi(queryParams.value);
|
||||
routeList.value = res.rows;
|
||||
total.value = res.total;
|
||||
|
||||
147
src/views/system/warehouse/Inventory/editInventory.vue
Normal file
147
src/views/system/warehouse/Inventory/editInventory.vue
Normal file
@@ -0,0 +1,147 @@
|
||||
<template>
|
||||
<div class="AddBuildingBox">
|
||||
<PageHeader></PageHeader>
|
||||
<div class="AddBuildingBody">
|
||||
<div class="title">基本信息</div>
|
||||
<div class="addBuildingFormBody">
|
||||
<el-form class="formBody" label-position="right" ref="formRef" :model="form" :rules="rules" label-width="130px">
|
||||
<el-form-item label="物料名称" prop="materialName">
|
||||
<span>{{ form.materialName }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="品牌" prop="brand">
|
||||
<span>{{ form.brand }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="规格型号" prop="model">
|
||||
<span>{{ form.model }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="计量单位" prop="unit">
|
||||
<span>{{ form.unit }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="成本" prop="unit">
|
||||
<span>{{ form.unit }}</span>
|
||||
<el-input v-model.trim="form.remark" placeholder="请输入成本" />
|
||||
</el-form-item>
|
||||
<el-form-item label="当前库存" prop="unit">
|
||||
<span>{{ form.unit }}</span>
|
||||
<el-input v-model.trim="form.remark" placeholder="请输入当前库存" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item style="margin-top: 30px">
|
||||
<el-button type="primary" @click="submitForm">提交</el-button>
|
||||
<el-button @click="cancelForm">返回</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref } from 'vue';
|
||||
import PageHeader from '@/components/Pageheader/index.vue';
|
||||
import { getMaterial, updateMaterial, addMaterial } from '@/api/system/Tmaterial';
|
||||
|
||||
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
||||
|
||||
const router = useRouter();
|
||||
const route = useRoute();
|
||||
|
||||
const formRef = ref();
|
||||
const form = ref({
|
||||
id: null,
|
||||
materialName: '', // 物料名称
|
||||
brand: '', // 联系电话
|
||||
model: '', // 邮箱
|
||||
unit: '', // 地址
|
||||
remark: '' // 备注
|
||||
});
|
||||
const rules = ref({
|
||||
materialName: [{ required: true, message: '请输入 物料名称', trigger: 'blur' }],
|
||||
brand: [{ required: true, message: '请输入 品牌', trigger: 'blur' }],
|
||||
model: [{ required: true, message: '请输入 规格型号', trigger: 'blur' }],
|
||||
unit: [{ required: true, message: '请输入 计量单位', trigger: 'blur' }]
|
||||
});
|
||||
const userid = ref(null);
|
||||
if (route.query.id) {
|
||||
userid.value = route.query.id;
|
||||
getMaterial(userid.value).then((res) => {
|
||||
form.value = {
|
||||
id: res.data.id,
|
||||
materialName: res.data.materialName,
|
||||
brand: res.data.brand,
|
||||
model: res.data.model,
|
||||
unit: res.data.unit,
|
||||
remark: res.data.remark
|
||||
};
|
||||
});
|
||||
}
|
||||
// !== 提交 =============================================================================
|
||||
// 提交
|
||||
const submitForm = () => {
|
||||
formRef.value?.validate(async (valid: boolean) => {
|
||||
if (valid) {
|
||||
if (userid.value) {
|
||||
updateMaterial(form.value).then((res) => {
|
||||
ElMessage.success('编辑成功');
|
||||
cancelForm();
|
||||
});
|
||||
} else {
|
||||
addMaterial(form.value).then((res) => {
|
||||
ElMessage.success('添加成功');
|
||||
cancelForm();
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
};
|
||||
// 推出
|
||||
const cancelForm = () => {
|
||||
router.back();
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.AddBuildingBox {
|
||||
padding: 15px;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
.AddBuildingBody {
|
||||
margin-top: 20px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
background-color: white;
|
||||
padding: 15px;
|
||||
.title {
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
padding-left: 20px;
|
||||
background-color: rgba(255, 255, 255, 1);
|
||||
color: rgba(16, 16, 16, 1);
|
||||
border-bottom: 1px solid #bbbbbb;
|
||||
margin-bottom: 60px;
|
||||
}
|
||||
|
||||
.formBody {
|
||||
width: 650px;
|
||||
margin: 0 auto;
|
||||
&:deep(.el-form-item__content, .el-select, .el-input) {
|
||||
width: 350px !important;
|
||||
margin-right: 10px;
|
||||
.el-cascader {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
.el-form-item {
|
||||
margin-bottom: 20px;
|
||||
align-items: center;
|
||||
}
|
||||
.el-button {
|
||||
width: 80px;
|
||||
height: 35px;
|
||||
margin-right: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,12 +1,154 @@
|
||||
<template>
|
||||
<div class="p-2 h-full flex flex-col">
|
||||
<Pageheader></Pageheader>
|
||||
<div class="flex-1 color-gray flex h-full font-size-6 flex-center">系统还在维护中，敬请期待...</div>
|
||||
<div class="flex flex-col h-full p-2">
|
||||
<pageheader></pageheader>
|
||||
<transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
|
||||
<div v-show="showSearch" class="mb-[10px]">
|
||||
<el-card shadow="hover">
|
||||
<el-form ref="queryFormRef" :model="queryParams" :inline="true">
|
||||
<el-form-item label="选择品牌" prop="brand">
|
||||
<el-input v-model="queryParams.brand" placeholder="请输入物料名称" clearable @keyup.enter="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item label="选择型号" prop="model">
|
||||
<el-input v-model="queryParams.model" placeholder="请输入物料名称" clearable @keyup.enter="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item label="物料名称" prop="materialName">
|
||||
<el-input v-model="queryParams.materialName" placeholder="请输入物料名称" clearable @keyup.enter="handleQuery" />
|
||||
</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-card>
|
||||
</div>
|
||||
</transition>
|
||||
|
||||
<el-card class="flex-1" shadow="never">
|
||||
<template #header>
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-button type="primary" icon="Plus" @click="handleAdd">添加</el-button>
|
||||
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
</template>
|
||||
|
||||
<el-table v-loading="loading" border :data="materialList" @selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<el-table-column label="物料名称" align="center" prop="materialName" />
|
||||
<el-table-column label="品牌" align="center" prop="brand" />
|
||||
<el-table-column label="规格型号" align="center" prop="model" />
|
||||
<el-table-column label="单位" width="60" align="center" prop="unit" />
|
||||
<el-table-column label="成本" width="60" align="center" prop="avgCostPrice" />
|
||||
<el-table-column label="当前库存" width="80" align="center" prop="totalStockNum" />
|
||||
<el-table-column label="备注" show-overflow-tooltip align="center" prop="remark" />
|
||||
<el-table-column label="操作" align="center" fixed="right" class-name="small-padding fixed-width">
|
||||
<template #default="scope">
|
||||
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:material:edit']">修改</el-button>
|
||||
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['system:material: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" />
|
||||
</el-card>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref } from 'vue';
|
||||
<script setup name="Material" lang="ts">
|
||||
import { listMaterial, getMaterial, delMaterial, addMaterial, updateMaterial } from '@/api/system/Tmaterial';
|
||||
import { MaterialVO, MaterialQuery, MaterialForm } from '@/api/system/Tmaterial/type';
|
||||
import { listStock } from '@/api/system/Tstock/index';
|
||||
|
||||
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
||||
const router = useRouter();
|
||||
const materialList = ref<MaterialVO[]>([]);
|
||||
const buttonLoading = ref(false);
|
||||
const loading = ref(true);
|
||||
const showSearch = ref(true);
|
||||
const ids = ref<Array<string | number>>([]);
|
||||
const single = ref(true);
|
||||
const multiple = ref(true);
|
||||
const total = ref(0);
|
||||
|
||||
const queryFormRef = ref<ElFormInstance>();
|
||||
|
||||
const initFormData: MaterialForm = {
|
||||
id: undefined,
|
||||
materialName: undefined,
|
||||
brand: undefined,
|
||||
model: undefined
|
||||
};
|
||||
const data = reactive<PageData<MaterialForm, MaterialQuery>>({
|
||||
form: { ...initFormData },
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
materialName: undefined,
|
||||
brand: undefined,
|
||||
model: undefined
|
||||
}
|
||||
});
|
||||
|
||||
const { queryParams } = toRefs(data);
|
||||
|
||||
/** 查询物料列表 */
|
||||
const getList = async () => {
|
||||
loading.value = true;
|
||||
const res = await listStock(queryParams.value);
|
||||
materialList.value = res.data;
|
||||
total.value = res.total ?? 0;
|
||||
loading.value = false;
|
||||
};
|
||||
|
||||
/** 搜索按钮操作 */
|
||||
const handleQuery = () => {
|
||||
queryParams.value.pageNum = 1;
|
||||
getList();
|
||||
};
|
||||
|
||||
/** 重置按钮操作 */
|
||||
const resetQuery = () => {
|
||||
queryFormRef.value?.resetFields();
|
||||
handleQuery();
|
||||
};
|
||||
|
||||
/** 多选框选中数据 */
|
||||
const handleSelectionChange = (selection: MaterialVO[]) => {
|
||||
ids.value = selection.map((item) => item.id);
|
||||
single.value = selection.length != 1;
|
||||
multiple.value = !selection.length;
|
||||
};
|
||||
|
||||
const handleAdd = () => {
|
||||
router.push({
|
||||
path: '/warehouse/purchaseIn'
|
||||
});
|
||||
};
|
||||
/** 修改按钮操作 */
|
||||
const handleUpdate = async (row?: MaterialVO) => {
|
||||
router.push({
|
||||
path: '/warehouse/editInventory',
|
||||
query: {
|
||||
id: row.id
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
/** 删除按钮操作 */
|
||||
const handleDelete = async (row?: MaterialVO) => {
|
||||
const _ids = row?.id || ids.value;
|
||||
await proxy?.$modal.confirm('是否确认删除该物料？').finally(() => (loading.value = false));
|
||||
await delMaterial(_ids);
|
||||
proxy?.$modal.msgSuccess('删除成功');
|
||||
await getList();
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
getList();
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss"></style>
|
||||
<style lang="scss" scoped>
|
||||
.el-table {
|
||||
height: calc(100% - 80px);
|
||||
}
|
||||
</style>
|
||||
|
||||
171
src/views/system/warehouse/IssueOut/Main.vue
Normal file
171
src/views/system/warehouse/IssueOut/Main.vue
Normal file
@@ -0,0 +1,171 @@
|
||||
<template>
|
||||
<div class="h-full flex flex-col p-2">
|
||||
<Pageheader></Pageheader>
|
||||
<div class="mainbody">
|
||||
<div class="actionsbox">
|
||||
<el-button @click="handlePrint" icon="Printer" type="primary">打印</el-button>
|
||||
<el-button @click="cancelForm">返回</el-button>
|
||||
</div>
|
||||
<div class="formBody" id="print-area">
|
||||
<div class="navtitle">出库单</div>
|
||||
<p>单号：{{ form.outNo }}</p>
|
||||
<p>制单日期：{{ form.outDate }}</p>
|
||||
<table border>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td style="width: 60px">序号</td>
|
||||
<td>物资名称</td>
|
||||
<td>品牌</td>
|
||||
<td>规格型号</td>
|
||||
<td style="width: 40px">单位</td>
|
||||
<td>供应商</td>
|
||||
<td style="width: 40px">数量</td>
|
||||
<td style="width: 80px">单价</td>
|
||||
<td>合计</td>
|
||||
<td>备注</td>
|
||||
</tr>
|
||||
<tr v-for="(item, index) in form.items" :key="index">
|
||||
<td>{{ index + 1 }}</td>
|
||||
<td>{{ item.materialName }}</td>
|
||||
<td>{{ item.brand }}</td>
|
||||
<td>{{ item.model }}</td>
|
||||
<td>{{ item.unit }}</td>
|
||||
<td>{{ form.supplierName }}</td>
|
||||
<td>{{ item.outNum }}</td>
|
||||
<td>{{ item.outPrice }}</td>
|
||||
<td>{{ item.totalPrice }}</td>
|
||||
<td>{{ item.remark }}</td>
|
||||
</tr>
|
||||
<tr class="footertr">
|
||||
<td>金额大写</td>
|
||||
<td colspan="4">{{ convertToChineseCapital(form.totalAmount) }}</td>
|
||||
<td>总价合计</td>
|
||||
<td colspan="4">{{ form.totalAmount }}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<div class="foorter">
|
||||
<div>制单人：{{ form.leader }}</div>
|
||||
<div>仓库：{{ form.warehouseName }}</div>
|
||||
<div>日期： {{ form.createTime }}</div>
|
||||
<div>备注： {{ form.remark }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref } from 'vue';
|
||||
import { printVueDiv } from '@/utils/print';
|
||||
import { convertToChineseCapital } from '@/utils/money';
|
||||
import { getStockOut } from '@/api/system/TissueOut';
|
||||
const router = useRouter();
|
||||
const route = useRoute();
|
||||
|
||||
const form = ref({
|
||||
id: null,
|
||||
outNo: null, //
|
||||
outDate: '', // 出库日期
|
||||
operateStatus: '0', //
|
||||
remark: '', // 备注
|
||||
supplierName: '', // 供应商
|
||||
warehouseName: '', // 仓库
|
||||
leader: '', // 出库人
|
||||
totalAmount: '', // 总出库金额
|
||||
createTime: '', // 创建时间
|
||||
items: [] // 联系人
|
||||
});
|
||||
|
||||
const userid = ref(null);
|
||||
function init() {
|
||||
if (route.query.id) {
|
||||
userid.value = route.query.id;
|
||||
getStockOut(userid.value).then((res) => {
|
||||
form.value = {
|
||||
id: res.data.id,
|
||||
leader: res.data.leader,
|
||||
totalAmount: res.data.totalAmount ?? '0.00',
|
||||
operateStatus: res.data.operateStatus,
|
||||
outNo: res.data.outNo,
|
||||
outDate: res.data.outDate,
|
||||
remark: res.data.remark,
|
||||
warehouseName: res.data.warehouseName,
|
||||
supplierName: res.data.supplierName,
|
||||
createTime: res.data.createTime,
|
||||
items: res.data.items
|
||||
};
|
||||
});
|
||||
}
|
||||
}
|
||||
init();
|
||||
const handlePrint = () => {
|
||||
console.log('print');
|
||||
// window.print();
|
||||
printVueDiv('print-area', '仓库出库单');
|
||||
};
|
||||
// 推出
|
||||
const cancelForm = () => {
|
||||
router.back();
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.mainbody {
|
||||
padding: 30px;
|
||||
background-color: #fff;
|
||||
margin-top: 20px;
|
||||
border-radius: 5px;
|
||||
.actionsbox {
|
||||
text-align: right;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.formBody {
|
||||
.navtitle {
|
||||
text-align: center;
|
||||
height: 41px;
|
||||
line-height: 14px;
|
||||
color: rgba(48, 49, 51, 1);
|
||||
font-size: 30px;
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
p {
|
||||
line-height: 14px;
|
||||
color: rgba(48, 49, 51, 1);
|
||||
font-size: 16px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
table {
|
||||
margin-top: 15px;
|
||||
width: 100%;
|
||||
border-collapse: collapse; /* 核心：合并边框 */
|
||||
color: rgba(48, 49, 51, 1);
|
||||
tr {
|
||||
border: 1px solid #dddddd; /* 现代浅灰色边框 */
|
||||
td {
|
||||
border: 1px solid #dddddd; /* 现代浅灰色边框 */
|
||||
height: 50px;
|
||||
line-height: 45px;
|
||||
background-color: rgba(255, 255, 255, 1);
|
||||
font-size: 1rem;
|
||||
text-align: center;
|
||||
font-weight: 450;
|
||||
}
|
||||
|
||||
&.footertr td {
|
||||
height: 90px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.foorter {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
width: 85%;
|
||||
margin: 0 auto;
|
||||
gap: 30px;
|
||||
margin-top: 30px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
267
src/views/system/warehouse/IssueOut/add.vue
Normal file
267
src/views/system/warehouse/IssueOut/add.vue
Normal file
@@ -0,0 +1,267 @@
|
||||
<template>
|
||||
<div class="AddBuildingBox">
|
||||
<PageHeader></PageHeader>
|
||||
<el-form class="formBody" label-position="right" ref="formRef" :model="form" :rules="rules" label-width="130px">
|
||||
<div class="AddBuildingBody formbox">
|
||||
<div class="title">
|
||||
<span>基本信息</span>
|
||||
<div>
|
||||
<el-button type="primary" @click="submitForm">提交</el-button>
|
||||
<el-button @click="cancelForm">返回</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="addBuildingFormBody">
|
||||
<el-form-item label="出库日期" prop="outDate">
|
||||
<el-date-picker
|
||||
format="YYYY-MM-DD"
|
||||
value-format="YYYY-MM-DD"
|
||||
style="width: 100%"
|
||||
v-model="form.outDate"
|
||||
type="date"
|
||||
placeholder="请选择出库日期"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="供应商" prop="supplierId">
|
||||
<el-select v-model="form.supplierId" placeholder="请选择供应商">
|
||||
<el-option v-for="(item, index) in supplierlist" :key="index" :label="item.supplierName" :value="item.id" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="出库仓库" prop="warehouseId">
|
||||
<el-select v-model="form.warehouseId" placeholder="请选择出库仓库">
|
||||
<el-option v-for="(item, index) in warehouselist" :key="index" :label="item.warehouseName" :value="item.id" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="出库状态" prop="operateStatus">
|
||||
<el-radio-group v-model="form.operateStatus">
|
||||
<el-radio v-for="(item, index) in com_stock_out_status" :key="index" :value="item.value">{{ item.label }}</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="领用人" prop="leader">
|
||||
<el-input v-model.trim="form.leader" placeholder="请输入领用人" />
|
||||
</el-form-item>
|
||||
<el-form-item label="备注" prop="remark">
|
||||
<el-input type="textarea" :rows="5" v-model.trim="form.remark" placeholder="请输入备注" />
|
||||
</el-form-item>
|
||||
</div>
|
||||
</div>
|
||||
<div class="AddBuildingBody">
|
||||
<div style="margin-bottom: 20px">
|
||||
<span>详细出库列表</span>
|
||||
<material :userid="itemsid" returnvalue="*" @change="handleChangeitem" :is-multiple="true" ref="materialRef">
|
||||
<template #default>
|
||||
<el-button @click="() => materialRef.open()" style="margin-left: 20px" icon="Plus" type="primary">添加</el-button>
|
||||
</template>
|
||||
</material>
|
||||
</div>
|
||||
<div class="addBuildingFormBody">
|
||||
<el-table :data="form.items">
|
||||
<el-table-column label="物料名称" align="center" prop="materialName" />
|
||||
<el-table-column label="品牌" align="center" prop="brand" />
|
||||
<el-table-column label="规格型号" align="center" prop="model" />
|
||||
<el-table-column label="单位" align="center" prop="unit" />
|
||||
<el-table-column label="出库价" align="center" prop="inNo">
|
||||
<template #default="scope">
|
||||
<el-input v-model.trim.number="scope.row.outPrice" placeholder="请输入"></el-input>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="数量" align="center" prop="inNo">
|
||||
<template #default="scope">
|
||||
<el-input v-model.trim.number="scope.row.outNum" placeholder="请输入"></el-input>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="备注" align="center" prop="remark">
|
||||
<template #default="scope">
|
||||
{{ scope.row.remark ? scope.row.remark : '-------' }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" align="center">
|
||||
<template #default="scope">
|
||||
<el-button type="primary" link @click="handleDeleteRow(scope.row.id)">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</div>
|
||||
</el-form>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref } from 'vue';
|
||||
import material from '@/components/Holder/material.vue';
|
||||
import PageHeader from '@/components/Pageheader/index.vue';
|
||||
import { listSupplier } from '@/api/system/Tsupplier';
|
||||
import { listWarehouse } from '@/api/system/Twarehouse';
|
||||
import { MaterialVO } from '@/api/system/Tmaterial/type';
|
||||
import { addStockOut, getStockOut, updateStockOut } from '@/api/system/TissueOut';
|
||||
|
||||
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
||||
const { com_stock_out_status } = toRefs<any>(proxy?.useDict('com_stock_out_status'));
|
||||
interface tabletype extends MaterialVO {
|
||||
costPrice?: number; // 成本价
|
||||
inNum?: number; // 成本价
|
||||
}
|
||||
|
||||
const router = useRouter();
|
||||
const route = useRoute();
|
||||
|
||||
const materialRef = ref();
|
||||
const formRef = ref();
|
||||
const form = ref({
|
||||
id: null,
|
||||
outNo: null, //
|
||||
operateStatus: '0', //
|
||||
outDate: '', // 出库日期
|
||||
supplierId: '', // 供应商
|
||||
warehouseId: '', // 出库仓库
|
||||
leader: '', // 备注
|
||||
remark: '', // 备注
|
||||
items: [] as tabletype[] // 联系人
|
||||
});
|
||||
const itemsid = computed(() => {
|
||||
return form.value.items.map((item) => item.id).join(',');
|
||||
});
|
||||
const rules = ref({
|
||||
outDate: [{ required: true, message: '请选择 出库日期', trigger: 'blur' }],
|
||||
supplierId: [{ required: true, message: '请选择 供应商', trigger: 'blur' }],
|
||||
leader: [{ required: true, message: '请输入制单人', trigger: 'blur' }],
|
||||
warehouseId: [{ required: true, message: '请选择 出库仓库', trigger: 'blur' }]
|
||||
});
|
||||
const userid = ref(null);
|
||||
|
||||
const warehouselist = ref([]);
|
||||
const supplierlist = ref([]);
|
||||
function init() {
|
||||
listWarehouse().then((res) => {
|
||||
warehouselist.value = res.rows;
|
||||
});
|
||||
listSupplier().then((res) => {
|
||||
supplierlist.value = res.rows;
|
||||
});
|
||||
if (route.query.id) {
|
||||
userid.value = route.query.id;
|
||||
getStockOut(userid.value).then((res) => {
|
||||
form.value = {
|
||||
id: res.data.id,
|
||||
leader: res.data.leader,
|
||||
operateStatus: res.data.operateStatus,
|
||||
outNo: res.data.outNo,
|
||||
outDate: res.data.outDate,
|
||||
supplierId: res.data.supplierId,
|
||||
warehouseId: res.data.warehouseId,
|
||||
remark: res.data.remark,
|
||||
items: res.data.items
|
||||
};
|
||||
});
|
||||
}
|
||||
}
|
||||
init();
|
||||
|
||||
function handleChangeitem(row: MaterialVO[]) {
|
||||
const arr = row
|
||||
.map((item) => {
|
||||
if (!item.id) return null;
|
||||
const find = form.value.items.find((i) => i.id === item.id);
|
||||
if (find || form.value.items.length <= 0) {
|
||||
return {
|
||||
...item,
|
||||
materialId: item.id,
|
||||
...find
|
||||
};
|
||||
} else {
|
||||
return {
|
||||
...item,
|
||||
materialId: item.id
|
||||
};
|
||||
}
|
||||
})
|
||||
.filter((item) => item !== null);
|
||||
form.value.items = arr;
|
||||
}
|
||||
function handleDeleteRow(id: string) {
|
||||
const findindex = form.value.items.findIndex((item) => item.id === id);
|
||||
if (findindex !== -1) {
|
||||
form.value.items.splice(findindex, 1);
|
||||
}
|
||||
}
|
||||
|
||||
// !== 提交 =============================================================================
|
||||
// 提交
|
||||
const submitForm = () => {
|
||||
formRef.value?.validate(async (valid: boolean) => {
|
||||
if (valid) {
|
||||
if (userid.value) {
|
||||
updateStockOut(form.value).then(() => {
|
||||
ElMessage.success('编辑成功');
|
||||
cancelForm();
|
||||
});
|
||||
} else {
|
||||
addStockOut(form.value).then(() => {
|
||||
ElMessage.success('添加成功');
|
||||
cancelForm();
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
};
|
||||
// 推出
|
||||
const cancelForm = () => {
|
||||
router.back();
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.AddBuildingBox {
|
||||
padding: 15px;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
.AddBuildingBody {
|
||||
margin-top: 20px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
background-color: white;
|
||||
padding: 15px;
|
||||
|
||||
.title {
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
padding-left: 20px;
|
||||
background-color: rgba(255, 255, 255, 1);
|
||||
color: rgba(16, 16, 16, 1);
|
||||
margin-bottom: 60px;
|
||||
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
&.formbox .addBuildingFormBody {
|
||||
width: 550px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.addBuildingFormBody {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.formBody {
|
||||
width: 650px;
|
||||
margin: 0 auto;
|
||||
&:deep(.el-form-item__content, .el-date-picker, .el-select, .el-input) {
|
||||
width: 550px !important;
|
||||
margin-right: 10px;
|
||||
}
|
||||
.el-form-item {
|
||||
margin-bottom: 20px;
|
||||
align-items: center;
|
||||
}
|
||||
.el-button {
|
||||
width: 80px;
|
||||
height: 35px;
|
||||
margin-right: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,12 +1,237 @@
|
||||
<template>
|
||||
<div class="p-2 h-full flex flex-col">
|
||||
<Pageheader title="出库管理"></Pageheader>
|
||||
<div class="flex-1 color-gray flex h-full font-size-6 flex-center">系统还在维护中，敬请期待...</div>
|
||||
<pageheader></pageheader>
|
||||
<transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
|
||||
<div v-show="showSearch" class="mb-[10px]">
|
||||
<el-card shadow="hover">
|
||||
<el-form ref="queryFormRef" :model="queryParams" :inline="true">
|
||||
<el-form-item label="出库单号" prop="outNo">
|
||||
<el-input v-model="queryParams.outNo" placeholder="请输入出库单号" clearable @keyup.enter="handleQuery" />
|
||||
</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-card>
|
||||
</div>
|
||||
</transition>
|
||||
|
||||
<el-card class="flex-1" shadow="never">
|
||||
<template #header>
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<el-button type="primary" plain icon="Plus" @click="handleAdd" v-hasPermi="['system:stockOut:add']">新增</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate()" v-hasPermi="['system:stockOut:edit']"
|
||||
>修改</el-button
|
||||
>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete()" v-hasPermi="['system:stockOut:remove']"
|
||||
>删除</el-button
|
||||
>
|
||||
</el-col>
|
||||
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
</template>
|
||||
|
||||
<el-table v-loading="loading" border :data="stockOutList" @selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" flexd width="55" align="center" />
|
||||
<el-table-column label="出库单号" flexd align="center" prop="outNo" />
|
||||
<el-table-column label="出库日期" width="100" align="center" prop="outDate" />
|
||||
<el-table-column label="领用人" align="center" prop="supplierName" />
|
||||
<el-table-column label="出库仓库" align="center" prop="warehouseName" />
|
||||
<el-table-column label="操作状态" width="80" align="center" prop="operateStatus">
|
||||
<template #default="scope">
|
||||
<dict-tag :options="com_stock_out_status" :value="scope.row.operateStatus"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="负责人" show-overflow-tooltip align="center" prop="leader" />
|
||||
<el-table-column label="备注" align="center" prop="remark" />
|
||||
<el-table-column label="操作" width="180" align="center" fixed="right" class-name="small-padding fixed-width">
|
||||
<template #default="scope">
|
||||
<el-button link type="primary" @click="handleMain(scope.row)" v-hasPermi="['system:stockOut:edit']">查看清单</el-button>
|
||||
<el-button link type="primary" @click="handleUpdate(scope.row)" v-hasPermi="['system:stockOut:edit']">修改</el-button>
|
||||
<el-button link type="primary" @click="handleDelete(scope.row)" v-hasPermi="['system:stockOut: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" />
|
||||
</el-card>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref } from 'vue';
|
||||
<script setup name="StockOut" lang="ts">
|
||||
import { listStockOut, getStockOut, delStockOut, addStockOut, updateStockOut } from '@/api/system/TissueOut/index';
|
||||
import { StockOutVO, StockOutQuery, StockOutForm } from '@/api/system/TissueOut/type';
|
||||
|
||||
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
||||
const { com_stock_out_status } = toRefs<any>(proxy?.useDict('com_stock_out_status'));
|
||||
|
||||
const stockOutList = ref<StockOutVO[]>([]);
|
||||
const buttonLoading = ref(false);
|
||||
const loading = ref(true);
|
||||
const showSearch = ref(true);
|
||||
const ids = ref<Array<string | number>>([]);
|
||||
const single = ref(true);
|
||||
const multiple = ref(true);
|
||||
const total = ref(0);
|
||||
|
||||
const queryFormRef = ref<ElFormInstance>();
|
||||
const stockOutFormRef = ref<ElFormInstance>();
|
||||
|
||||
const dialog = reactive<DialogOption>({
|
||||
visible: false,
|
||||
title: ''
|
||||
});
|
||||
|
||||
const initFormData: StockOutForm = {
|
||||
id: undefined,
|
||||
outNo: undefined,
|
||||
outDate: undefined,
|
||||
supplierId: undefined,
|
||||
warehouseId: undefined,
|
||||
operateStatus: undefined,
|
||||
leader: undefined,
|
||||
remark: undefined
|
||||
};
|
||||
const data = reactive<PageData<StockOutForm, StockOutQuery>>({
|
||||
form: { ...initFormData },
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
outNo: undefined,
|
||||
outDate: undefined,
|
||||
supplierId: undefined,
|
||||
warehouseId: undefined,
|
||||
operateStatus: undefined,
|
||||
leader: undefined,
|
||||
params: {}
|
||||
},
|
||||
rules: {
|
||||
id: [{ required: true, message: '主键不能为空', trigger: 'blur' }],
|
||||
outNo: [{ required: true, message: '出库单号不能为空', trigger: 'blur' }],
|
||||
outDate: [{ required: true, message: '出库日期不能为空', trigger: 'blur' }],
|
||||
supplierId: [{ required: true, message: '领用人(供应商id)不能为空', trigger: 'blur' }],
|
||||
warehouseId: [{ required: true, message: '出库仓库id不能为空', trigger: 'blur' }]
|
||||
}
|
||||
});
|
||||
|
||||
const { queryParams, form, rules } = toRefs(data);
|
||||
|
||||
/** 查询出库主列表 */
|
||||
const getList = async () => {
|
||||
loading.value = true;
|
||||
const res = await listStockOut(queryParams.value);
|
||||
stockOutList.value = res.rows;
|
||||
total.value = res.total;
|
||||
loading.value = false;
|
||||
};
|
||||
|
||||
/** 取消按钮 */
|
||||
const cancel = () => {
|
||||
reset();
|
||||
dialog.visible = false;
|
||||
};
|
||||
|
||||
/** 表单重置 */
|
||||
const reset = () => {
|
||||
form.value = { ...initFormData };
|
||||
stockOutFormRef.value?.resetFields();
|
||||
};
|
||||
|
||||
/** 搜索按钮操作 */
|
||||
const handleQuery = () => {
|
||||
queryParams.value.pageNum = 1;
|
||||
getList();
|
||||
};
|
||||
|
||||
/** 重置按钮操作 */
|
||||
const resetQuery = () => {
|
||||
queryFormRef.value?.resetFields();
|
||||
handleQuery();
|
||||
};
|
||||
|
||||
/** 多选框选中数据 */
|
||||
const handleSelectionChange = (selection: StockOutVO[]) => {
|
||||
ids.value = selection.map((item) => item.id);
|
||||
single.value = selection.length != 1;
|
||||
multiple.value = !selection.length;
|
||||
};
|
||||
|
||||
const router = useRouter();
|
||||
/** 新增按钮操作 */
|
||||
const handleAdd = () => {
|
||||
router.push({
|
||||
path: '/warehouse/addissueOut'
|
||||
});
|
||||
};
|
||||
|
||||
/** 修改按钮操作 */
|
||||
const handleUpdate = async (row?: StockOutVO) => {
|
||||
router.push({
|
||||
path: '/warehouse/stockoutMain',
|
||||
query: {
|
||||
id: row.id
|
||||
}
|
||||
});
|
||||
};
|
||||
/** 修改按钮操作 */
|
||||
const handleMain = async (row?: StockOutVO) => {
|
||||
router.push({
|
||||
path: '/warehouse/stockoutMain',
|
||||
query: {
|
||||
id: row.id
|
||||
}
|
||||
});
|
||||
};
|
||||
/** 提交按钮 */
|
||||
const submitForm = () => {
|
||||
stockOutFormRef.value?.validate(async (valid: boolean) => {
|
||||
if (valid) {
|
||||
buttonLoading.value = true;
|
||||
if (form.value.id) {
|
||||
await updateStockOut(form.value).finally(() => (buttonLoading.value = false));
|
||||
} else {
|
||||
await addStockOut(form.value).finally(() => (buttonLoading.value = false));
|
||||
}
|
||||
proxy?.$modal.msgSuccess('操作成功');
|
||||
dialog.visible = false;
|
||||
await getList();
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
/** 删除按钮操作 */
|
||||
const handleDelete = async (row?: StockOutVO) => {
|
||||
const _ids = row?.id || ids.value;
|
||||
await proxy?.$modal.confirm('是否确认删除出库主编号为"' + _ids + '"的数据项？').finally(() => (loading.value = false));
|
||||
await delStockOut(_ids);
|
||||
proxy?.$modal.msgSuccess('删除成功');
|
||||
await getList();
|
||||
};
|
||||
|
||||
/** 导出按钮操作 */
|
||||
const handleExport = () => {
|
||||
proxy?.download(
|
||||
'system/stockOut/export',
|
||||
{
|
||||
...queryParams.value
|
||||
},
|
||||
`stockOut_${new Date().getTime()}.xlsx`
|
||||
);
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
getList();
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss"></style>
|
||||
<style lang="scss" scoped>
|
||||
.el-table {
|
||||
height: calc(100% - 80px);
|
||||
}
|
||||
</style>
|
||||
|
||||
142
src/views/system/warehouse/Material/addMaterial.vue
Normal file
142
src/views/system/warehouse/Material/addMaterial.vue
Normal file
@@ -0,0 +1,142 @@
|
||||
<template>
|
||||
<div class="AddBuildingBox">
|
||||
<PageHeader></PageHeader>
|
||||
<div class="AddBuildingBody">
|
||||
<div class="title">基本信息</div>
|
||||
<div class="addBuildingFormBody">
|
||||
<el-form class="formBody" label-position="right" ref="formRef" :model="form" :rules="rules" label-width="130px">
|
||||
<el-form-item label="物料名称" prop="materialName">
|
||||
<el-input v-model.trim="form.materialName" placeholder="请输入物料名称" />
|
||||
</el-form-item>
|
||||
<el-form-item label="品牌" prop="brand">
|
||||
<el-input v-model.trim="form.brand" placeholder="请输入品牌" />
|
||||
</el-form-item>
|
||||
<el-form-item label="规格型号" prop="model">
|
||||
<el-input v-model.trim="form.model" placeholder="请输入规格型号" />
|
||||
</el-form-item>
|
||||
<el-form-item label="计量单位" prop="unit">
|
||||
<el-input v-model.trim="form.unit" placeholder="请输入计量单位" />
|
||||
</el-form-item>
|
||||
<el-form-item label="备注" prop="remark">
|
||||
<el-input type="textarea" :rows="5" v-model.trim="form.remark" placeholder="请输入备注" />
|
||||
</el-form-item>
|
||||
<el-form-item style="margin-top: 30px">
|
||||
<el-button type="primary" @click="submitForm">提交</el-button>
|
||||
<el-button @click="cancelForm">返回</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref } from 'vue';
|
||||
import PageHeader from '@/components/Pageheader/index.vue';
|
||||
import { validator } from '@/utils/Reg';
|
||||
import { getMaterial, updateMaterial, addMaterial } from '@/api/system/Tmaterial';
|
||||
|
||||
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
||||
|
||||
const router = useRouter();
|
||||
const route = useRoute();
|
||||
|
||||
const formRef = ref();
|
||||
const form = ref({
|
||||
id: null,
|
||||
materialName: '', // 物料名称
|
||||
brand: '', // 联系电话
|
||||
model: '', // 邮箱
|
||||
unit: '', // 地址
|
||||
remark: '' // 备注
|
||||
});
|
||||
const rules = ref({
|
||||
materialName: [{ required: true, message: '请输入 物料名称', trigger: 'blur' }],
|
||||
brand: [{ required: true, message: '请输入 品牌', trigger: 'blur' }],
|
||||
model: [{ required: true, message: '请输入 规格型号', trigger: 'blur' }],
|
||||
unit: [{ required: true, message: '请输入 计量单位', trigger: 'blur' }]
|
||||
});
|
||||
const userid = ref(null);
|
||||
if (route.query.id) {
|
||||
userid.value = route.query.id;
|
||||
getMaterial(userid.value).then((res) => {
|
||||
form.value = {
|
||||
id: res.data.id,
|
||||
materialName: res.data.materialName,
|
||||
brand: res.data.brand,
|
||||
model: res.data.model,
|
||||
unit: res.data.unit,
|
||||
remark: res.data.remark
|
||||
};
|
||||
});
|
||||
}
|
||||
// !== 提交 =============================================================================
|
||||
// 提交
|
||||
const submitForm = () => {
|
||||
formRef.value?.validate(async (valid: boolean) => {
|
||||
if (valid) {
|
||||
if (userid.value) {
|
||||
updateMaterial(form.value).then((res) => {
|
||||
ElMessage.success('编辑成功');
|
||||
cancelForm();
|
||||
});
|
||||
} else {
|
||||
addMaterial(form.value).then((res) => {
|
||||
ElMessage.success('添加成功');
|
||||
cancelForm();
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
};
|
||||
// 推出
|
||||
const cancelForm = () => {
|
||||
router.back();
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.AddBuildingBox {
|
||||
padding: 15px;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
.AddBuildingBody {
|
||||
margin-top: 20px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
background-color: white;
|
||||
padding: 15px;
|
||||
.title {
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
padding-left: 20px;
|
||||
background-color: rgba(255, 255, 255, 1);
|
||||
color: rgba(16, 16, 16, 1);
|
||||
border-bottom: 1px solid #bbbbbb;
|
||||
margin-bottom: 60px;
|
||||
}
|
||||
|
||||
.formBody {
|
||||
width: 650px;
|
||||
margin: 0 auto;
|
||||
&:deep(.el-form-item__content, .el-select, .el-input) {
|
||||
width: 350px !important;
|
||||
margin-right: 10px;
|
||||
.el-cascader {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
.el-form-item {
|
||||
margin-bottom: 20px;
|
||||
align-items: center;
|
||||
}
|
||||
.el-button {
|
||||
width: 80px;
|
||||
height: 35px;
|
||||
margin-right: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,12 +1,239 @@
|
||||
<template>
|
||||
<div class="p-2 h-full flex flex-col">
|
||||
<Pageheader title="物料管理"></Pageheader>
|
||||
<div class="flex-1 color-gray flex h-full font-size-6 flex-center">系统还在维护中，敬请期待...</div>
|
||||
<div class="flex flex-col h-full p-2">
|
||||
<pageheader></pageheader>
|
||||
<transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
|
||||
<div v-show="showSearch" class="mb-[10px]">
|
||||
<el-card shadow="hover">
|
||||
<el-form ref="queryFormRef" :model="queryParams" :inline="true">
|
||||
<el-form-item label="物料名称" prop="materialName">
|
||||
<el-input v-model="queryParams.materialName" placeholder="请输入物料名称" clearable @keyup.enter="handleQuery" />
|
||||
</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-card>
|
||||
</div>
|
||||
</transition>
|
||||
|
||||
<el-card class="flex-1" shadow="never">
|
||||
<template #header>
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<el-button type="primary" plain icon="Plus" @click="handleAdd" v-hasPermi="['system:material:add']">新增</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete()" v-hasPermi="['system:material:remove']"
|
||||
>删除</el-button
|
||||
>
|
||||
</el-col>
|
||||
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
</template>
|
||||
|
||||
<el-table v-loading="loading" border :data="materialList" @selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<el-table-column label="物料名称" align="center" prop="materialName" />
|
||||
<el-table-column label="品牌" align="center" prop="brand" />
|
||||
<el-table-column label="规格型号" align="center" prop="model" />
|
||||
<el-table-column label="计量单位" align="center" prop="unit" />
|
||||
<el-table-column label="备注" show-overflow-tooltip align="center" prop="remark" />
|
||||
<el-table-column label="操作" align="center" fixed="right" class-name="small-padding fixed-width">
|
||||
<template #default="scope">
|
||||
<el-tooltip content="修改" placement="top">
|
||||
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:material:edit']"></el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip content="删除" placement="top">
|
||||
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['system:material:remove']"></el-button>
|
||||
</el-tooltip>
|
||||
</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" />
|
||||
</el-card>
|
||||
<!-- 添加或修改物料对话框 -->
|
||||
<el-dialog :title="dialog.title" v-model="dialog.visible" width="500px" append-to-body>
|
||||
<el-form ref="materialFormRef" :model="form" :rules="rules" label-width="80px">
|
||||
<el-form-item label="物料名称*" prop="materialName">
|
||||
<el-input v-model="form.materialName" placeholder="请输入物料名称*" />
|
||||
</el-form-item>
|
||||
<el-form-item label="品牌*" prop="brand">
|
||||
<el-input v-model="form.brand" placeholder="请输入品牌*" />
|
||||
</el-form-item>
|
||||
<el-form-item label="规格型号*" prop="model">
|
||||
<el-input v-model="form.model" placeholder="请输入规格型号*" />
|
||||
</el-form-item>
|
||||
<el-form-item label="计量单位" prop="unit">
|
||||
<el-input v-model="form.unit" placeholder="请输入计量单位" />
|
||||
</el-form-item>
|
||||
<el-form-item label="备注" prop="remark">
|
||||
<el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<div class="dialog-footer">
|
||||
<el-button :loading="buttonLoading" type="primary" @click="submitForm">确 定</el-button>
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref } from 'vue';
|
||||
<script setup name="Material" lang="ts">
|
||||
import { listMaterial, getMaterial, delMaterial, addMaterial, updateMaterial } from '@/api/system/Tmaterial';
|
||||
import { MaterialVO, MaterialQuery, MaterialForm } from '@/api/system/Tmaterial/type';
|
||||
|
||||
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
||||
const router = useRouter();
|
||||
const materialList = ref<MaterialVO[]>([]);
|
||||
const buttonLoading = ref(false);
|
||||
const loading = ref(true);
|
||||
const showSearch = ref(true);
|
||||
const ids = ref<Array<string | number>>([]);
|
||||
const single = ref(true);
|
||||
const multiple = ref(true);
|
||||
const total = ref(0);
|
||||
|
||||
const queryFormRef = ref<ElFormInstance>();
|
||||
const materialFormRef = ref<ElFormInstance>();
|
||||
|
||||
const dialog = reactive<DialogOption>({
|
||||
visible: false,
|
||||
title: ''
|
||||
});
|
||||
|
||||
const initFormData: MaterialForm = {
|
||||
id: undefined,
|
||||
materialName: undefined,
|
||||
brand: undefined,
|
||||
model: undefined,
|
||||
unit: undefined,
|
||||
remark: undefined
|
||||
};
|
||||
const data = reactive<PageData<MaterialForm, MaterialQuery>>({
|
||||
form: { ...initFormData },
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
materialName: undefined,
|
||||
brand: undefined,
|
||||
model: undefined,
|
||||
unit: undefined
|
||||
},
|
||||
rules: {
|
||||
id: [{ required: true, message: '物料ID不能为空', trigger: 'blur' }],
|
||||
materialName: [{ required: true, message: '物料名称*不能为空', trigger: 'blur' }],
|
||||
brand: [{ required: true, message: '品牌*不能为空', trigger: 'blur' }],
|
||||
model: [{ required: true, message: '规格型号*不能为空', trigger: 'blur' }]
|
||||
}
|
||||
});
|
||||
|
||||
const { queryParams, form, rules } = toRefs(data);
|
||||
|
||||
/** 查询物料列表 */
|
||||
const getList = async () => {
|
||||
loading.value = true;
|
||||
const res = await listMaterial(queryParams.value);
|
||||
materialList.value = res.rows;
|
||||
total.value = res.total;
|
||||
loading.value = false;
|
||||
};
|
||||
|
||||
/** 取消按钮 */
|
||||
const cancel = () => {
|
||||
reset();
|
||||
dialog.visible = false;
|
||||
};
|
||||
|
||||
/** 表单重置 */
|
||||
const reset = () => {
|
||||
form.value = { ...initFormData };
|
||||
materialFormRef.value?.resetFields();
|
||||
};
|
||||
|
||||
/** 搜索按钮操作 */
|
||||
const handleQuery = () => {
|
||||
queryParams.value.pageNum = 1;
|
||||
getList();
|
||||
};
|
||||
|
||||
/** 重置按钮操作 */
|
||||
const resetQuery = () => {
|
||||
queryFormRef.value?.resetFields();
|
||||
handleQuery();
|
||||
};
|
||||
|
||||
/** 多选框选中数据 */
|
||||
const handleSelectionChange = (selection: MaterialVO[]) => {
|
||||
ids.value = selection.map((item) => item.id);
|
||||
single.value = selection.length != 1;
|
||||
multiple.value = !selection.length;
|
||||
};
|
||||
|
||||
/** 新增按钮操作 */
|
||||
const handleAdd = () => {
|
||||
router.push({
|
||||
path: '/warehouse/addMaterial'
|
||||
});
|
||||
};
|
||||
|
||||
/** 修改按钮操作 */
|
||||
const handleUpdate = async (row?: MaterialVO) => {
|
||||
router.push({
|
||||
path: '/warehouse/addMaterial',
|
||||
query: {
|
||||
id: row.id
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
/** 提交按钮 */
|
||||
const submitForm = () => {
|
||||
materialFormRef.value?.validate(async (valid: boolean) => {
|
||||
if (valid) {
|
||||
buttonLoading.value = true;
|
||||
if (form.value.id) {
|
||||
await updateMaterial(form.value).finally(() => (buttonLoading.value = false));
|
||||
} else {
|
||||
await addMaterial(form.value).finally(() => (buttonLoading.value = false));
|
||||
}
|
||||
proxy?.$modal.msgSuccess('操作成功');
|
||||
dialog.visible = false;
|
||||
await getList();
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
/** 删除按钮操作 */
|
||||
const handleDelete = async (row?: MaterialVO) => {
|
||||
const _ids = row?.id || ids.value;
|
||||
await proxy?.$modal.confirm('是否确认删除该物料？').finally(() => (loading.value = false));
|
||||
await delMaterial(_ids);
|
||||
proxy?.$modal.msgSuccess('删除成功');
|
||||
await getList();
|
||||
};
|
||||
|
||||
/** 导出按钮操作 */
|
||||
const handleExport = () => {
|
||||
proxy?.download(
|
||||
'system/material/export',
|
||||
{
|
||||
...queryParams.value
|
||||
},
|
||||
`material_${new Date().getTime()}.xlsx`
|
||||
);
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
getList();
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss"></style>
|
||||
<style lang="scss" scoped>
|
||||
.el-table {
|
||||
height: calc(100% - 80px);
|
||||
}
|
||||
</style>
|
||||
|
||||
171
src/views/system/warehouse/PurchaseIn/Main.vue
Normal file
171
src/views/system/warehouse/PurchaseIn/Main.vue
Normal file
@@ -0,0 +1,171 @@
|
||||
<template>
|
||||
<div class="h-full flex flex-col p-2">
|
||||
<Pageheader></Pageheader>
|
||||
<div class="mainbody">
|
||||
<div class="actionsbox">
|
||||
<el-button @click="handlePrint" icon="Printer" type="primary">打印</el-button>
|
||||
<el-button @click="cancelForm">返回</el-button>
|
||||
</div>
|
||||
<div class="formBody" id="print-area">
|
||||
<div class="navtitle">入库单</div>
|
||||
<p>单号：{{ form.inNo }}</p>
|
||||
<p>制单日期：{{ form.inDate }}</p>
|
||||
<table border>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td style="width: 60px">序号</td>
|
||||
<td>物资名称</td>
|
||||
<td>品牌</td>
|
||||
<td>规格型号</td>
|
||||
<td style="width: 40px">单位</td>
|
||||
<td>供应商</td>
|
||||
<td style="width: 40px">数量</td>
|
||||
<td style="width: 80px">单价</td>
|
||||
<td>合计</td>
|
||||
<td>备注</td>
|
||||
</tr>
|
||||
<tr v-for="(item, index) in form.items" :key="index">
|
||||
<td>{{ index + 1 }}</td>
|
||||
<td>{{ item.materialName }}</td>
|
||||
<td>{{ item.brand }}</td>
|
||||
<td>{{ item.model }}</td>
|
||||
<td>{{ item.unit }}</td>
|
||||
<td>{{ form.supplierName }}</td>
|
||||
<td>{{ item.stockNum }}</td>
|
||||
<td>{{ item.costPrice }}</td>
|
||||
<td>{{ item.totalPrice }}</td>
|
||||
<td>{{ item.remark }}</td>
|
||||
</tr>
|
||||
<tr class="footertr">
|
||||
<td>金额大写</td>
|
||||
<td colspan="4">{{ convertToChineseCapital(form.totalAmount) }}</td>
|
||||
<td>总价合计</td>
|
||||
<td colspan="4">{{ form.totalAmount }}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<div class="foorter">
|
||||
<div>制单人：{{ form.leader }}</div>
|
||||
<div>仓库：{{ form.warehouseName }}</div>
|
||||
<div>日期： {{ form.createTime }}</div>
|
||||
<div>备注： {{ form.remark }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { getStockIn } from '@/api/system/TPurchaseIn';
|
||||
import { ref } from 'vue';
|
||||
import { printVueDiv } from '@/utils/print';
|
||||
import { convertToChineseCapital } from '@/utils/money';
|
||||
const router = useRouter();
|
||||
const route = useRoute();
|
||||
|
||||
const form = ref({
|
||||
id: null,
|
||||
inNo: null, //
|
||||
operateStatus: '0', //
|
||||
inDate: '', // 入库日期
|
||||
remark: '', // 备注
|
||||
supplierName: '', // 供应商
|
||||
warehouseName: '', // 仓库
|
||||
leader: '', // 入库人
|
||||
totalAmount: '', // 入库人
|
||||
createTime: '', // 创建时间
|
||||
items: [] // 联系人
|
||||
});
|
||||
|
||||
const userid = ref(null);
|
||||
function init() {
|
||||
if (route.query.id) {
|
||||
userid.value = route.query.id;
|
||||
getStockIn(userid.value).then((res) => {
|
||||
form.value = {
|
||||
id: res.data.id,
|
||||
leader: res.data.leader,
|
||||
totalAmount: res.data.totalAmount,
|
||||
operateStatus: res.data.operateStatus,
|
||||
inNo: res.data.inNo,
|
||||
inDate: res.data.inDate,
|
||||
remark: res.data.remark,
|
||||
warehouseName: res.data.warehouseName,
|
||||
supplierName: res.data.supplierName,
|
||||
createTime: res.data.createTime,
|
||||
items: res.data.items
|
||||
};
|
||||
});
|
||||
}
|
||||
}
|
||||
init();
|
||||
const handlePrint = () => {
|
||||
console.log('print');
|
||||
// window.print();
|
||||
printVueDiv('print-area', '仓库入库单');
|
||||
};
|
||||
// 推出
|
||||
const cancelForm = () => {
|
||||
router.back();
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.mainbody {
|
||||
padding: 30px;
|
||||
background-color: #fff;
|
||||
margin-top: 20px;
|
||||
border-radius: 5px;
|
||||
.actionsbox {
|
||||
text-align: right;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.formBody {
|
||||
.navtitle {
|
||||
text-align: center;
|
||||
height: 41px;
|
||||
line-height: 14px;
|
||||
color: rgba(48, 49, 51, 1);
|
||||
font-size: 30px;
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
p {
|
||||
line-height: 14px;
|
||||
color: rgba(48, 49, 51, 1);
|
||||
font-size: 16px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
table {
|
||||
margin-top: 15px;
|
||||
width: 100%;
|
||||
border-collapse: collapse; /* 核心：合并边框 */
|
||||
color: rgba(48, 49, 51, 1);
|
||||
tr {
|
||||
border: 1px solid #dddddd; /* 现代浅灰色边框 */
|
||||
td {
|
||||
border: 1px solid #dddddd; /* 现代浅灰色边框 */
|
||||
height: 50px;
|
||||
line-height: 45px;
|
||||
background-color: rgba(255, 255, 255, 1);
|
||||
font-size: 1rem;
|
||||
text-align: center;
|
||||
font-weight: 450;
|
||||
}
|
||||
|
||||
&.footertr td {
|
||||
height: 90px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.foorter {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
width: 85%;
|
||||
margin: 0 auto;
|
||||
gap: 30px;
|
||||
margin-top: 30px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
275
src/views/system/warehouse/PurchaseIn/add.vue
Normal file
275
src/views/system/warehouse/PurchaseIn/add.vue
Normal file
@@ -0,0 +1,275 @@
|
||||
<template>
|
||||
<div class="AddBuildingBox">
|
||||
<PageHeader></PageHeader>
|
||||
<el-form class="formBody" label-position="right" ref="formRef" :model="form" :rules="rules" label-width="130px">
|
||||
<div class="AddBuildingBody formbox">
|
||||
<div class="title">
|
||||
<span>基本信息</span>
|
||||
<div>
|
||||
<el-button type="primary" @click="submitForm">提交</el-button>
|
||||
<el-button @click="cancelForm">返回</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="addBuildingFormBody">
|
||||
<el-form-item label="入库日期" prop="inDate">
|
||||
<el-date-picker
|
||||
format="YYYY-MM-DD"
|
||||
value-format="YYYY-MM-DD"
|
||||
style="width: 100%"
|
||||
v-model="form.inDate"
|
||||
type="date"
|
||||
placeholder="请选择入库日期"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="供应商" prop="supplierId">
|
||||
<el-select v-model="form.supplierId" placeholder="请选择供应商">
|
||||
<el-option v-for="(item, index) in supplierlist" :key="index" :label="item.supplierName" :value="item.id" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="入库仓库" prop="warehouseId">
|
||||
<el-select v-model="form.warehouseId" placeholder="请选择入库仓库">
|
||||
<el-option v-for="(item, index) in warehouselist" :key="index" :label="item.warehouseName" :value="item.id" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="入库状态" prop="operateStatus">
|
||||
<el-radio-group v-model="form.operateStatus">
|
||||
<el-radio v-for="(item, index) in com_stock_in_status" :key="index" :value="item.value">{{ item.label }}</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="制单人" prop="leader">
|
||||
<el-input v-model.trim="form.leader" placeholder="请输入制单人" />
|
||||
</el-form-item>
|
||||
<el-form-item label="备注" prop="remark">
|
||||
<el-input type="textarea" :rows="5" v-model.trim="form.remark" placeholder="请输入备注" />
|
||||
</el-form-item>
|
||||
</div>
|
||||
</div>
|
||||
<div class="AddBuildingBody">
|
||||
<div style="margin-bottom: 20px">
|
||||
<span>详细入库列表</span>
|
||||
<material :userid="itemsid" returnvalue="*" @change="handleChangeitem" :is-multiple="true" ref="materialRef">
|
||||
<template #default>
|
||||
<el-button @click="() => materialRef.open()" style="margin-left: 20px" icon="Plus" type="primary">添加</el-button>
|
||||
</template>
|
||||
</material>
|
||||
</div>
|
||||
<div class="addBuildingFormBody">
|
||||
<el-table :data="form.items">
|
||||
<el-table-column label="物料名称" align="center" prop="materialName" />
|
||||
<el-table-column label="品牌" align="center" prop="brand" />
|
||||
<el-table-column label="规格型号" align="center" prop="model" />
|
||||
<el-table-column label="单位" align="center" prop="unit" />
|
||||
<el-table-column label="成本价" align="center" prop="inNo">
|
||||
<template #default="scope">
|
||||
<el-input v-model.trim.number="scope.row.costPrice" placeholder="请输入"></el-input>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="数量" align="center" prop="inNo">
|
||||
<template #default="scope">
|
||||
<el-input v-model.trim.number="scope.row.inNum" placeholder="请输入"></el-input>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="备注" align="center" prop="remark">
|
||||
<template #default="scope">
|
||||
{{ scope.row.remark ? scope.row.remark : '-------' }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" align="center">
|
||||
<template #default="scope">
|
||||
<el-button type="primary" link @click="handleDeleteRow(scope.row.id)">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</div>
|
||||
</el-form>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref } from 'vue';
|
||||
import material from '@/components/Holder/material.vue';
|
||||
import PageHeader from '@/components/Pageheader/index.vue';
|
||||
import { listSupplier } from '@/api/system/Tsupplier';
|
||||
import { listWarehouse } from '@/api/system/Twarehouse';
|
||||
import { addStockIn, getStockIn, updateStockIn } from '@/api/system/TPurchaseIn';
|
||||
import { MaterialVO } from '@/api/system/Tmaterial/type';
|
||||
|
||||
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
||||
const { com_stock_in_status } = toRefs<any>(proxy?.useDict('com_stock_in_status'));
|
||||
|
||||
interface tabletype extends MaterialVO {
|
||||
costPrice?: number; // 成本价
|
||||
inNum?: number; // 成本价
|
||||
}
|
||||
|
||||
const router = useRouter();
|
||||
const route = useRoute();
|
||||
|
||||
const materialRef = ref();
|
||||
const formRef = ref();
|
||||
const form = ref({
|
||||
id: null,
|
||||
inNo: null, //
|
||||
operateStatus: '0', //
|
||||
inDate: '', // 入库日期
|
||||
supplierId: '', // 供应商
|
||||
warehouseId: '', // 入库仓库
|
||||
leader: '', // 备注
|
||||
remark: '', // 备注
|
||||
items: [] as tabletype[] // 联系人
|
||||
});
|
||||
const itemsid = computed(() => {
|
||||
return form.value.items.map((item) => item.id).join(',');
|
||||
});
|
||||
const rules = ref({
|
||||
inDate: [{ required: true, message: '请选择 入库日期', trigger: 'blur' }],
|
||||
supplierId: [{ required: true, message: '请选择 供应商', trigger: 'blur' }],
|
||||
leader: [{ required: true, message: '请输入制单人', trigger: 'blur' }],
|
||||
warehouseId: [{ required: true, message: '请选择 入库仓库', trigger: 'blur' }]
|
||||
});
|
||||
const userid = ref(null);
|
||||
|
||||
const warehouselist = ref([]);
|
||||
const supplierlist = ref([]);
|
||||
function init() {
|
||||
listWarehouse().then((res) => {
|
||||
warehouselist.value = res.rows;
|
||||
});
|
||||
listSupplier().then((res) => {
|
||||
supplierlist.value = res.rows;
|
||||
});
|
||||
if (route.query.id) {
|
||||
userid.value = route.query.id;
|
||||
getStockIn(userid.value).then((res) => {
|
||||
form.value = {
|
||||
id: res.data.id,
|
||||
leader: res.data.leader,
|
||||
operateStatus: res.data.operateStatus,
|
||||
inNo: res.data.inNo,
|
||||
inDate: res.data.inDate,
|
||||
supplierId: res.data.supplierId,
|
||||
warehouseId: res.data.warehouseId,
|
||||
remark: res.data.remark,
|
||||
items: res.data.items
|
||||
};
|
||||
});
|
||||
}
|
||||
}
|
||||
init();
|
||||
|
||||
function handleChangeitem(row: MaterialVO[]) {
|
||||
const arr = row
|
||||
.map((item) => {
|
||||
if (!item.id) return null;
|
||||
const find = form.value.items.find((i) => i.id === item.id);
|
||||
if (find || form.value.items.length <= 0) {
|
||||
return {
|
||||
...item,
|
||||
materialId: item.id,
|
||||
...find
|
||||
};
|
||||
} else {
|
||||
return {
|
||||
...item,
|
||||
materialId: item.id
|
||||
};
|
||||
}
|
||||
})
|
||||
.filter((item) => item !== null);
|
||||
form.value.items = arr;
|
||||
}
|
||||
function handleDeleteRow(id: string) {
|
||||
const findindex = form.value.items.findIndex((item) => item.id === id);
|
||||
if (findindex !== -1) {
|
||||
form.value.items.splice(findindex, 1);
|
||||
}
|
||||
}
|
||||
|
||||
// !== 提交 =============================================================================
|
||||
// 提交
|
||||
const submitForm = () => {
|
||||
formRef.value?.validate(async (valid: boolean) => {
|
||||
if (valid) {
|
||||
// form.value.items = form.value.items.map((itme) => {
|
||||
// return {
|
||||
// 'materialId': itme.id,
|
||||
// 'costPrice': itme.costPrice,
|
||||
// 'inNum': itme.inNum
|
||||
// };
|
||||
// });
|
||||
if (userid.value) {
|
||||
updateStockIn(form.value).then(() => {
|
||||
ElMessage.success('编辑成功');
|
||||
cancelForm();
|
||||
});
|
||||
} else {
|
||||
addStockIn(form.value).then(() => {
|
||||
ElMessage.success('添加成功');
|
||||
cancelForm();
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
};
|
||||
// 推出
|
||||
const cancelForm = () => {
|
||||
router.back();
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.AddBuildingBox {
|
||||
padding: 15px;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
.AddBuildingBody {
|
||||
margin-top: 20px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
background-color: white;
|
||||
padding: 15px;
|
||||
|
||||
.title {
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
padding-left: 20px;
|
||||
background-color: rgba(255, 255, 255, 1);
|
||||
color: rgba(16, 16, 16, 1);
|
||||
margin-bottom: 60px;
|
||||
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
&.formbox .addBuildingFormBody {
|
||||
width: 550px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.addBuildingFormBody {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.formBody {
|
||||
width: 650px;
|
||||
margin: 0 auto;
|
||||
&:deep(.el-form-item__content, .el-date-picker, .el-select, .el-input) {
|
||||
width: 550px !important;
|
||||
margin-right: 10px;
|
||||
}
|
||||
.el-form-item {
|
||||
margin-bottom: 20px;
|
||||
align-items: center;
|
||||
}
|
||||
.el-button {
|
||||
width: 80px;
|
||||
height: 35px;
|
||||
margin-right: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,12 +1,228 @@
|
||||
<template>
|
||||
<div class="p-2 h-full flex flex-col">
|
||||
<Pageheader title="采购入库管理"></Pageheader>
|
||||
<div class="flex-1 color-gray flex h-full font-size-6 flex-center">系统还在维护中，敬请期待...</div>
|
||||
<div class="h-full flex flex-col p-2">
|
||||
<pageheader></pageheader>
|
||||
<transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
|
||||
<div v-show="showSearch" class="mb-[10px]">
|
||||
<el-card shadow="hover">
|
||||
<el-form ref="queryFormRef" :model="queryParams" :inline="true">
|
||||
<el-form-item label="入库单号" prop="inNo">
|
||||
<el-input v-model="queryParams.inNo" placeholder="请输入入库单号" clearable @keyup.enter="handleQuery" />
|
||||
</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-card>
|
||||
</div>
|
||||
</transition>
|
||||
|
||||
<el-card class="flex-1" shadow="never">
|
||||
<template #header>
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<el-button type="primary" plain icon="Plus" @click="handleAdd" v-hasPermi="['system:stockIn:add']">新增</el-button>
|
||||
</el-col>
|
||||
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
</template>
|
||||
|
||||
<el-table v-loading="loading" border :data="stockInList" @selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" flexd width="55" align="center" />
|
||||
<el-table-column label="入库单号" flexd align="center" prop="inNo" />
|
||||
<el-table-column label="入库日期" width="100" align="center" prop="inDate" />
|
||||
<el-table-column label="供应商" align="center" prop="supplierName" />
|
||||
<el-table-column label="入库仓库" align="center" prop="warehouseName" />
|
||||
<el-table-column label="操作状态" width="80" align="center" prop="operateStatus">
|
||||
<template #default="scope">
|
||||
<dict-tag :options="com_stock_in_status" :value="scope.row.operateStatus"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="制单人" align="center" prop="leader" />
|
||||
<el-table-column label="备注" show-overflow-tooltip align="center" prop="remark" />
|
||||
<el-table-column label="操作" width="200" align="center" fixed="right" class-name="small-padding fixed-width">
|
||||
<template #default="scope">
|
||||
<el-button link type="primary" @click="handleMain(scope.row)" v-hasPermi="['system:stockIn:edit']">查看清单</el-button>
|
||||
<el-button link type="primary" @click="handleUpdate(scope.row)" v-hasPermi="['system:stockIn:edit']">修改</el-button>
|
||||
<el-button link type="primary" @click="handleDelete(scope.row)" v-hasPermi="['system:stockIn: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" />
|
||||
</el-card>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref } from 'vue';
|
||||
<script setup name="StockIn" lang="ts">
|
||||
import { listStockIn, getStockIn, delStockIn, addStockIn, updateStockIn } from '@/api/system/TPurchaseIn';
|
||||
import { StockInVO, StockInQuery, StockInForm } from '@/api/system/TPurchaseIn/type';
|
||||
|
||||
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
||||
const { com_stock_in_status } = toRefs<any>(proxy?.useDict('com_stock_in_status'));
|
||||
|
||||
const stockInList = ref<StockInVO[]>([]);
|
||||
const buttonLoading = ref(false);
|
||||
const loading = ref(true);
|
||||
const showSearch = ref(true);
|
||||
const ids = ref<Array<string | number>>([]);
|
||||
const single = ref(true);
|
||||
const multiple = ref(true);
|
||||
const total = ref(0);
|
||||
|
||||
const queryFormRef = ref<ElFormInstance>();
|
||||
const stockInFormRef = ref<ElFormInstance>();
|
||||
|
||||
const dialog = reactive<DialogOption>({
|
||||
visible: false,
|
||||
title: ''
|
||||
});
|
||||
|
||||
const initFormData: StockInForm = {
|
||||
id: undefined,
|
||||
inNo: undefined,
|
||||
inDate: undefined,
|
||||
supplierId: undefined,
|
||||
warehouseId: undefined,
|
||||
operateStatus: undefined,
|
||||
leader: undefined,
|
||||
remark: undefined
|
||||
};
|
||||
const data = reactive<PageData<StockInForm, StockInQuery>>({
|
||||
form: { ...initFormData },
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
inNo: undefined,
|
||||
inDate: undefined,
|
||||
supplierId: undefined,
|
||||
warehouseId: undefined,
|
||||
operateStatus: undefined,
|
||||
leader: undefined,
|
||||
params: {}
|
||||
},
|
||||
rules: {
|
||||
id: [{ required: true, message: '主键不能为空', trigger: 'blur' }],
|
||||
inNo: [{ required: true, message: '入库单号*不能为空', trigger: 'blur' }],
|
||||
inDate: [{ required: true, message: '入库日期*不能为空', trigger: 'blur' }],
|
||||
supplierId: [{ required: true, message: '供应商id*不能为空', trigger: 'blur' }],
|
||||
warehouseId: [{ required: true, message: '入库仓库id*不能为空', trigger: 'blur' }]
|
||||
}
|
||||
});
|
||||
|
||||
const { queryParams, form, rules } = toRefs(data);
|
||||
|
||||
/** 查询入库主列表 */
|
||||
const getList = async () => {
|
||||
loading.value = true;
|
||||
const res = await listStockIn(queryParams.value);
|
||||
stockInList.value = res.rows;
|
||||
total.value = res.total;
|
||||
loading.value = false;
|
||||
};
|
||||
|
||||
/** 取消按钮 */
|
||||
const cancel = () => {
|
||||
reset();
|
||||
dialog.visible = false;
|
||||
};
|
||||
|
||||
/** 表单重置 */
|
||||
const reset = () => {
|
||||
form.value = { ...initFormData };
|
||||
stockInFormRef.value?.resetFields();
|
||||
};
|
||||
|
||||
/** 搜索按钮操作 */
|
||||
const handleQuery = () => {
|
||||
queryParams.value.pageNum = 1;
|
||||
getList();
|
||||
};
|
||||
|
||||
/** 重置按钮操作 */
|
||||
const resetQuery = () => {
|
||||
queryFormRef.value?.resetFields();
|
||||
handleQuery();
|
||||
};
|
||||
|
||||
/** 多选框选中数据 */
|
||||
const handleSelectionChange = (selection: StockInVO[]) => {
|
||||
ids.value = selection.map((item) => item.id);
|
||||
single.value = selection.length != 1;
|
||||
multiple.value = !selection.length;
|
||||
};
|
||||
|
||||
const router = useRouter();
|
||||
/** 新增按钮操作 */
|
||||
const handleAdd = () => {
|
||||
router.push({
|
||||
path: '/warehouse/addPurchaseIn'
|
||||
});
|
||||
};
|
||||
|
||||
/** 修改按钮操作 */
|
||||
const handleUpdate = async (row?: StockInVO) => {
|
||||
router.push({
|
||||
path: '/warehouse/addPurchaseIn',
|
||||
query: {
|
||||
id: row.id
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
/** 修改按钮操作 */
|
||||
const handleMain = async (row?: StockInVO) => {
|
||||
router.push({
|
||||
path: '/warehouse/purchaseInMain',
|
||||
query: {
|
||||
id: row.id
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
/** 提交按钮 */
|
||||
const submitForm = () => {
|
||||
stockInFormRef.value?.validate(async (valid: boolean) => {
|
||||
if (valid) {
|
||||
buttonLoading.value = true;
|
||||
if (form.value.id) {
|
||||
await updateStockIn(form.value).finally(() => (buttonLoading.value = false));
|
||||
} else {
|
||||
await addStockIn(form.value).finally(() => (buttonLoading.value = false));
|
||||
}
|
||||
proxy?.$modal.msgSuccess('操作成功');
|
||||
dialog.visible = false;
|
||||
await getList();
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
/** 删除按钮操作 */
|
||||
const handleDelete = async (row?: StockInVO) => {
|
||||
const _ids = row?.id || ids.value;
|
||||
await proxy?.$modal.confirm('是否确认删除？').finally(() => (loading.value = false));
|
||||
await delStockIn(_ids);
|
||||
proxy?.$modal.msgSuccess('删除成功');
|
||||
await getList();
|
||||
};
|
||||
|
||||
/** 导出按钮操作 */
|
||||
const handleExport = () => {
|
||||
proxy?.download(
|
||||
'system/stockIn/export',
|
||||
{
|
||||
...queryParams.value
|
||||
},
|
||||
`stockIn_${new Date().getTime()}.xlsx`
|
||||
);
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
getList();
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss"></style>
|
||||
<style lang="scss" scoped>
|
||||
.el-table {
|
||||
height: calc(100% - 80px);
|
||||
}
|
||||
</style>
|
||||
|
||||
155
src/views/system/warehouse/Supplier/addSupplier.vue
Normal file
155
src/views/system/warehouse/Supplier/addSupplier.vue
Normal file
@@ -0,0 +1,155 @@
|
||||
<template>
|
||||
<div class="AddBuildingBox">
|
||||
<PageHeader></PageHeader>
|
||||
<div class="AddBuildingBody">
|
||||
<div class="title">基本信息</div>
|
||||
<div class="addBuildingFormBody">
|
||||
<el-form class="formBody" label-position="right" ref="formRef" :model="form" :rules="rules" label-width="130px">
|
||||
<el-form-item label="供应商名称" prop="supplierName">
|
||||
<el-input v-model.trim="form.supplierName" placeholder="请输入供应商名称" />
|
||||
</el-form-item>
|
||||
<el-form-item label="联系人" prop="contactPerson">
|
||||
<el-input v-model.trim="form.contactPerson" placeholder="请输入联系人" />
|
||||
</el-form-item>
|
||||
<el-form-item label="联系电话" prop="contactPhone">
|
||||
<el-input v-model.trim="form.contactPhone" placeholder="请输入联系电话" />
|
||||
</el-form-item>
|
||||
<el-form-item label="邮箱" prop="email">
|
||||
<el-input v-model.trim="form.email" placeholder="请输入邮箱" />
|
||||
</el-form-item>
|
||||
<el-form-item label="地址" prop="address">
|
||||
<el-input v-model.trim="form.address" placeholder="请输入地址" />
|
||||
</el-form-item>
|
||||
<el-form-item label="备注" prop="remark">
|
||||
<el-input type="textarea" :rows="5" v-model.trim="form.remark" placeholder="请输入备注" />
|
||||
</el-form-item>
|
||||
<el-form-item style="margin-top: 30px">
|
||||
<el-button type="primary" @click="submitForm">提交</el-button>
|
||||
<el-button @click="cancelForm">返回</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref } from 'vue';
|
||||
import PageHeader from '@/components/Pageheader/index.vue';
|
||||
import { getSupplier, updateSupplier, addSupplier } from '@/api/system/Tsupplier';
|
||||
import { validator } from '@/utils/Reg';
|
||||
|
||||
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
||||
|
||||
const router = useRouter();
|
||||
const route = useRoute();
|
||||
|
||||
const formRef = ref();
|
||||
const form = ref({
|
||||
id: null,
|
||||
supplierName: '', // 供应商名称
|
||||
contactPhone: '', // 联系电话
|
||||
email: '', // 邮箱
|
||||
address: '', // 地址
|
||||
remark: '', // 备注
|
||||
contactPerson: '' // 联系人
|
||||
});
|
||||
const rules = ref({
|
||||
supplierName: [{ required: true, message: '请输入供应商名称', trigger: 'blur' }],
|
||||
contactPhone: [{ required: true, message: '请输入 联系电话', trigger: 'blur' }],
|
||||
contactPerson: [{ required: true, message: '请输入 联系人', trigger: 'blur' }],
|
||||
email: [
|
||||
{ required: true, message: '请输入 邮箱', trigger: 'blur' },
|
||||
{
|
||||
validator: (_, value) => validator(value, 'email'),
|
||||
required: false,
|
||||
message: '请输入正确的邮箱格式',
|
||||
trigger: 'blur'
|
||||
}
|
||||
]
|
||||
});
|
||||
const userid = ref(null);
|
||||
if (route.query.id) {
|
||||
userid.value = route.query.id;
|
||||
getSupplier(userid.value).then((res) => {
|
||||
form.value = {
|
||||
id: res.data.id,
|
||||
supplierName: res.data.supplierName,
|
||||
contactPhone: res.data.contactPhone,
|
||||
email: res.data.email,
|
||||
address: res.data.address,
|
||||
remark: res.data.remark,
|
||||
contactPerson: res.data.contactPerson
|
||||
};
|
||||
});
|
||||
}
|
||||
// !== 提交 =============================================================================
|
||||
// 提交
|
||||
const submitForm = () => {
|
||||
formRef.value?.validate(async (valid: boolean) => {
|
||||
if (valid) {
|
||||
if (userid.value) {
|
||||
updateSupplier(form.value).then((res) => {
|
||||
ElMessage.success('编辑成功');
|
||||
cancelForm();
|
||||
});
|
||||
} else {
|
||||
addSupplier(form.value).then((res) => {
|
||||
ElMessage.success('添加成功');
|
||||
cancelForm();
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
};
|
||||
// 推出
|
||||
const cancelForm = () => {
|
||||
router.back();
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.AddBuildingBox {
|
||||
padding: 15px;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
.AddBuildingBody {
|
||||
margin-top: 20px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
background-color: white;
|
||||
padding: 15px;
|
||||
.title {
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
padding-left: 20px;
|
||||
background-color: rgba(255, 255, 255, 1);
|
||||
color: rgba(16, 16, 16, 1);
|
||||
border-bottom: 1px solid #bbbbbb;
|
||||
margin-bottom: 60px;
|
||||
}
|
||||
|
||||
.formBody {
|
||||
width: 650px;
|
||||
margin: 0 auto;
|
||||
&:deep(.el-form-item__content, .el-select, .el-input) {
|
||||
width: 350px !important;
|
||||
margin-right: 10px;
|
||||
.el-cascader {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
.el-form-item {
|
||||
margin-bottom: 20px;
|
||||
align-items: center;
|
||||
}
|
||||
.el-button {
|
||||
width: 80px;
|
||||
height: 35px;
|
||||
margin-right: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,12 +1,247 @@
|
||||
<template>
|
||||
<div class="p-2 h-full flex flex-col">
|
||||
<Pageheader title="供应商管理"></Pageheader>
|
||||
<div class="flex-1 color-gray flex h-full font-size-6 flex-center">系统还在维护中，敬请期待...</div>
|
||||
<div class="flex flex-col h-full p-2">
|
||||
<pageheader></pageheader>
|
||||
<transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
|
||||
<div v-show="showSearch" class="mb-[10px]">
|
||||
<el-card shadow="hover">
|
||||
<el-form ref="queryFormRef" label-width="100px" :model="queryParams" :inline="true">
|
||||
<el-form-item label="供应商名称" prop="supplierName">
|
||||
<el-input v-model="queryParams.supplierName" placeholder="请输入供应商名称" clearable @keyup.enter="handleQuery" />
|
||||
</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-card>
|
||||
</div>
|
||||
</transition>
|
||||
|
||||
<el-card class="flex-1" shadow="never">
|
||||
<template #header>
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<el-button type="primary" plain icon="Plus" @click="handleAdd" v-hasPermi="['system:supplier:add']">新增</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete()" v-hasPermi="['system:supplier:remove']"
|
||||
>删除</el-button
|
||||
>
|
||||
</el-col>
|
||||
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
</template>
|
||||
|
||||
<el-table v-loading="loading" border :data="supplierList" @selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<el-table-column label="供应商名称" align="center" prop="supplierName" />
|
||||
<el-table-column label="联系人" align="center" prop="contactPerson" />
|
||||
<el-table-column label="联系电话" align="center" prop="contactPhone" />
|
||||
<el-table-column label="邮箱" align="center" prop="email" />
|
||||
<el-table-column label="地址" align="center" prop="address" />
|
||||
<el-table-column label="备注" show-overflow-tooltip align="center" prop="remark" />
|
||||
<el-table-column label="操作" align="center" fixed="right" class-name="small-padding fixed-width">
|
||||
<template #default="scope">
|
||||
<el-tooltip content="修改" placement="top">
|
||||
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:supplier:edit']"></el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip content="删除" placement="top">
|
||||
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['system:supplier:remove']"></el-button>
|
||||
</el-tooltip>
|
||||
</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" />
|
||||
</el-card>
|
||||
<!-- 添加或修改供应商对话框 -->
|
||||
<el-dialog :title="dialog.title" v-model="dialog.visible" width="500px" append-to-body>
|
||||
<el-form ref="supplierFormRef" :model="form" :rules="rules" label-width="80px">
|
||||
<el-form-item label="供应商名称*" prop="supplierName">
|
||||
<el-input v-model="form.supplierName" placeholder="请输入供应商名称*" />
|
||||
</el-form-item>
|
||||
<el-form-item label="联系人*" prop="contactPerson">
|
||||
<el-input v-model="form.contactPerson" placeholder="请输入联系人*" />
|
||||
</el-form-item>
|
||||
<el-form-item label="联系电话*" prop="contactPhone">
|
||||
<el-input v-model="form.contactPhone" placeholder="请输入联系电话*" />
|
||||
</el-form-item>
|
||||
<el-form-item label="邮箱" prop="email">
|
||||
<el-input v-model="form.email" placeholder="请输入邮箱" />
|
||||
</el-form-item>
|
||||
<el-form-item label="地址" prop="address">
|
||||
<el-input v-model="form.address" placeholder="请输入地址" />
|
||||
</el-form-item>
|
||||
<el-form-item label="备注" prop="remark">
|
||||
<el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<div class="dialog-footer">
|
||||
<el-button :loading="buttonLoading" type="primary" @click="submitForm">确 定</el-button>
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref } from 'vue';
|
||||
<script setup name="Supplier" lang="ts">
|
||||
import { listSupplier, getSupplier, delSupplier, addSupplier, updateSupplier } from '@/api/system/Tsupplier/index';
|
||||
import { SupplierVO, SupplierQuery, SupplierForm } from '@/api/system/Tsupplier/type';
|
||||
|
||||
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
||||
|
||||
const supplierList = ref<SupplierVO[]>([]);
|
||||
const buttonLoading = ref(false);
|
||||
const loading = ref(true);
|
||||
const showSearch = ref(true);
|
||||
const ids = ref<Array<string | number>>([]);
|
||||
const single = ref(true);
|
||||
const multiple = ref(true);
|
||||
const total = ref(0);
|
||||
|
||||
const queryFormRef = ref<ElFormInstance>();
|
||||
const supplierFormRef = ref<ElFormInstance>();
|
||||
|
||||
const dialog = reactive<DialogOption>({
|
||||
visible: false,
|
||||
title: ''
|
||||
});
|
||||
|
||||
const initFormData: SupplierForm = {
|
||||
id: undefined,
|
||||
supplierName: undefined,
|
||||
contactPerson: undefined,
|
||||
contactPhone: undefined,
|
||||
email: undefined,
|
||||
address: undefined,
|
||||
remark: undefined
|
||||
};
|
||||
const data = reactive<PageData<SupplierForm, SupplierQuery>>({
|
||||
form: { ...initFormData },
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
supplierName: undefined,
|
||||
contactPerson: undefined,
|
||||
contactPhone: undefined,
|
||||
email: undefined,
|
||||
address: undefined,
|
||||
params: {}
|
||||
},
|
||||
rules: {
|
||||
id: [{ required: true, message: '主键ID不能为空', trigger: 'blur' }],
|
||||
supplierName: [{ required: true, message: '供应商名称*不能为空', trigger: 'blur' }],
|
||||
contactPerson: [{ required: true, message: '联系人*不能为空', trigger: 'blur' }],
|
||||
contactPhone: [{ required: true, message: '联系电话*不能为空', trigger: 'blur' }]
|
||||
}
|
||||
});
|
||||
|
||||
const { queryParams, form, rules } = toRefs(data);
|
||||
|
||||
/** 查询供应商列表 */
|
||||
const getList = async () => {
|
||||
loading.value = true;
|
||||
const res = await listSupplier(queryParams.value);
|
||||
supplierList.value = res.rows;
|
||||
total.value = res.total;
|
||||
loading.value = false;
|
||||
};
|
||||
|
||||
/** 取消按钮 */
|
||||
const cancel = () => {
|
||||
reset();
|
||||
dialog.visible = false;
|
||||
};
|
||||
|
||||
/** 表单重置 */
|
||||
const reset = () => {
|
||||
form.value = { ...initFormData };
|
||||
supplierFormRef.value?.resetFields();
|
||||
};
|
||||
|
||||
/** 搜索按钮操作 */
|
||||
const handleQuery = () => {
|
||||
queryParams.value.pageNum = 1;
|
||||
getList();
|
||||
};
|
||||
|
||||
/** 重置按钮操作 */
|
||||
const resetQuery = () => {
|
||||
queryFormRef.value?.resetFields();
|
||||
handleQuery();
|
||||
};
|
||||
|
||||
/** 多选框选中数据 */
|
||||
const handleSelectionChange = (selection: SupplierVO[]) => {
|
||||
ids.value = selection.map((item) => item.id);
|
||||
single.value = selection.length != 1;
|
||||
multiple.value = !selection.length;
|
||||
};
|
||||
|
||||
const router = useRouter();
|
||||
/** 新增按钮操作 */
|
||||
const handleAdd = () => {
|
||||
router.push({
|
||||
path: '/warehouse/addSupplier'
|
||||
});
|
||||
};
|
||||
|
||||
/** 修改按钮操作 */
|
||||
const handleUpdate = async (row?: SupplierVO) => {
|
||||
router.push({
|
||||
path: '/warehouse/addSupplier',
|
||||
query: {
|
||||
id: row.id
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
/** 提交按钮 */
|
||||
const submitForm = () => {
|
||||
supplierFormRef.value?.validate(async (valid: boolean) => {
|
||||
if (valid) {
|
||||
buttonLoading.value = true;
|
||||
if (form.value.id) {
|
||||
await updateSupplier(form.value).finally(() => (buttonLoading.value = false));
|
||||
} else {
|
||||
await addSupplier(form.value).finally(() => (buttonLoading.value = false));
|
||||
}
|
||||
proxy?.$modal.msgSuccess('操作成功');
|
||||
dialog.visible = false;
|
||||
await getList();
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
/** 删除按钮操作 */
|
||||
const handleDelete = async (row?: SupplierVO) => {
|
||||
const _ids = row?.id || ids.value;
|
||||
await proxy?.$modal.confirm('是否确认删除供应商编号为"' + _ids + '"的数据项？').finally(() => (loading.value = false));
|
||||
await delSupplier(_ids);
|
||||
proxy?.$modal.msgSuccess('删除成功');
|
||||
await getList();
|
||||
};
|
||||
|
||||
/** 导出按钮操作 */
|
||||
const handleExport = () => {
|
||||
proxy?.download(
|
||||
'system/supplier/export',
|
||||
{
|
||||
...queryParams.value
|
||||
},
|
||||
`supplier_${new Date().getTime()}.xlsx`
|
||||
);
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
getList();
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss"></style>
|
||||
<style lang="scss" scoped>
|
||||
.el-table {
|
||||
height: calc(100% - 80px);
|
||||
}
|
||||
</style>
|
||||
|
||||
166
src/views/system/warehouse/Warehouse/addWarehouse.vue
Normal file
166
src/views/system/warehouse/Warehouse/addWarehouse.vue
Normal file
@@ -0,0 +1,166 @@
|
||||
<template>
|
||||
<div class="AddBuildingBox">
|
||||
<PageHeader></PageHeader>
|
||||
<div class="AddBuildingBody">
|
||||
<div class="title">基本信息</div>
|
||||
<div class="addBuildingFormBody">
|
||||
<el-form class="formBody" label-position="right" ref="formRef" :model="form" :rules="rules" label-width="130px">
|
||||
<el-form-item label="仓库名称" prop="warehouseName">
|
||||
<el-input v-model.trim="form.warehouseName" placeholder="请输入仓库名称" />
|
||||
</el-form-item>
|
||||
<el-form-item label="联系人" prop="contactPerson">
|
||||
<el-input v-model.trim="form.contactPerson" placeholder="请输入联系人" />
|
||||
</el-form-item>
|
||||
<el-form-item label="联系电话" prop="contactPhone">
|
||||
<el-input v-model.trim="form.contactPhone" placeholder="请输入联系电话" />
|
||||
</el-form-item>
|
||||
<el-form-item label="地址" prop="address">
|
||||
<el-input v-model.trim="form.address" placeholder="请输入地址" />
|
||||
</el-form-item>
|
||||
<el-form-item label="备注" prop="remark">
|
||||
<el-input type="textarea" :rows="5" v-model.trim="form.remark" placeholder="请输入备注" />
|
||||
</el-form-item>
|
||||
<el-form-item style="margin-top: 30px">
|
||||
<el-button type="primary" @click="submitForm">提交</el-button>
|
||||
<el-button @click="cancelForm">返回</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref } from 'vue';
|
||||
import PageHeader from '@/components/Pageheader/index.vue';
|
||||
import { getCommunitylistAPI } from '@/api/system/community';
|
||||
import { addWarehouse, getWarehouse, updateWarehouse } from '@/api/system/Twarehouse';
|
||||
import { validator } from '@/utils/Reg';
|
||||
|
||||
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
||||
|
||||
const router = useRouter();
|
||||
const route = useRoute();
|
||||
|
||||
const formRef = ref();
|
||||
|
||||
const form = ref({
|
||||
id: null,
|
||||
warehouseName: '', // 供应商名称
|
||||
villageId: Number(localStorage.getItem('villageid')), // 邮箱
|
||||
contactPhone: '', // 联系电话
|
||||
address: '', // 地址
|
||||
remark: '', // 备注
|
||||
contactPerson: '' // 联系人
|
||||
});
|
||||
const rules = ref({
|
||||
warehouseName: [{ required: true, message: '请输入 仓库名称', trigger: 'blur' }],
|
||||
contactPhone: [
|
||||
{ required: true, message: '请输入 联系电话', trigger: 'blur' },
|
||||
{
|
||||
validator: (_, value) => validator(value, 'phone'),
|
||||
message: '请输入正确的电话号码',
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
contactPerson: [{ required: true, message: '请输入 联系人姓名', trigger: 'blur' }],
|
||||
villageId: [{ required: true, message: '请选择 仓库归属', trigger: 'blur' }]
|
||||
});
|
||||
const userid = ref(null);
|
||||
|
||||
// 小区列表
|
||||
const cummunitylist = ref([]);
|
||||
function init() {
|
||||
getCommunitylistAPI().then((res) => {
|
||||
cummunitylist.value = res.rows;
|
||||
});
|
||||
if (route.query.id) {
|
||||
userid.value = route.query.id;
|
||||
getWarehouse(userid.value).then((res) => {
|
||||
form.value = {
|
||||
id: res.data.id,
|
||||
warehouseName: res.data.warehouseName,
|
||||
villageId: res.data.villageId,
|
||||
contactPhone: res.data.contactPhone,
|
||||
address: res.data.address,
|
||||
remark: res.data.remark,
|
||||
contactPerson: res.data.contactPerson
|
||||
};
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
init();
|
||||
|
||||
// !== 提交 =============================================================================
|
||||
// 提交
|
||||
const submitForm = () => {
|
||||
formRef.value?.validate(async (valid: boolean) => {
|
||||
if (valid) {
|
||||
if (userid.value) {
|
||||
updateWarehouse(form.value).then((res) => {
|
||||
ElMessage.success('编辑成功');
|
||||
cancelForm();
|
||||
});
|
||||
} else {
|
||||
addWarehouse(form.value).then((res) => {
|
||||
ElMessage.success('添加成功');
|
||||
cancelForm();
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
};
|
||||
// 推出
|
||||
const cancelForm = () => {
|
||||
router.push({
|
||||
path: '/warehouse/warehouse'
|
||||
});
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.AddBuildingBox {
|
||||
padding: 15px;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
.AddBuildingBody {
|
||||
margin-top: 20px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
background-color: white;
|
||||
padding: 15px;
|
||||
.title {
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
padding-left: 20px;
|
||||
background-color: rgba(255, 255, 255, 1);
|
||||
color: rgba(16, 16, 16, 1);
|
||||
border-bottom: 1px solid #bbbbbb;
|
||||
margin-bottom: 60px;
|
||||
}
|
||||
|
||||
.formBody {
|
||||
width: 500px;
|
||||
margin: 0 auto;
|
||||
&:deep(.el-form-item__content, .el-select, .el-input) {
|
||||
width: 350px !important;
|
||||
margin-right: 10px;
|
||||
.el-cascader {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
.el-form-item {
|
||||
margin-bottom: 20px;
|
||||
align-items: center;
|
||||
}
|
||||
.el-button {
|
||||
width: 80px;
|
||||
height: 35px;
|
||||
margin-right: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,12 +1,262 @@
|
||||
<template>
|
||||
<div class="p-2 h-full flex flex-col">
|
||||
<Pageheader title="账单管理"></Pageheader>
|
||||
<div class="flex-1 color-gray flex h-full font-size-6 flex-center">系统还在维护中，敬请期待...</div>
|
||||
<div class="h-full flex flex-col p-2">
|
||||
<pageheader></pageheader>
|
||||
<transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
|
||||
<div v-show="showSearch" class="mb-[10px]">
|
||||
<el-card shadow="hover">
|
||||
<el-form ref="queryFormRef" label-width="100px" :model="queryParams" :inline="true">
|
||||
<el-form-item label="仓库名称" prop="warehouseName">
|
||||
<el-input v-model="queryParams.warehouseName" placeholder="请输入仓库名称" clearable @keyup.enter="handleQuery" />
|
||||
</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-card>
|
||||
</div>
|
||||
</transition>
|
||||
|
||||
<el-card class="flex-1" shadow="never">
|
||||
<template #header>
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<el-button type="primary" plain icon="Plus" @click="handleAdd" v-hasPermi="['system:warehouse:add']">新增</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete()" v-hasPermi="['system:warehouse:remove']"
|
||||
>删除</el-button
|
||||
>
|
||||
</el-col>
|
||||
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
</template>
|
||||
|
||||
<el-table v-loading="loading" border :data="warehouseList" @selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" align="center" />
|
||||
<el-table-column label="仓库名称" align="center" prop="warehouseName" />
|
||||
<el-table-column label="联系人" width="100" align="center" prop="contactPerson" />
|
||||
<el-table-column label="联系电话" width="120" align="center" prop="contactPhone" />
|
||||
<el-table-column label="地址" align="center" prop="address" />
|
||||
<el-table-column label="状态" width="150" align="center" prop="status">
|
||||
<template #default="scope">
|
||||
<el-switch
|
||||
@change="(val: string) => handleChangeSwitch(val, scope.row)"
|
||||
v-model="scope.row.status"
|
||||
active-value="0"
|
||||
active-text="启用"
|
||||
inactive-value="1"
|
||||
inactive-text="禁用"
|
||||
></el-switch>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="备注" width="80" align="center" prop="remark" show-overflow-tooltip />
|
||||
<el-table-column label="操作" align="center" fixed="right" class-name="small-padding fixed-width">
|
||||
<template #default="scope">
|
||||
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:warehouse:edit']">修改</el-button>
|
||||
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['system:warehouse: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" />
|
||||
</el-card>
|
||||
<!-- 添加或修改仓库对话框 -->
|
||||
<el-dialog :title="dialog.title" v-model="dialog.visible" width="500px" append-to-body>
|
||||
<el-form ref="warehouseFormRef" :model="form" :rules="rules" label-width="80px">
|
||||
<el-form-item label="仓库名称*" prop="warehouseName">
|
||||
<el-input v-model="form.warehouseName" placeholder="请输入仓库名称*" />
|
||||
</el-form-item>
|
||||
<el-form-item label="仓库归属id*" prop="villageId">
|
||||
<el-input v-model="form.villageId" placeholder="请输入仓库归属id*" />
|
||||
</el-form-item>
|
||||
<el-form-item label="联系人*" prop="contactPerson">
|
||||
<el-input v-model="form.contactPerson" placeholder="请输入联系人*" />
|
||||
</el-form-item>
|
||||
<el-form-item label="联系电话*" prop="contactPhone">
|
||||
<el-input v-model="form.contactPhone" placeholder="请输入联系电话*" />
|
||||
</el-form-item>
|
||||
<el-form-item label="地址" prop="address">
|
||||
<el-input v-model="form.address" placeholder="请输入地址" />
|
||||
</el-form-item>
|
||||
<el-form-item label="备注" prop="remark">
|
||||
<el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<div class="dialog-footer">
|
||||
<el-button :loading="buttonLoading" type="primary" @click="submitForm">确 定</el-button>
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref } from 'vue';
|
||||
<script setup name="Warehouse" lang="ts">
|
||||
import { listWarehouse, getWarehouse, delWarehouse, addWarehouse, updateWarehouse } from '@/api/system/Twarehouse/index';
|
||||
import { WarehouseVO, WarehouseQuery, WarehouseForm } from '@/api/system/Twarehouse/type';
|
||||
|
||||
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
||||
|
||||
const warehouseList = ref<WarehouseVO[]>([]);
|
||||
const buttonLoading = ref(false);
|
||||
const loading = ref(true);
|
||||
const showSearch = ref(true);
|
||||
const ids = ref<Array<string | number>>([]);
|
||||
const single = ref(true);
|
||||
const multiple = ref(true);
|
||||
const total = ref(0);
|
||||
|
||||
const queryFormRef = ref<ElFormInstance>();
|
||||
const warehouseFormRef = ref<ElFormInstance>();
|
||||
|
||||
const dialog = reactive<DialogOption>({
|
||||
visible: false,
|
||||
title: ''
|
||||
});
|
||||
|
||||
const initFormData: WarehouseForm = {
|
||||
id: undefined,
|
||||
warehouseName: undefined,
|
||||
villageId: undefined,
|
||||
contactPerson: undefined,
|
||||
contactPhone: undefined,
|
||||
address: undefined,
|
||||
status: undefined,
|
||||
remark: undefined
|
||||
};
|
||||
const data = reactive<PageData<WarehouseForm, WarehouseQuery>>({
|
||||
form: { ...initFormData },
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
warehouseName: undefined,
|
||||
villageId: undefined,
|
||||
contactPerson: undefined,
|
||||
contactPhone: undefined,
|
||||
address: undefined,
|
||||
status: undefined,
|
||||
params: {}
|
||||
},
|
||||
rules: {
|
||||
id: [{ required: true, message: '仓库ID不能为空', trigger: 'blur' }],
|
||||
warehouseName: [{ required: true, message: '仓库名称*不能为空', trigger: 'blur' }],
|
||||
villageId: [{ required: true, message: '仓库归属id*不能为空', trigger: 'blur' }],
|
||||
contactPerson: [{ required: true, message: '联系人*不能为空', trigger: 'blur' }],
|
||||
contactPhone: [{ required: true, message: '联系电话*不能为空', trigger: 'blur' }],
|
||||
status: [{ required: true, message: '状态 0-启用 1-禁用不能为空', trigger: 'change' }]
|
||||
}
|
||||
});
|
||||
|
||||
const { queryParams, form, rules } = toRefs(data);
|
||||
|
||||
/** 查询仓库列表 */
|
||||
const getList = async () => {
|
||||
loading.value = true;
|
||||
const res = await listWarehouse(queryParams.value);
|
||||
warehouseList.value = res.rows;
|
||||
total.value = res.total;
|
||||
loading.value = false;
|
||||
};
|
||||
|
||||
/** 取消按钮 */
|
||||
const cancel = () => {
|
||||
reset();
|
||||
dialog.visible = false;
|
||||
};
|
||||
|
||||
/** 表单重置 */
|
||||
const reset = () => {
|
||||
form.value = { ...initFormData };
|
||||
warehouseFormRef.value?.resetFields();
|
||||
};
|
||||
|
||||
/** 搜索按钮操作 */
|
||||
const handleQuery = () => {
|
||||
queryParams.value.pageNum = 1;
|
||||
getList();
|
||||
};
|
||||
|
||||
/** 重置按钮操作 */
|
||||
const resetQuery = () => {
|
||||
queryFormRef.value?.resetFields();
|
||||
handleQuery();
|
||||
};
|
||||
|
||||
/** 多选框选中数据 */
|
||||
const handleSelectionChange = (selection: WarehouseVO[]) => {
|
||||
ids.value = selection.map((item) => item.id);
|
||||
single.value = selection.length != 1;
|
||||
multiple.value = !selection.length;
|
||||
};
|
||||
|
||||
const router = useRouter();
|
||||
/** 新增按钮操作 */
|
||||
const handleAdd = () => {
|
||||
router.push({
|
||||
path: '/warehouse/addWarehouse'
|
||||
});
|
||||
};
|
||||
|
||||
/** 修改按钮操作 */
|
||||
const handleUpdate = async (row?: WarehouseVO) => {
|
||||
router.push({
|
||||
path: '/warehouse/addWarehouse',
|
||||
query: {
|
||||
id: row.id
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
/** 提交按钮 */
|
||||
const submitForm = () => {
|
||||
warehouseFormRef.value?.validate(async (valid: boolean) => {
|
||||
if (valid) {
|
||||
buttonLoading.value = true;
|
||||
if (form.value.id) {
|
||||
await updateWarehouse(form.value).finally(() => (buttonLoading.value = false));
|
||||
} else {
|
||||
await addWarehouse(form.value).finally(() => (buttonLoading.value = false));
|
||||
}
|
||||
proxy?.$modal.msgSuccess('操作成功');
|
||||
dialog.visible = false;
|
||||
await getList();
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
/** 删除按钮操作 */
|
||||
const handleDelete = async (row?: WarehouseVO) => {
|
||||
const _ids = row?.id || ids.value;
|
||||
await proxy?.$modal.confirm('是否确认删除该仓库？').finally(() => (loading.value = false));
|
||||
await delWarehouse(_ids);
|
||||
proxy?.$modal.msgSuccess('删除成功');
|
||||
await getList();
|
||||
};
|
||||
|
||||
// 切换状态
|
||||
const handleChangeSwitch = (val: string, row) => {
|
||||
updateWarehouse(row)
|
||||
.then(() => {
|
||||
ElMessage.success('修改状态成功');
|
||||
})
|
||||
.catch(() => {
|
||||
const index = warehouseList.value.findIndex((item) => item.id === row.id);
|
||||
if (index !== -1) {
|
||||
warehouseList.value[index].status = val === '0' ? '1' : '0';
|
||||
}
|
||||
ElMessage.error('修改状态失败,请稍后再试');
|
||||
});
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
getList();
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss"></style>
|
||||
<style lang="scss" scoped>
|
||||
.el-table {
|
||||
height: calc(100% - 80px);
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user