82 lines
4.6 KiB
Vue
82 lines
4.6 KiB
Vue
<template>
|
||
<div>
|
||
<div class="page-header">
|
||
<div><h2>{{ title }}</h2><p>业务伙伴独立于本公司的组织数据，可按合作组织配置{{ title }}身份和状态。</p></div>
|
||
<el-button type="primary" @click="openCreate">新增{{ title }}</el-button>
|
||
</div>
|
||
<el-table v-loading="loading" :data="rows" stripe>
|
||
<el-table-column prop="partner_code" label="伙伴编码" width="140" />
|
||
<el-table-column prop="legal_name" label="企业名称" min-width="180" />
|
||
<el-table-column prop="unified_credit_code" label="统一社会信用代码" min-width="180" />
|
||
<el-table-column prop="contact_name" label="联系人" width="110" />
|
||
<el-table-column prop="contact_phone" label="联系电话" width="140" />
|
||
<el-table-column :prop="statusField" label="合作状态" width="110" />
|
||
<el-table-column label="操作" width="100"><template #default="{ row }"><el-button link type="primary" @click="openEdit(row)">编辑</el-button></template></el-table-column>
|
||
</el-table>
|
||
<el-empty v-if="!loading && rows.length === 0" :description="`暂无${title}`" />
|
||
|
||
<el-dialog v-model="dialogVisible" :title="`${editingId ? '编辑' : '新增'}${title}`" width="560px">
|
||
<el-form :model="form" label-width="130px">
|
||
<el-form-item label="伙伴编码" required><el-input v-model="form.partner_code" :disabled="Boolean(editingId)" /></el-form-item>
|
||
<el-form-item label="企业名称" required><el-input v-model="form.legal_name" /></el-form-item>
|
||
<el-form-item label="统一社会信用代码"><el-input v-model="form.unified_credit_code" /></el-form-item>
|
||
<el-form-item label="联系人"><el-input v-model="form.contact_name" /></el-form-item>
|
||
<el-form-item label="联系电话"><el-input v-model="form.contact_phone" /></el-form-item>
|
||
<el-form-item label="地址"><el-input v-model="form.address" /></el-form-item>
|
||
<el-form-item label="合作状态">
|
||
<el-select v-model="form.status" style="width: 100%">
|
||
<el-option label="启用" value="active" />
|
||
<el-option label="暂停" value="suspended" />
|
||
<el-option label="淘汰" value="eliminated" />
|
||
<el-option label="待审核" value="pending" />
|
||
<el-option label="停用" value="inactive" />
|
||
</el-select>
|
||
</el-form-item>
|
||
</el-form>
|
||
<template #footer><el-button @click="dialogVisible = false">取消</el-button><el-button type="primary" :loading="saving" @click="save">保存</el-button></template>
|
||
</el-dialog>
|
||
</div>
|
||
</template>
|
||
|
||
<script setup>
|
||
import { computed, onMounted, reactive, ref, watch } from 'vue'
|
||
import { ElMessage } from 'element-plus'
|
||
import { partnersApi } from '../../api/partners'
|
||
|
||
const props = defineProps({ role: { type: String, required: true }, title: { type: String, required: true } })
|
||
const rows = ref([])
|
||
const loading = ref(false)
|
||
const saving = ref(false)
|
||
const dialogVisible = ref(false)
|
||
const editingId = ref(null)
|
||
const statusField = computed(() => `${props.role}_status`)
|
||
const form = reactive(emptyForm())
|
||
|
||
function emptyForm() { return { partner_code: '', legal_name: '', unified_credit_code: '', contact_name: '', contact_phone: '', address: '', status: 'active', is_supplier: false, is_customer: false } }
|
||
async function load() { loading.value = true; try { const response = await partnersApi.list(props.role); rows.value = response.data || [] } finally { loading.value = false } }
|
||
function openCreate() { editingId.value = null; Object.assign(form, emptyForm()); dialogVisible.value = true }
|
||
function openEdit(row) { editingId.value = row.id; Object.assign(form, row, { status: row[statusField.value] || 'active' }); dialogVisible.value = true }
|
||
function payload() {
|
||
return {
|
||
...form,
|
||
is_supplier: form.is_supplier || props.role === 'supplier',
|
||
is_customer: form.is_customer || props.role === 'customer',
|
||
[`${props.role}_status`]: form.status
|
||
}
|
||
}
|
||
async function save() {
|
||
if (!form.partner_code.trim()) { ElMessage.warning('请填写伙伴编码'); return }
|
||
if (!form.legal_name.trim()) { ElMessage.warning('请填写企业名称'); return }
|
||
saving.value = true
|
||
try { if (editingId.value) await partnersApi.update(editingId.value, payload()); else await partnersApi.create(payload()); ElMessage.success('保存成功'); dialogVisible.value = false; await load() } finally { saving.value = false }
|
||
}
|
||
watch(() => props.role, load)
|
||
onMounted(load)
|
||
</script>
|
||
|
||
<style scoped>
|
||
.page-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px; }
|
||
.page-header h2 { margin: 0 0 6px; }
|
||
.page-header p { margin: 0; color: #909399; }
|
||
</style>
|