devicesmgt/sgzb-ui/src/views/store/newBuy/newDevices/newDevicesArrival.vue

460 lines
14 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<div class="app-container">
<h4>新购任务信息</h4>
<el-form :model="dataForm" ref="dataForm" :rules="rules" size="small" :inline="true">
<el-row>
<el-form-item label="采购日期" prop="purchaseTime">
<el-date-picker
v-model="dataForm.purchaseTime"
style="width: 240px"
value-format="yyyy-MM-dd"
type="date"
range-separator="-"
start-placeholder="开始日期"
end-placeholder="结束日期"
></el-date-picker>
</el-form-item>
<el-form-item label="到货日期" prop="arrivalTime">
<el-date-picker
v-model="dataForm.arrivalTime"
style="width: 240px"
value-format="yyyy-MM-dd"
type="date"
range-separator="-"
start-placeholder="开始日期"
end-placeholder="结束日期"
></el-date-picker>
</el-form-item>
<el-form-item label="采购员" prop="purchaser">
<el-select v-model="dataForm.purchaser" placeholder="请选择采购员" style="width: 100%;">
<el-option
v-for="item in userList"
:key="item.userId"
:label="item.nickName"
:value="item.userId"
v-if="item.status !='1'"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="备注" prop="remark">
<el-input
v-model="dataForm.remark"
placeholder="请输入备注"
clearable
type="textarea"
style="width: 240px"
/>
</el-form-item>
</el-row>
</el-form>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button
type="primary"
plain
icon="el-icon-plus"
size="mini"
@click="handleAdd"
v-hasPermi="['system:role:add']"
>保存</el-button>
</el-col>
<el-col :span="3">
<el-button
type="success"
plain
icon="el-icon-edit"
size="mini"
@click="jumpList"
>采购验收管理</el-button>
</el-col>
<!-- <p>快速操作</p> -->
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" >
<el-form-item label="机具类型" prop="equipmentId">
<treeselect v-model="queryParams.equipmentId" default-expand-all :options="equipmentTypeList" placeholder="请选择机具类型" @select="select" style="width: 250px;"/>
</el-form-item>
<el-form-item label="出厂日期">
<el-date-picker
v-model="queryParams.productionTime"
style="width: 240px"
value-format="yyyy-MM-dd"
type="date"
range-separator="-"
start-placeholder="开始日期"
end-placeholder="结束日期"
></el-date-picker>
</el-form-item>
<el-form-item label="机具厂家" prop="supplierId">
<el-select
v-model="queryParams.supplierId"
placeholder="机具厂家"
clearable
style="width: 240px"
>
<el-option
v-for="item in supplierList"
:key="item.supplierId"
:label="item.supplier"
:value="item.supplierId"
/>
</el-select>
</el-form-item>
</el-form>
<!-- <el-col :span="1.5">
<el-button
type="danger"
plain
icon="el-icon-delete"
size="mini"
:disabled="multiple"
@click="handleDelete"
v-hasPermi="['system:role:remove']"
>删除</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="warning"
plain
icon="el-icon-download"
size="mini"
@click="handleExport"
v-hasPermi="['system:role:export']"
>导出</el-button>
</el-col> -->
</el-row>
<el-table v-loading="loading" :data="equipmentList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="序号" type="index" width="55"/>
<el-table-column label="机具类型名称" prop="machineTypeName" :show-overflow-tooltip="true" width="200"/>
<el-table-column label="规格型号" prop="specificationType" :show-overflow-tooltip="true" width="200"/>
<el-table-column label="单位" prop="unitName" width="100" />
<el-table-column label="购置单价(元)" prop="purchasePrice" align="center" width="150">
<template slot-scope="scope">
<el-input v-model="scope.row.purchasePrice" type="number" maxlength="10"></el-input>
</template>
</el-table-column>
<el-table-column label="采购数量" prop="purchaseNum" width="150" type="number" maxlength="10">
<template slot-scope="scope">
<el-input v-model="scope.row.purchaseNum"></el-input>
</template>
</el-table-column>
<el-table-column label="机具厂家" prop="supplierId" width="200" >
<template slot-scope="scope">
<el-select v-model="scope.row.supplierId" placeholder="机具厂家" clearable style="width: 180px">
<el-option v-for="item in supplierList" :key="item.supplierId" :label="item.supplier" :value="item.supplierId" />
</el-select>
<!-- <el-input v-model="scope.row.supplierId"></el-input> -->
</template>
</el-table-column>
<el-table-column label="出厂日期" align="center" prop="productionTime" width="200">
<template slot-scope="scope">
<el-date-picker
v-model="scope.row.productionTime"
style="width: 180px"
value-format="yyyy-MM-dd"
type="date"
range-separator="-"
placeholder="出厂日期"
></el-date-picker>
</template>
</el-table-column>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template slot-scope="scope" v-if="scope.row.roleId !== 1">
<!-- <el-button
size="mini"
type="text"
icon="el-icon-edit"
@click="handleUpdate(scope.row)"
v-hasPermi="['system:role:edit']"
>修改</el-button> -->
<el-button
size="mini"
type="text"
icon="el-icon-delete"
@click="handleDelete(scope.row)"
v-hasPermi="['system:role:remove']"
>删除</el-button>
</template>
</el-table-column>
</el-table>
</div>
</template>
<script>
import { addPurchaseCheckInfo } from "@/api/store/newBuy";
import { getUserByRoleList } from "@/api/system/user";
import { equipmentTypeTree ,supplierInfoList} from "@/api/store/tools";
import Treeselect from "@riophae/vue-treeselect";
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
import { } from "@/api/store/newBuy";
export default {
name: "Role",
dicts: ['sys_normal_disable'],
components: { Treeselect },
data() {
return {
// 遮罩层
loading: false,
// 选中数组
ids: [],
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
// 显示搜索条件
showSearch: true,
// 总条数
total: 0,
//机具厂家(供应商管理)
supplierList: [],
//机具类型
equipmentTypeList: [],
// 用户数据
userList: [],
// 角色表格数据
equipmentList: [],
// 弹出层标题
title: "",
// 是否显示弹出层
open: false,
// 是否显示弹出层(数据权限)
openDataScope: false,
menuExpand: false,
menuNodeAll: false,
deptExpand: true,
deptNodeAll: false,
// 日期范围
dateRange: [],
// 数据范围选项
dataScopeOptions: [
{
value: "1",
label: "全部数据权限"
},
{
value: "2",
label: "自定数据权限"
},
{
value: "3",
label: "本部门数据权限"
},
{
value: "4",
label: "本部门及以下数据权限"
},
{
value: "5",
label: "仅本人数据权限"
}
],
// 菜单列表
menuOptions: [],
// 部门列表
deptOptions: [],
// 查询参数
queryParams: {
equipmentId:undefined,
productionTime:'',
supplierId:'',
},
dataForm:{
purchaseTime:'',
arrivalTime:'',
purchaser:'',
remark:'',
},
// 表单参数
form: {},
defaultProps: {
children: "children",
label: "label"
},
// 表单校验
rules: {
purchaseTime: [
{ required: true, message: "采购日期不能为空", trigger: "blur" }
],
arrivalTime: [
{ required: true, message: "到货日期不能为空", trigger: "blur" }
],
purchaser: [
{ required: true, message: "采购员不能为空", trigger: "blur" }
]
}
};
},
created() {
this.getUserList()
// this.getList();
this.equipmentType();
this.supplierInfoList();
},
methods: {
/** 查询用户列表--采购员 */
getUserList() {
getUserByRoleList().then(response => {
this.userList = response.data;
}
);
},
/** 机具厂家 */
supplierInfoList() {
supplierInfoList().then(response => {
this.supplierList = response.rows;
}
);
},
/** 机具类型 */
equipmentType() {
equipmentTypeTree().then(response => {
this.equipmentTypeList = response.data;
this.equipmentTypeList.forEach((item,index)=>{
if(item.children.length>0){
item.children.forEach((item2,index2)=>{
if(item2.children.length>0){
item2.children.forEach(item3=>{
if(item3.children.length>0){
item3.children.forEach(item4=>{
item4.machineTypeName = item3.typeName
item4.specificationType = item4.typeName
})
}
})
}
})
}
})
});
},
select(row){
if(row.level==4){
for(let i = 0; i < this.equipmentList.length; i++) {
if (this.equipmentList[i].typeId == row.typeId) {
this.equipmentList.splice(i,1)
break;
}
}
this.equipmentList.unshift(row)
}
},
/** 查询右侧列表 */
getList() {
// this.loading = true;
// listRole().then(response => {
// this.equipmentList = response.rows;
// this.total = response.total;
// this.loading = false;
// }
// );
},
// 取消按钮
cancel() {
this.open = false;
this.reset();
},
// 取消按钮(数据权限)
cancelDataScope() {
this.openDataScope = false;
this.reset();
},
// 表单重置
reset() {
if (this.$refs.menu != undefined) {
this.$refs.menu.setCheckedKeys([]);
}
this.menuExpand = false,
this.menuNodeAll = false,
this.deptExpand = true,
this.deptNodeAll = false,
this.form = {
roleId: undefined,
roleName: undefined,
roleKey: undefined,
roleSort: 0,
status: "0",
menuIds: [],
deptIds: [],
menuCheckStrictly: true,
deptCheckStrictly: true,
remark: undefined
};
this.resetForm("form");
},
// 多选框选中数据
handleSelectionChange(selection) {
this.ids = selection.map(item => item.roleId)
this.single = selection.length!=1
this.multiple = !selection.length
},
/** 新增按钮操作 */
handleAdd() {
// this.$modal.confirm('是否确认').then(function() {
this.$refs["dataForm"].validate(valid => {
if (valid) {
console.log(this.dataForm,'dataForm')
console.log(this.equipmentList,'equipmentList')
this.dataForm.checkDetailsList = this.equipmentList;
this.loading = true;
addPurchaseCheckInfo(this.dataForm).then(response => {
if(response.code == 200){
this.$modal.msgSuccess("新增成功");
this.$tab.closeOpenPage({ path: "/store/newBuy/newDevicesList" });
}
this.loading = false;
})
}
})
// })
// this.reset();
// this.open = true;
// this.title = "添加角色";
},
jumpList(){
const obj = { path: "/store/newBuy/newDevicesList" }
this.$tab.closeOpenPage(obj);
},
/** 修改按钮操作 */
handleUpdate(row) {
// this.reset();
// this.form = response.data;
// this.open = true;
},
/** 删除按钮操作 */
handleDelete(row) {
// const roleIds = row.roleId || this.ids;
// this.$modal.confirm('是否确认删除角色编号为"' + roleIds + '"的数据项?').then(function() {
// return delRole(roleIds);
// }).then(() => {
// this.getList();
// this.$modal.msgSuccess("删除成功");
// }).catch(() => {});
},
/** 导出按钮操作 */
handleExport() {
// this.download('system/role/export', {
// ...this.queryParams
// }, `role_${new Date().getTime()}.xlsx`)
}
}
};
</script>