✨ CRM：完善回款 plan 列表

5cb86589 · YunaiV · f30f71b7 · 5cb86589 · 5cb86589 · 5cb86589
Commit 5cb86589 authored Feb 25, 2024 by YunaiV
Show whitespace changes
Inline Side-by-side

Showing with 90 additions and 10 deletions

src/api/crm/receivable/plan/index.ts
+4 -0

src/views/crm/customer/CustomerImportForm.vue
+1 -0

src/views/crm/receivable/plan/index.vue
+85 -10

No files found.
--- a/src/api/crm/receivable/plan/index.ts
+++ b/src/api/crm/receivable/plan/index.ts
@@ -14,6 +14,10 @@ export interface ReceivablePlanVO {
  contractId: number
  ownerUserId: number
  remark: string
+  receivable?: {
+    price: number
+    returnTime: Date
+  }
 }
 // 查询回款计划列表

--- a/src/views/crm/customer/CustomerImportForm.vue
+++ b/src/views/crm/customer/CustomerImportForm.vue
@@ -81,6 +81,7 @@ const submitForm = async () => {
  const formData = new FormData()
  formData.append('updateSupport', updateSupport.value)
  formData.append('file', fileList.value[0].raw)
+  // TODO @芋艿：后面是不是可以采用这种形式，去掉 uploadHeaders
  await CustomerApi.handleImport(formData)
 }

--- a/src/views/crm/receivable/plan/index.vue
+++ b/src/views/crm/receivable/plan/index.vue
@@ -67,10 +67,27 @@
  <!-- 列表 -->
  <ContentWrap>
    <el-table v-loading="loading" :data="list" :show-overflow-tooltip="true" :stripe="true">
-      <el-table-column align="center" label="客户名称" prop="customerName" width="150px" />
+      <el-table-column align="center" fixed="left" label="客户名称" prop="customerName" width="150">
+        <template #default="scope">
+          <el-link
+            :underline="false"
+            type="primary"
+            @click="openCustomerDetail(scope.row.customerId)"
+          >
+            {{ scope.row.customerName }}
+          </el-link>
+        </template>
+      </el-table-column>
      <el-table-column align="center" label="合同编号" prop="contractNo" width="200px" />
+      <!-- TODO @puhui999：这里可以点到详情；最新版本，他有了单独的详情哈 -->
      <el-table-column align="center" label="期数" prop="period" />
-      <el-table-column align="center" label="计划回款(元)" prop="price" width="120" />
+      <el-table-column
+        align="center"
+        label="计划回款金额（元）"
+        prop="price"
+        width="160"
+        :formatter="erpPriceTableColumnFormatter"
+      />
      <el-table-column
        :formatter="dateFormatter2"
        align="center"
@@ -80,14 +97,52 @@
      />
      <el-table-column align="center" label="提前几天提醒" prop="remindDays" width="150" />
      <el-table-column
-        :formatter="dateFormatter2"
        align="center"
        label="提醒日期"
        prop="remindTime"
        width="180px"
+        :formatter="dateFormatter2"
      />
-      <el-table-column label="负责人" prop="ownerUserName" width="120" />
+      <el-table-column align="center" label="回款方式" prop="returnType" width="130px">
+        <template #default="scope">
+          <dict-tag :type="DICT_TYPE.CRM_RECEIVABLE_RETURN_TYPE" :value="scope.row.returnType" />
+        </template>
+      </el-table-column>
      <el-table-column align="center" label="备注" prop="remark" />
+      <el-table-column label="负责人" prop="ownerUserName" width="120" />
+      <el-table-column
+        align="center"
+        label="实际回款金额（元）"
+        prop="receivable.price"
+        width="160"
+      >
+        <template #default="scope">
+          <el-text v-if="scope.row.receivable">
+            {{ erpPriceInputFormatter(scope.row.receivable.price) }}
+          </el-text>
+          <el-text v-else>{{ erpPriceInputFormatter(0) }}</el-text>
+        </template>
+      </el-table-column>
+      <el-table-column
+        align="center"
+        label="实际回款日期"
+        prop="receivable.returnTime"
+        width="180px"
+        :formatter="dateFormatter2"
+      />
+      <el-table-column
+        align="center"
+        label="实际回款金额（元）"
+        prop="receivable.price"
+        width="160"
+      >
+        <template #default="scope">
+          <el-text v-if="scope.row.receivable">
+            {{ erpPriceInputFormatter(scope.row.price - scope.row.receivable.price) }}
+          </el-text>
+          <el-text v-else>{{ erpPriceInputFormatter(scope.row.price) }}</el-text>
+        </template>
+      </el-table-column>
      <el-table-column
        align="center"
        fixed="right"
@@ -99,7 +154,23 @@
          <dict-tag :type="DICT_TYPE.INFRA_BOOLEAN_STRING" :value="scope.row.finishStatus" />
        </template>
      </el-table-column>
+      <el-table-column
+        :formatter="dateFormatter"
+        align="center"
+        label="更新时间"
+        prop="updateTime"
+        width="180px"
+      />
+      <el-table-column
+        :formatter="dateFormatter"
+        align="center"
+        label="创建时间"
+        prop="createTime"
+        width="180px"
+      />
+      <el-table-column align="center" label="创建人" prop="creatorName" width="100px" />
      <el-table-column align="center" fixed="right" label="操作" width="130px">
+        <!-- TODO @puhui999：新建回款 -->
        <template #default="scope">
          <el-button
            v-hasPermi="['crm:receivable-plan:update']"
@@ -135,12 +206,12 @@
 <script lang="ts" setup>
 import { DICT_TYPE } from '@/utils/dict'
-import { dateFormatter2 } from '@/utils/formatTime'
+import { dateFormatter, dateFormatter2 } from '@/utils/formatTime'
 import download from '@/utils/download'
 import * as ReceivablePlanApi from '@/api/crm/receivable/plan'
 import ReceivablePlanForm from './ReceivablePlanForm.vue'
-import * as UserApi from '@/api/system/user'
 import * as CustomerApi from '@/api/crm/customer'
+import { erpPriceInputFormatter, erpPriceTableColumnFormatter } from '@/utils'
 defineOptions({ name: 'ReceivablePlan' })
@@ -150,7 +221,6 @@ const { t } = useI18n() // 国际化
 const loading = ref(true) // 列表的加载中
 const total = ref(0) // 列表的总页数
 const list = ref([]) // 列表的数据
-const userList = ref<UserApi.UserVO[]>([]) // 用户列表
 const queryParams = reactive({
  pageNo: 1,
  pageSize: 10,
@@ -159,6 +229,7 @@ const queryParams = reactive({
 })
 const queryFormRef = ref() // 搜索的表单
 const exportLoading = ref(false) // 导出的加载中
+const customerList = ref<CustomerApi.CustomerVO[]>([]) // 客户列表
 /** 查询列表 */
 const getList = async () => {
@@ -217,12 +288,16 @@ const handleExport = async () => {
    exportLoading.value = false
  }
 }
-const customerList = ref<CustomerApi.CustomerVO[]>([]) // 客户列表
+/** 打开客户详情 */
+const { push } = useRouter()
+const openCustomerDetail = (id: number) => {
+  push({ name: 'CrmCustomerDetail', params: { id } })
+}
 /** 初始化 **/
 onMounted(async () => {
  await getList()
-  // 获取用户列表
-  userList.value = await UserApi.getSimpleUserList()
  // 获得客户列表
  customerList.value = await CustomerApi.getCustomerSimpleList()
 })