新增渠道管理

bms-front/src/api/masterdata/serviceChannel.js

@@ -1,5 +1,14 @@
 import request from '@/utils/request'
 
+/** 分页查询渠道列表 */
+export function listServiceChannel(query) {
+  return request({
+    url: '/masterdata/servicechannel/list',
+    method: 'get',
+    params: query
+  })
+}
+
 /** 服务渠道下拉选项（非分页，来源 srv_service_channel 老系统镜像） */
 export function listChannelOptions(query) {
   return request({
@@ -8,3 +17,46 @@ export function listChannelOptions(query) {
     params: query
   })
 }
+
+/** 查询渠道详情 */
+export function getServiceChannel(id) {
+  return request({
+    url: '/masterdata/servicechannel/' + id,
+    method: 'get'
+  })
+}
+
+/** 新增渠道 */
+export function addServiceChannel(data) {
+  return request({
+    url: '/masterdata/servicechannel',
+    method: 'post',
+    data: data
+  })
+}
+
+/** 修改渠道 */
+export function updateServiceChannel(data) {
+  return request({
+    url: '/masterdata/servicechannel',
+    method: 'put',
+    data: data
+  })
+}
+
+/** 启用或停用渠道 */
+export function changeServiceChannelStatus(id, blOpen) {
+  return request({
+    url: '/masterdata/servicechannel/changeStatus',
+    method: 'put',
+    data: { id, blOpen }
+  })
+}
+
+/** 删除渠道 */
+export function delServiceChannel(ids) {
+  return request({
+    url: '/masterdata/servicechannel/' + ids,
+    method: 'delete'
+  })
+}

bms-front/src/views/data/serviceChannel/index.vue

@@ -0,0 +1,304 @@
+<template>
+  <div class="app-container">
+    <basic-table
+      ref="tableRef"
+      :columns="columns"
+      :search-columns="searchColumns"
+      :query="queryList"
+      row-key="id"
+      selection
+    >
+      <template #toolbar="{ selection, ids }">
+        <el-col :span="1.5">
+          <el-button type="primary" plain icon="Plus" @click="handleAdd" v-hasPermi="['data:serviceChannel:add']">新增</el-button>
+        </el-col>
+        <el-col :span="1.5">
+          <el-button type="success" plain icon="Edit" :disabled="selection.length !== 1" @click="handleUpdate(selection[0])" v-hasPermi="['data:serviceChannel:edit']">修改</el-button>
+        </el-col>
+        <el-col :span="1.5">
+          <el-button type="danger" plain icon="Delete" :disabled="!ids.length" @click="handleDelete(ids)" v-hasPermi="['data:serviceChannel:remove']">删除</el-button>
+        </el-col>
+        <el-col :span="1.5">
+          <el-button type="warning" plain icon="Download" @click="handleExport" v-hasPermi="['data:serviceChannel:export']">导出</el-button>
+        </el-col>
+      </template>
+
+      <template #col-blOpen="{ row }">
+        <el-switch
+          v-model="row.blOpen"
+          active-value="1"
+          inactive-value="0"
+          @change="handleStatusChange(row)"
+          v-hasPermi="['data:serviceChannel:edit']"
+        />
+      </template>
+      <template #col-blMultiple="{ row }">
+        <span>{{ row.blMultiple === '1' ? '是' : row.blMultiple === '0' ? '否' : '-' }}</span>
+      </template>
+      <template #col-action="{ row }">
+        <el-button link type="primary" icon="Edit" @click="handleUpdate(row)" v-hasPermi="['data:serviceChannel:edit']">修改</el-button>
+        <el-button link type="primary" icon="Delete" @click="handleDelete([row.id])" v-hasPermi="['data:serviceChannel:remove']">删除</el-button>
+      </template>
+    </basic-table>
+
+    <el-dialog :title="title" v-model="open" width="760px" append-to-body>
+      <el-form ref="formRef" :model="form" :rules="rules" label-width="120px">
+        <el-row :gutter="16">
+          <el-col :span="12">
+            <el-form-item label="渠道编码" prop="channelCode">
+              <el-input v-model="form.channelCode" placeholder="请输入渠道编码" maxlength="64" :disabled="!!form.id" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="渠道名称" prop="channelName">
+              <el-input v-model="form.channelName" placeholder="请输入渠道名称" maxlength="200" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="服务商编码" prop="serviceCode">
+              <el-input v-model="form.serviceCode" placeholder="所属服务商编码" maxlength="32" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="服务商名称" prop="serviceName">
+              <el-input v-model="form.serviceName" placeholder="所属服务商名称" maxlength="200" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="启用状态" prop="blOpen">
+              <el-radio-group v-model="form.blOpen">
+                <el-radio value="1">启用</el-radio>
+                <el-radio value="0">停用</el-radio>
+              </el-radio-group>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="是否多票" prop="blMultiple">
+              <el-radio-group v-model="form.blMultiple">
+                <el-radio value="1">是</el-radio>
+                <el-radio value="0">否</el-radio>
+              </el-radio-group>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="目的港/目的地" prop="desPort">
+              <el-input v-model="form.desPort" placeholder="目的港或目的地区域" maxlength="500" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="发货人名称" prop="shipperName">
+              <el-input v-model="form.shipperName" placeholder="请输入发货人名称" maxlength="255" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="货物类型" prop="cargoType">
+              <el-input v-model="form.cargoType" maxlength="255" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="付款方式" prop="payType">
+              <el-input v-model="form.payType" maxlength="255" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="末端服务商" prop="finalServiceName">
+              <el-input v-model="form.finalServiceName" maxlength="255" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="轨迹查询类型" prop="queryType">
+              <el-input v-model="form.queryType" maxlength="20" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="轨迹编码" prop="trajectoryCode">
+              <el-input v-model="form.trajectoryCode" maxlength="60" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="重量类型" prop="weightType">
+              <el-input v-model="form.weightType" maxlength="1" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="抛货系数" prop="dimDivisor">
+              <el-input-number v-model="form.dimDivisor" :min="0" :precision="0" controls-position="right" style="width: 100%;" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="发货类型" prop="shipmentType">
+              <el-input v-model="form.shipmentType" maxlength="32" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="24">
+            <el-form-item label="计重规则" prop="weightRule">
+              <el-input v-model="form.weightRule" type="textarea" :rows="2" maxlength="500" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="24">
+            <el-form-item label="备注" prop="remarks">
+              <el-input v-model="form.remarks" type="textarea" :rows="2" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-form>
+      <template #footer>
+        <el-button type="primary" @click="submitForm">确 定</el-button>
+        <el-button @click="open = false">取 消</el-button>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup name="ServiceChannel">
+import { nextTick } from 'vue'
+import {
+  listServiceChannel, getServiceChannel, addServiceChannel,
+  updateServiceChannel, delServiceChannel, changeServiceChannelStatus
+} from '@/api/masterdata/serviceChannel'
+
+const { proxy } = getCurrentInstance()
+const tableRef = ref()
+const formRef = ref()
+const open = ref(false)
+const title = ref('')
+
+const openOptions = [
+  { label: '启用', value: '1' },
+  { label: '停用', value: '0' }
+]
+
+const searchColumns = [
+  { label: '渠道编码', prop: 'channelCode', component: 'input', placeholder: '渠道编码', width: '160px' },
+  { label: '渠道名称', prop: 'channelName', component: 'input', placeholder: '模糊查询', width: '180px' },
+  { label: '服务商编码', prop: 'serviceCode', component: 'input', placeholder: '服务商编码', width: '160px' },
+  { label: '服务商名称', prop: 'serviceName', component: 'input', placeholder: '模糊查询', width: '180px' },
+  { label: '目的港/目的地', prop: 'desPort', component: 'input', placeholder: '模糊查询', width: '180px' },
+  { label: '发货人名称', prop: 'shipperName', component: 'input', placeholder: '模糊查询', width: '180px' },
+  { label: '状态', prop: 'blOpen', component: 'select', options: openOptions, placeholder: '启用状态', width: '140px', props: { clearable: true } }
+]
+
+const columns = [
+  { label: '渠道编码', prop: 'channelCode', minWidth: 140, showOverflowTooltip: true },
+  { label: '渠道名称', prop: 'channelName', minWidth: 180, showOverflowTooltip: true },
+  { label: '服务商编码', prop: 'serviceCode', minWidth: 120, showOverflowTooltip: true },
+  { label: '服务商名称', prop: 'serviceName', minWidth: 160, showOverflowTooltip: true },
+  { label: '目的港/目的地', prop: 'desPort', minWidth: 160, showOverflowTooltip: true },
+  { label: '发货人', prop: 'shipperName', minWidth: 140, showOverflowTooltip: true },
+  { label: '启用', prop: 'blOpen', width: 80, slot: 'blOpen' },
+  { label: '多票', prop: 'blMultiple', width: 70, slot: 'blMultiple' },
+  { label: '货物类型', prop: 'cargoType', minWidth: 120, showOverflowTooltip: true },
+  { label: '末端服务商', prop: 'finalServiceName', minWidth: 140, showOverflowTooltip: true },
+  { label: '抛货系数', prop: 'dimDivisor', width: 90 },
+  { label: '同步时间', prop: 'syncTime', width: 170, parseTime: true },
+  { label: '操作', prop: 'action', width: 150, fixed: 'right', slot: 'action', showInToolbar: false }
+]
+
+const data = reactive({
+  form: {},
+  rules: {
+    channelCode: [{ required: true, message: '渠道编码不能为空', trigger: 'blur' }],
+    channelName: [{ required: true, message: '渠道名称不能为空', trigger: 'blur' }],
+    blOpen: [{ required: true, message: '请选择启用状态', trigger: 'change' }]
+  }
+})
+const { form, rules } = toRefs(data)
+
+function queryList(params) {
+  return listServiceChannel(params)
+}
+
+function emptyForm() {
+  return {
+    id: undefined,
+    channelCode: '',
+    channelName: '',
+    serviceCode: '',
+    serviceName: '',
+    blOpen: '1',
+    blMultiple: '0',
+    desPort: '',
+    shipperName: '',
+    shipperId: '',
+    cargoType: '',
+    payType: '',
+    finalServiceName: '',
+    queryType: '',
+    trajectoryCode: '',
+    weightType: '',
+    dimDivisor: undefined,
+    shipmentType: '',
+    weightRule: '',
+    remarks: ''
+  }
+}
+
+function handleAdd() {
+  form.value = emptyForm()
+  title.value = '新增渠道'
+  open.value = true
+  nextTick(() => formRef.value && formRef.value.clearValidate())
+}
+
+function handleUpdate(row) {
+  getServiceChannel(row.id).then(res => {
+    form.value = Object.assign(emptyForm(), res.data || {})
+    title.value = '修改渠道'
+    open.value = true
+    nextTick(() => formRef.value && formRef.value.clearValidate())
+  })
+}
+
+function submitForm() {
+  formRef.value.validate(valid => {
+    if (!valid) return
+    const req = form.value.id ? updateServiceChannel(form.value) : addServiceChannel(form.value)
+    req.then(() => {
+      proxy.$modal.msgSuccess('保存成功')
+      open.value = false
+      tableRef.value?.refresh()
+    })
+  })
+}
+
+function handleDelete(ids) {
+  if (!ids || !ids.length) return
+  proxy.$modal.confirm('确认删除选中的 ' + ids.length + ' 条渠道？已被产品或供应商引用的渠道不能删除。').then(() => {
+    return delServiceChannel(ids.join(','))
+  }).then(() => {
+    proxy.$modal.msgSuccess('删除成功')
+    tableRef.value?.refresh()
+  }).catch(() => {})
+}
+
+function handleStatusChange(row) {
+  if (!row || !row.id || !row.channelCode) {
+    nextTick(() => {
+      row.blOpen = row.blOpen === '1' ? '0' : '1'
+    })
+    return
+  }
+  if (row.__originalOpen !== undefined && row.__originalOpen === row.blOpen) {
+    return
+  }
+  row.__originalOpen = row.blOpen === '1' ? '0' : '1'
+  const text = row.blOpen === '1' ? '启用' : '停用'
+  const name = row.channelName || row.channelCode
+  proxy.$modal.confirm('确认要' + text + '渠道「' + name + '」吗？').then(() => {
+    return changeServiceChannelStatus(row.id, row.blOpen)
+  }).then(() => {
+    row.__originalOpen = row.blOpen
+    proxy.$modal.msgSuccess(text + '成功')
+  }).catch(() => {
+    const restored = row.blOpen === '1' ? '0' : '1'
+    row.__originalOpen = restored
+    nextTick(() => { row.blOpen = restored })
+  })
+}
+
+function handleExport() {
+  proxy.download('masterdata/servicechannel/export', {
+    ...tableRef.value.getQueryParams()
+  }, `service_channel_${new Date().getTime()}.xlsx`)
+}
+</script>