factory_web/src/views/pum/order.vue

228 lines
4.8 KiB
Vue

<template>
<el-container>
<el-header>
<div class="left-panel">
<el-button
type="primary"
icon="el-icon-plus"
@click="add"
v-auth="'pu_order.create'"
>新增</el-button
>
</div>
<div class="right-panel">
<el-input
v-model="query.search"
placeholder="订单编号"
clearable
style="margin-right: 5px"
></el-input>
<el-button
type="primary"
icon="el-icon-search"
@click="handleQuery"
></el-button>
</div>
</el-header>
<el-main class="nopadding">
<scTable
ref="table"
:apiObj="apiObj"
row-key="id"
stripe
:params="query"
>
<el-table-column type="index" width="50" />
<el-table-column label="订单编号" prop="number">
</el-table-column>
<el-table-column
label="供应商"
prop="supplier_name"
show-overflow-tooltip
>
</el-table-column>
<el-table-column label="物料信息" prop="materials_">
<template #default="scope">
<div
v-for="item in scope.row.materials_"
v-bind:key="item.id"
>
<span>{{ item.full_name }}</span>
</div>
</template>
</el-table-column>
<el-table-column label="总价(元)" prop="total_price">
</el-table-column>
<el-table-column label="截止到货日期" prop="delivery_date">
</el-table-column>
<el-table-column label="状态" prop="state">
<template #default="scope">
<span
><el-tag
:type="stateOption[scope.row.state].color"
>{{
stateOption[scope.row.state].label
}}</el-tag
></span
>
</template>
</el-table-column>
<el-table-column label="提交时间" prop="submit_time">
</el-table-column>
<el-table-column label="创建人" prop="create_by_name">
</el-table-column>
<el-table-column
label="操作"
fixed="right"
align="center"
width="200"
>
<template #default="scope">
<el-button
link
type="primary"
@click="table_detail(scope.row)"
>
详情
</el-button>
<el-button
link
type="primary"
@click="table_edit(scope.row)"
v-auth="'pu_order.update'"
v-if="scope.row.state == 10"
>
编辑
</el-button>
<el-button
link
type="primary"
@click="table_submit(scope.row)"
v-auth="'pu_order.submit'"
v-if="scope.row.state == 10"
>
提交
</el-button>
<el-button
link
type="danger"
@click="table_del(scope.row)"
v-auth="'pu_order.delete'"
v-if="scope.row.state == 10"
>
删除
</el-button>
</template>
</el-table-column>
</scTable>
</el-main>
</el-container>
<save-dialog
v-if="dialog.save"
ref="saveDialog"
@success="handleSaveSuccess"
@closed="dialog.save = false"
></save-dialog>
<detail-dialog
ref="detailDialogs"
v-if="dialog.detail"
:orderId="orderId"
@closed="dialog.detail = false"
>
</detail-dialog>
</template>
<script>
import saveDialog from "./order_form.vue";
import detailDialog from "./orderitem.vue";
export default {
name: "rparty",
components: {
saveDialog,
detailDialog,
},
data() {
return {
dialog: {
save: false,
},
apiObj: this.$API.pum.order.list,
query: {
page: 1,
page_size: 20,
},
selection: [],
stateOption: {
10: { label: "创建中", color: "" },
20: { label: "已提交", color: "" },
30: { label: "到货中", color: "" },
40: { label: "已完成", color: "success" },
},
orderId: "",
};
},
methods: {
//添加
add() {
this.dialog.save = true;
this.$nextTick(() => {
this.$refs.saveDialog.open("add");
});
},
//编辑
table_edit(row) {
this.dialog.save = true;
this.$nextTick(() => {
this.$refs.saveDialog.open("edit").setData(row);
});
},
//查看
table_detail(row) {
this.orderId = row.id;
this.dialog.detail = true;
this.$nextTick(() => {
this.$refs.detailDialogs.open();
});
},
table_submit(row) {
this.$API.pum.order.submit.req(row.id).then((res) => {
this.$refs.table.refresh();
});
},
//删除
async table_del(row) {
this.$confirm(`确定删除吗?`, "提示", {
type: "warning",
})
.then(() => {
this.$API.pum.order.delete
.req(row.id)
.then((res) => {
this.$message.success("删除成功");
this.$refs.table.refresh();
return res;
})
.catch((err) => {
return err;
});
})
.catch(() => {});
},
//本地更新数据
handleSaveSuccess(data, mode) {
if (mode == "add") {
this.$refs.table.refresh();
} else if (mode == "edit") {
this.$refs.table.refresh();
}
},
handleQuery() {
this.$refs.table.queryData(this.query);
},
resetQuery() {
this.query = {};
},
},
};
</script>