You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
299 lines
8.0 KiB
299 lines
8.0 KiB
<template>
|
|
<div class="app-container">
|
|
<div v-show="viewState == 1">
|
|
<button-bar
|
|
view-title="成品油类型"
|
|
ref="btnbar"
|
|
:btndisabled="btndisabled"
|
|
@btnhandle="btnHandle"
|
|
/>
|
|
<div class="main-content">
|
|
<div class="searchcon">
|
|
<el-button size="small" class="searchbtn" @click="clicksearchShow">{{
|
|
searchxianshitit
|
|
}}</el-button>
|
|
<div v-show="isSearchShow" class="search">
|
|
<el-form
|
|
ref="listQueryform"
|
|
:inline="true"
|
|
:model="listQuery"
|
|
label-width="80px"
|
|
class="tab-header"
|
|
>
|
|
<el-form-item label="成品油名称">
|
|
<el-input
|
|
v-model="listQuery.params.name"
|
|
maxlength="20"
|
|
placeholder="请输入成品油名称"
|
|
class="addinputw"
|
|
clearable
|
|
/>
|
|
</el-form-item>
|
|
</el-form>
|
|
<div class="btn" style="text-align: center">
|
|
<el-button
|
|
type="primary"
|
|
icon="el-icon-search"
|
|
size="small"
|
|
@click="handleReset"
|
|
>查询</el-button
|
|
>
|
|
<el-button
|
|
type="primary"
|
|
icon="el-icon-refresh"
|
|
size="small"
|
|
@click="handleFilter"
|
|
>重置</el-button
|
|
>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="listtop">
|
|
<div class="tit">成品油列表</div>
|
|
</div>
|
|
<div class="">
|
|
<el-table
|
|
v-loading="listLoading"
|
|
:data="list"
|
|
border
|
|
style="width: 100%"
|
|
>
|
|
<!-- <el-table-column type="selection" align="center" width="50"/> -->
|
|
<el-table-column
|
|
label="序号"
|
|
type="index"
|
|
width="80"
|
|
:index="indexMethod"
|
|
align="center"
|
|
/>
|
|
<el-table-column label="操作" align="center" width="150px">
|
|
<template slot-scope="scope">
|
|
<el-button
|
|
type="primary"
|
|
size="mini"
|
|
@click="purchase(scope.row)"
|
|
>
|
|
编辑
|
|
</el-button>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="品牌名称" prop="name" align="center" />
|
|
<el-table-column label="品牌编号" prop="informationNumber" align="center" />
|
|
<el-table-column label="数量" prop="amount" align="center" />
|
|
<el-table-column label="单价" prop="price" align="center" />
|
|
<el-table-column label="成品油编号" prop="number" align="center" />
|
|
</el-table>
|
|
</div>
|
|
<div class="pages">
|
|
<pagination
|
|
v-show="list.length > 0"
|
|
:total="listQuery.total"
|
|
:page.sync="listQuery.current"
|
|
:limit.sync="listQuery.size"
|
|
class="pagination"
|
|
@pagination="getList"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<oilTankAdd
|
|
v-show="viewState == 2 || viewState == 3"
|
|
ref="divAdd"
|
|
@doback="resetState"
|
|
@reloadlist="getList"
|
|
/>
|
|
<!-- <oilTypeInfo v-show="viewState ==4" ref="divInfo" @doback="resetState" @reloadlist="getList" /> -->
|
|
<el-dialog title="修改产品类型" :visible.sync="editDialog" width="40%">
|
|
<table class="e-table" cellspacing="0">
|
|
<tr>
|
|
<td>类型名称</td>
|
|
<td>
|
|
<el-input v-model="form.name" style="width: 300px"></el-input>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td>类型编号</td>
|
|
<td>
|
|
<el-input v-model="form.number" style="width: 300px"></el-input>
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
<div style="margin-top: 20px; text-align: center">
|
|
<el-button type="primary" @click="save()">保存</el-button>
|
|
</div>
|
|
</el-dialog>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import req from "@/api/baseInfo/becomeoil/index.js";
|
|
import Pagination from "@/components/pagination";
|
|
import pageye from "@/components/pagination/pageye";
|
|
import ButtonBar from "@/components/ButtonBar";
|
|
import oilTankAdd from "./commodity.vue";
|
|
// import oilTypeInfo from './oilTypeInfo.vue'
|
|
export default {
|
|
name: "CustomerManagement",
|
|
components: {
|
|
Pagination,
|
|
pageye,
|
|
ButtonBar,
|
|
oilTankAdd,
|
|
// oilTypeInfo,
|
|
},
|
|
data() {
|
|
return {
|
|
listLoading: false,
|
|
btndisabled: false,
|
|
editDialog: false,
|
|
form: {
|
|
name: "",
|
|
number: "",
|
|
sid: "",
|
|
},
|
|
btnList: [
|
|
{
|
|
type: "primary",
|
|
size: "small",
|
|
icon: "plus",
|
|
btnKey: "toAdd",
|
|
btnLabel: "新增",
|
|
},
|
|
|
|
{
|
|
type: "info",
|
|
size: "small",
|
|
icon: "cross",
|
|
btnKey: "doClose",
|
|
btnLabel: "关闭",
|
|
},
|
|
],
|
|
isSearchShow: false,
|
|
searchxianshitit: "显示查询条件",
|
|
list: [],
|
|
listQuery: {
|
|
current: 1,
|
|
size: 10,
|
|
params: {
|
|
name: "",
|
|
},
|
|
total: 0,
|
|
},
|
|
viewState: 1,
|
|
};
|
|
},
|
|
mounted() {
|
|
this.$refs["btnbar"].setButtonList(this.btnList);
|
|
},
|
|
created() {
|
|
this.init();
|
|
// 加载列表
|
|
},
|
|
methods: {
|
|
btnHandle(btnKey) {
|
|
switch (btnKey) {
|
|
case "toAdd":
|
|
this.toAdd();
|
|
break;
|
|
|
|
case "doClose":
|
|
this.doClose();
|
|
break;
|
|
default:
|
|
break;
|
|
}
|
|
},
|
|
// 搜索条件效果
|
|
clicksearchShow() {
|
|
this.isSearchShow = !this.isSearchShow;
|
|
if (this.isSearchShow) {
|
|
this.searchxianshitit = "隐藏查询条件";
|
|
} else {
|
|
this.searchxianshitit = "显示查询条件";
|
|
}
|
|
},
|
|
// 初始化
|
|
init() {
|
|
this.getList();
|
|
},
|
|
// 序号
|
|
indexMethod(index) {
|
|
var pagestart = (this.listQuery.current - 1) * this.listQuery.size;
|
|
var pageindex = index + 1 + pagestart;
|
|
return pageindex;
|
|
},
|
|
// 查询列表信息
|
|
getList() {
|
|
this.listLoading = true;
|
|
req.listPage(this.listQuery).then((response) => {
|
|
this.listLoading = false;
|
|
if (response.success) {
|
|
this.list = response.data.records;
|
|
this.listQuery.total = response.data.total;
|
|
} else {
|
|
this.list = [];
|
|
this.listQuery.total = 0;
|
|
}
|
|
});
|
|
},
|
|
// 查询按钮
|
|
handleReset() {
|
|
this.listQuery.current = 1;
|
|
this.getList();
|
|
},
|
|
// 重置
|
|
handleFilter() {
|
|
this.listQuery = {
|
|
current: 1,
|
|
size: 10,
|
|
total: 0,
|
|
params: {
|
|
name: "",
|
|
},
|
|
};
|
|
this.getList();
|
|
},
|
|
// 打开添加
|
|
toAdd() {
|
|
this.viewState = 2;
|
|
},
|
|
purchase(row) {
|
|
this.editDialog = true;
|
|
this.form = Object.assign({}, row);
|
|
this.form.sid = row.sid;
|
|
},
|
|
save() {
|
|
req
|
|
.update(this.form)
|
|
.then((resp) => {
|
|
if (resp.success) {
|
|
this.$message({
|
|
showClose: true,
|
|
type: "success",
|
|
message: resp.msg,
|
|
});
|
|
this.editDialog = false;
|
|
this.getList();
|
|
} else {
|
|
// 根据resp.code进行异常情况处理
|
|
}
|
|
})
|
|
.catch(() => {});
|
|
this.reset();
|
|
},
|
|
reset() {
|
|
this.form = {};
|
|
},
|
|
resetState() {
|
|
this.viewState = 1;
|
|
},
|
|
doClose() {
|
|
this.$store.dispatch("tagsView/delView", this.$route);
|
|
this.$router.go(-1);
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
<style scoped>
|
|
</style>
|
|
|