|
|
@@ -0,0 +1,267 @@
|
|
|
+<template>
|
|
|
+ <div class="supply-system">
|
|
|
+ <!-- System List -->
|
|
|
+ <el-card>
|
|
|
+ <div slot="header">
|
|
|
+ <span>供应商体系管理</span>
|
|
|
+ <el-button style="float: right" type="primary" size="small" @click="handleCreateSystem">+ 添加体系</el-button>
|
|
|
+ </div>
|
|
|
+ <el-table :data="systems" stripe>
|
|
|
+ <el-table-column prop="id" label="ID" width="80"></el-table-column>
|
|
|
+ <el-table-column prop="name" label="名称" width="150"></el-table-column>
|
|
|
+ <el-table-column prop="description" label="描述"></el-table-column>
|
|
|
+ <el-table-column prop="settlementPeriodDays" label="结算周期(天)" width="120"></el-table-column>
|
|
|
+ <el-table-column prop="platformProfitRate" label="平台利润率" width="120">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ {{ scope.row.platformProfitRate ? (scope.row.platformProfitRate * 100).toFixed(1) + '%' : '-' }}
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="status" label="状态" width="100">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-tag :type="scope.row.status === 'ACTIVE' ? 'success' : 'danger'">
|
|
|
+ {{ scope.row.status === 'ACTIVE' ? '启用' : '停用' }}
|
|
|
+ </el-tag>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="操作" width="220">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-button size="mini" type="primary" @click="handleManageSupplier(scope.row)">供应商</el-button>
|
|
|
+ <el-button size="mini" @click="handleEditSystem(scope.row)">编辑</el-button>
|
|
|
+ <el-button size="mini" :type="scope.row.status === 'ACTIVE' ? 'warning' : 'success'" @click="toggleSystemStatus(scope.row)">
|
|
|
+ {{ scope.row.status === 'ACTIVE' ? '停用' : '启用' }}
|
|
|
+ </el-button>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </el-card>
|
|
|
+
|
|
|
+ <!-- System Dialog -->
|
|
|
+ <el-dialog :visible.sync="systemDialogVisible" :title="isEditSystem ? '编辑供应商体系' : '添加供应商体系'" width="500px">
|
|
|
+ <el-form :model="systemForm" label-width="120px">
|
|
|
+ <el-form-item label="名称">
|
|
|
+ <el-input v-model="systemForm.name" placeholder="如: 优选供应商体系"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="结算周期(天)">
|
|
|
+ <el-input-number v-model="systemForm.settlementPeriodDays" :min="1" :max="90"></el-input-number>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="平台利润率">
|
|
|
+ <el-input-number v-model="systemForm.platformProfitRate" :min="0" :max="1" :step="0.01"></el-input-number>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="描述">
|
|
|
+ <el-input v-model="systemForm.description" type="textarea"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ <div slot="footer">
|
|
|
+ <el-button @click="systemDialogVisible = false">取消</el-button>
|
|
|
+ <el-button type="primary" @click="handleSystemSubmit">保存</el-button>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+
|
|
|
+ <!-- Supplier Management Dialog -->
|
|
|
+ <el-dialog :visible.sync="supplierDialogVisible" title="供应商管理" width="700px" @close="handleSupplierDialogClose">
|
|
|
+ <div>
|
|
|
+ <div style="margin-bottom: 15px;">
|
|
|
+ <strong>供应商体系:</strong>{{ currentSystem?.name }}
|
|
|
+ <el-button style="float: right" type="primary" size="small" @click="handleCreateSupplier">+ 添加供应商</el-button>
|
|
|
+ </div>
|
|
|
+ <el-table :data="suppliers" stripe>
|
|
|
+ <el-table-column prop="id" label="ID" width="60"></el-table-column>
|
|
|
+ <el-table-column prop="name" label="供应商名称" width="140"></el-table-column>
|
|
|
+ <el-table-column prop="contactName" label="联系人" width="100"></el-table-column>
|
|
|
+ <el-table-column prop="contactPhone" label="联系电话" width="130"></el-table-column>
|
|
|
+ <el-table-column prop="commissionRate" label="佣金比例" width="100">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ {{ scope.row.commissionRate ? (scope.row.commissionRate * 100).toFixed(1) + '%' : '-' }}
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="status" label="状态" width="80">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-tag :type="scope.row.status === 'ACTIVE' ? 'success' : 'danger'" size="mini">
|
|
|
+ {{ scope.row.status === 'ACTIVE' ? '启用' : '停用' }}
|
|
|
+ </el-tag>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="操作" width="120">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-button size="mini" @click="handleEditSupplier(scope.row)">编辑</el-button>
|
|
|
+ <el-button size="mini" type="danger" @click="handleDeleteSupplier(scope.row)">删除</el-button>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+
|
|
|
+ <!-- Supplier Form Dialog -->
|
|
|
+ <el-dialog :visible.sync="supplierFormVisible" :title="isEditSupplier ? '编辑供应商' : '添加供应商'" width="450px">
|
|
|
+ <el-form :model="supplierForm" label-width="100px">
|
|
|
+ <el-form-item label="供应商名称">
|
|
|
+ <el-input v-model="supplierForm.name" placeholder="如: XX供货商"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="联系人">
|
|
|
+ <el-input v-model="supplierForm.contactName"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="联系电话">
|
|
|
+ <el-input v-model="supplierForm.contactPhone"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="佣金比例">
|
|
|
+ <el-input-number v-model="supplierForm.commissionRate" :min="0" :max="1" :step="0.01"></el-input-number>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ <div slot="footer">
|
|
|
+ <el-button @click="supplierFormVisible = false">取消</el-button>
|
|
|
+ <el-button type="primary" @click="handleSupplierSubmit">保存</el-button>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import { getSupplySystemList, createSupplySystem, updateSupplySystem, toggleSupplySystemStatus,
|
|
|
+ getSupplierList, createSupplier, updateSupplier, deleteSupplier } from '@/api/admin'
|
|
|
+
|
|
|
+export default {
|
|
|
+ name: 'SupplySystem',
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ systems: [],
|
|
|
+ systemDialogVisible: false,
|
|
|
+ isEditSystem: false,
|
|
|
+ systemForm: {
|
|
|
+ id: null,
|
|
|
+ name: '',
|
|
|
+ description: '',
|
|
|
+ settlementPeriodDays: 30,
|
|
|
+ platformProfitRate: 0,
|
|
|
+ status: 'ACTIVE'
|
|
|
+ },
|
|
|
+ supplierDialogVisible: false,
|
|
|
+ currentSystem: null,
|
|
|
+ suppliers: [],
|
|
|
+ supplierFormVisible: false,
|
|
|
+ isEditSupplier: false,
|
|
|
+ supplierForm: {
|
|
|
+ id: null,
|
|
|
+ name: '',
|
|
|
+ contactName: '',
|
|
|
+ contactPhone: '',
|
|
|
+ commissionRate: 0,
|
|
|
+ supplySystemId: null
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ this.loadData()
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ async loadData() {
|
|
|
+ try {
|
|
|
+ const res = await getSupplySystemList()
|
|
|
+ if (res.data) {
|
|
|
+ this.systems = res.data
|
|
|
+ }
|
|
|
+ } catch (e) {
|
|
|
+ console.error(e)
|
|
|
+ }
|
|
|
+ },
|
|
|
+ handleCreateSystem() {
|
|
|
+ this.isEditSystem = false
|
|
|
+ this.systemForm = { id: null, name: '', description: '', settlementPeriodDays: 30, platformProfitRate: 0, status: 'ACTIVE' }
|
|
|
+ this.systemDialogVisible = true
|
|
|
+ },
|
|
|
+ handleEditSystem(row) {
|
|
|
+ this.isEditSystem = true
|
|
|
+ this.systemForm = { ...row }
|
|
|
+ this.systemDialogVisible = true
|
|
|
+ },
|
|
|
+ async toggleSystemStatus(row) {
|
|
|
+ try {
|
|
|
+ const res = await toggleSupplySystemStatus(row.id)
|
|
|
+ if (res.code === 'OK') {
|
|
|
+ this.$message.success('状态已更新')
|
|
|
+ this.loadData()
|
|
|
+ }
|
|
|
+ } catch (e) {
|
|
|
+ this.$message.error('更新失败')
|
|
|
+ }
|
|
|
+ },
|
|
|
+ async handleSystemSubmit() {
|
|
|
+ try {
|
|
|
+ if (this.isEditSystem) {
|
|
|
+ await updateSupplySystem(this.systemForm)
|
|
|
+ } else {
|
|
|
+ await createSupplySystem(this.systemForm)
|
|
|
+ }
|
|
|
+ this.$message.success('保存成功')
|
|
|
+ this.systemDialogVisible = false
|
|
|
+ this.loadData()
|
|
|
+ } catch (e) {
|
|
|
+ this.$message.error('保存失败')
|
|
|
+ }
|
|
|
+ },
|
|
|
+ async handleManageSupplier(system) {
|
|
|
+ this.currentSystem = system
|
|
|
+ this.supplierDialogVisible = true
|
|
|
+ try {
|
|
|
+ const res = await getSupplierList(system.id)
|
|
|
+ if (res.data) {
|
|
|
+ this.suppliers = res.data
|
|
|
+ }
|
|
|
+ } catch (e) {
|
|
|
+ console.error(e)
|
|
|
+ }
|
|
|
+ },
|
|
|
+ handleSupplierDialogClose() {
|
|
|
+ this.currentSystem = null
|
|
|
+ this.suppliers = []
|
|
|
+ },
|
|
|
+ handleCreateSupplier() {
|
|
|
+ this.isEditSupplier = false
|
|
|
+ this.supplierForm = { id: null, name: '', contactName: '', contactPhone: '', commissionRate: 0, supplySystemId: this.currentSystem.id }
|
|
|
+ this.supplierFormVisible = true
|
|
|
+ },
|
|
|
+ handleEditSupplier(row) {
|
|
|
+ this.isEditSupplier = true
|
|
|
+ this.supplierForm = { ...row }
|
|
|
+ this.supplierFormVisible = true
|
|
|
+ },
|
|
|
+ async handleDeleteSupplier(row) {
|
|
|
+ try {
|
|
|
+ await this.$confirm('确定删除该供应商吗?', '提示', { confirmButtonText: '确定', cancelButtonText: '取消', type: 'warning' })
|
|
|
+ await deleteSupplier(row.id)
|
|
|
+ this.$message.success('删除成功')
|
|
|
+ const res = await getSupplierList(this.currentSystem.id)
|
|
|
+ if (res.data) {
|
|
|
+ this.suppliers = res.data
|
|
|
+ }
|
|
|
+ } catch (e) {
|
|
|
+ if (e !== 'cancel') {
|
|
|
+ this.$message.error('删除失败')
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ async handleSupplierSubmit() {
|
|
|
+ try {
|
|
|
+ if (this.isEditSupplier) {
|
|
|
+ await updateSupplier(this.supplierForm)
|
|
|
+ } else {
|
|
|
+ await createSupplier(this.supplierForm)
|
|
|
+ }
|
|
|
+ this.$message.success('保存成功')
|
|
|
+ this.supplierFormVisible = false
|
|
|
+ const res = await getSupplierList(this.currentSystem.id)
|
|
|
+ if (res.data) {
|
|
|
+ this.suppliers = res.data
|
|
|
+ }
|
|
|
+ } catch (e) {
|
|
|
+ this.$message.error('保存失败')
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped>
|
|
|
+.supply-system {
|
|
|
+ padding: 20px;
|
|
|
+}
|
|
|
+</style>
|