bonus-ui/src/views/foodManage/purchaseManage/goodsInquiry/index.vue

396 lines
16 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">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="90px">
<el-form-item label="报价时间">
<el-date-picker
v-model="dateRange"
type="datetimerange"
align="right"
unlink-panels
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
format="yyyy-MM-dd HH:mm:ss" style="width: 400px"
:default-time="['00:00:00', '23:59:59']"
:picker-options="pickerOptions" >
</el-date-picker>
</el-form-item>
<el-form-item label="询价标题" prop="searchValue">
<el-input v-model="queryParams.searchValue" placeholder="请输入询价标题" maxlength="20" clearable style="width: 240px"/>
</el-form-item>
<!-- <el-form-item label="所属区域" prop="areaId">
<el-cascader v-model="queryParams.areaId"
:options="treeAreaOptions" :filterable="true" style="width: 100%;" :show-all-levels="false"
:props="{
emitPath: false,// 若设置 false则只返回该节点的值只返回最后选择的id
checkStrictly: false,//来设置父子节点取消选中关联,从而达到选择任意一级选项的目的
value:'id',label:'label'
}" clearable @change="handleAreaChange">
</el-cascader>
</el-form-item> -->
<!-- <el-form-item label="询价状态" prop="inquiryState">
<el-select v-model="queryParams.inquiryState" placeholder="请选择询价状态" style="width: 240px;">
<el-option label="未开始" :value="1"></el-option>
<el-option label="进行中" :value="2"></el-option>
<el-option label="已结束" :value="3"></el-option>
<el-option label="已取消" :value="4"></el-option>
</el-select>
</el-form-item>
<el-form-item label="中选状态" prop="status">
<el-select v-model="queryParams.status" placeholder="请选择提交状态" style="width: 240px;">
<el-option label="已中选" :value="1"></el-option>
<el-option label="未中选" :value="2"></el-option>
</el-select>
</el-form-item>
<el-form-item label="提交状态" prop="orderStatus">
<el-select v-model="queryParams.orderStatus" placeholder="请选择提交状态" style="width: 240px;">
<el-option label="待提交" :value="1"></el-option>
<el-option label="已提交" :value="2"></el-option>
</el-select>
</el-form-item> -->
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button
type="primary"
plain
icon="el-icon-plus"
size="mini"
@click="handleAdd"
>新增</el-button>
</el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="tableListData" height="800">
<el-table-column label="序号" align="center" width="80" type="index">
<template slot-scope="scope">
<span>{{(queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1}}</span>
</template>
</el-table-column>
<el-table-column label="询价单号" align="center" prop="inquiryCode" :show-overflow-tooltip="true" width="180"/>
<el-table-column label="询价标题" align="center" prop="title" :show-overflow-tooltip="true" />
<el-table-column label="报价开始时间" align="center" prop="startTime" :show-overflow-tooltip="true" />
<el-table-column label="报价结束时间" align="center" prop="endTime" :show-overflow-tooltip="true" />
<el-table-column label="询价状态" align="center" prop="status" :show-overflow-tooltip="true" width="100">
<template slot-scope="scope">
<span v-if="scope.row.status==1">待提交</span>
<span v-if="scope.row.status==2">已决价</span>
<span v-if="scope.row.status==3">进行中</span>
<span v-if="scope.row.status==4">未决标</span>
<span v-if="scope.row.status==5">已取消</span>
</template>
</el-table-column>
<!-- <el-table-column label="提交状态" align="center" prop="status" :show-overflow-tooltip="true" width="100">
<template slot-scope="scope">
<span v-if="scope.row.status==1">待提交</span>
<span v-if="scope.row.status!=1">已提交</span>
</template>
</el-table-column> -->
<el-table-column label="所属区域" align="center" prop="area" :show-overflow-tooltip="true"/>
<el-table-column label="邀请供应商(家)" align="center" prop="inquirySupplierNum" :show-overflow-tooltip="true" />
<el-table-column label="已报价供应商(家)" align="center" prop="supplierNum" :show-overflow-tooltip="true" />
<el-table-column label="中选状态" align="center" prop="status" :show-overflow-tooltip="true" width="100">
<template slot-scope="scope">
<span v-if="scope.row.status==2">已中选</span>
<span v-if="scope.row.status!=2">未中选</span>
</template>
</el-table-column>
<el-table-column label="中选供应商" align="center" prop="" :show-overflow-tooltip="true" />
<el-table-column label="中选金额(元)" align="center" prop="" :show-overflow-tooltip="true" width="120">
<!-- <template slot-scope="scope">
<span>{{ (scope.row.totalAmount/100).toFixed(2) }}</span>
</template> -->
</el-table-column>
<el-table-column label="操作" align="center" width="180" class-name="small-padding fixed-width">
<template slot-scope="scope">
<el-button
size="mini"
type="text"
icon="el-icon-edit" v-if="scope.row.status==1"
@click="handleUpdate(scope.row)"
>编辑</el-button>
<el-button
size="mini"
type="text"
icon="el-icon-edit" v-if="scope.row.status!=1"
@click="handelBidPrice(scope.row)"
>查看报价</el-button>
<el-button
size="mini"
type="text"
icon="el-icon-edit" v-if="scope.row.status!=1"
@click="handleView(scope.row)"
>详情</el-button>
<el-button
size="mini"
type="text"
icon="el-icon-delete" v-if="scope.row.status==1"
@click="handleDelete(scope.row)"
>删除</el-button>
</template>
</el-table-column>
</el-table>
<pagination
v-show="total>0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
<!-- 添加或修改参数配置对话框 -->
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel"> </el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import { systemAreaTreeApi } from "@/api/base/stall";
import { drpWareHousePageApi } from "@/api/foodManage/stockManage";
import { goodsInquiryPageApi,delGoodsInquiryApi } from "@/api/foodManage/purchaseManage";
export default {
name: "",
dicts: [],
data() {
return {
// 遮罩层
loading: true,
loadingBtn: false,
// 选中数组
ids: [],
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
// 显示搜索条件
showSearch: true,
// 总条数
total: 0,
//表格数据
tableListData: [],
// 弹出层标题
title: "",
// 是否显示弹出层
open: false,
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
},
treeAreaOptions:[],//区域树
wareHouseOptions:[],//仓库下拉选
dateRange:[],
pickerOptions: {
shortcuts: [{
text: '最近一周',
onClick(picker) {
const start = new Date();
const end = new Date();
start.setTime(start.getTime() - 3600 * 1000 * 24 * 6);
picker.$emit('pick', [start, end]);
}
},{
text: '最近一个月',
onClick(picker) {
const start = new Date();
const end = new Date();
start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
picker.$emit('pick', [start, end]);
}
},{
text: '最近三个月',
onClick(picker) {
const start = new Date();
const end = new Date();
start.setTime(start.getTime() - 3600 * 1000 * 24 * 91);
picker.$emit('pick', [start, end]);
}
}]
},
// 表单参数
form: {},
// 表单校验
rules: {
// canteenName: [
// { required: true, message: "字典名称不能为空", trigger: "blur" }
// ],
// dictType: [
// { required: true, message: "字典类型不能为空", trigger: "blur" }
// ]
}
};
},
created() {
this.getAreaTreeData();
// this.getWareHouseData()
this.getList();
},
methods: {
//区域树
getAreaTreeData() {
systemAreaTreeApi({}).then((response) => {
this.treeAreaOptions = response.data;
});
},
handleAreaChange(e){
// this.getWareHouseData()
},
/** 查询货品下拉结构 */
getWareHouseData() {
drpWareHousePageApi({ areaId:this.queryParams.areaId }).then((response) => {
this.wareHouseOptions = response.rows||[];
this.$set(this.queryParams,'warehouseId',null)
});
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1;
this.getList();
},
/** 重置按钮操作 */
resetQuery() {
this.dateRange = []
this.queryParams = {
pageNum: 1,
pageSize: 10,
}
this.resetForm("queryForm");
this.handleQuery();
},
/** 查询列表 */
getList() {
this.loading = true;
let param = {
"pageNum": this.queryParams.pageNum,
"pageSize": this.queryParams.pageSize,
"searchValue": this.queryParams.searchValue,
// "areaId": this.queryParams.areaId,
// "inquiryState": this.queryParams.inquiryState,
// "status": this.queryParams.status,
// "orderStatus": this.queryParams.orderStatus
}
if(this.dateRange&&this.dateRange.length>0){
param.startTime=this.formatDateTime(this.dateRange[0])
param.endTime=this.formatDateTime(this.dateRange[1])
}else{
param.startTime=undefined;
param.endTime=undefined;
}
console.log("param",param)
goodsInquiryPageApi(param).then(response => {
console.log("this.tableListData",response)
this.tableListData = response.rows;
this.total = Number(response.total);
this.loading = false;
});
},
/** 新增按钮操作 */
handleAdd() {
this.$router.push({ path: "/foodManage/purchaseManage/goodsInquiryEdit" });
},
/** 修改按钮操作 */
handleView(row) {
this.$router.push({ path: "/foodManage/purchaseManage/goodsInquiryDetail",query: {goodsInquiryData:JSON.stringify(row)} });
},
/** 修改按钮操作 */
handleUpdate(row) {
this.$router.push({ path: "/foodManage/purchaseManage/goodsInquiryEdit",query: {goodsInquiryData:JSON.stringify(row)} });
},
//查看报价接口
handelBidPrice(row) {
this.$router.push({ path: "/foodManage/purchaseManage/goodsInquiryCheckPrice",query: {goodsInquiryData:JSON.stringify(row)} });
},
// 取消按钮
cancel() {
this.open = false;
this.reset();
},
// 表单重置
reset() {
this.form = {};
this.resetForm("form");
},
/** 提交按钮 */
submitForm: function() {
this.$refs["form"].validate(valid => {
if (valid) {
if (this.form.dictId != undefined) {
// updateType(this.form).then(response => {
// this.$modal.msgSuccess("修改成功");
// this.open = false;
// this.getList();
// });
} else {
// addType(this.form).then(response => {
// this.$modal.msgSuccess("新增成功");
// this.open = false;
// this.getList();
// });
}
}
});
},
/** 删除按钮操作 */
handleDelete(row) {
this.$modal.confirm('是否确认删除数据项?').then(function() {
return delGoodsInquiryApi({inquiryId:row.inquiryId});
}).then(() => {
this.getList();
this.$modal.msgSuccess("删除成功");
}).catch(() => {});
},
defaultDateRange() {
const end = new Date(new Date().toLocaleDateString());
end.setTime(end.getTime() + 24 * 60 * 60 * 1000 -1);
const start = new Date((new Date().toLocaleDateString()));
start.setTime(start.getTime() - 30 * 24 * 60 * 60 * 1000);
this.start = parseInt(start.getTime() / 1000)
this.end = parseInt(end.getTime() / 1000)
return [start, end]
},
//日期
formatDate(date) {
// 格式化为 YYYY-MM-DD
date = new Date(date)
const year = date.getFullYear();
const month = String(date.getMonth() + 1).padStart(2, '0'); // 月份从0开始
const day = String(date.getDate()).padStart(2, '0');
return `${year}-${month}-${day}`;
},
//日期时间
formatDateTime(date) {
// 格式化为 YYYY-MM-DD
date = new Date(date)
const year = date.getFullYear();
const month = String(date.getMonth() + 1).padStart(2, '0'); // 月份从0开始
const day = String(date.getDate()).padStart(2, '0');
const hours = date.getHours() < 10 ? '0' + date.getHours() : date.getHours()
const minutes = date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes()
const seconds = date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds()
return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
}
}
};
</script>