Merge branch 'master' of http://172.14.1.63:3000/liuxf/ds-yamada-fcbi-admin

src/api/fcbi/customer.js

@@ -26,3 +26,12 @@ export function getCustomerDetail(data) {
     data: data
   })
 }
+
+//  顧客購入履歴
+export function customerHistory(query) {
+  return request({
+    url: '/system/customer/customerHistory',
+    method: 'get',
+    params: query
+  })
+}

src/router/index.js

@@ -209,6 +209,20 @@ export const constantRoutes = [
             }
         ]
     },
+    {
+        path: '/customerAdmin',
+        component: Layout,
+        hidden: true,
+        redirect: 'noredirect',
+        children: [
+            {
+                path: 'customerHistory/:customerId',
+                component: () => import('@/views/fcbi/customer/history'),
+                name: 'customerHistory',
+                meta: {title: '顧客購入履歴', icon: 'user'}
+            }
+        ]
+    },
 ]
 
 // ダイナミックルート、ユーザー権限に基づいて動的に読み込みます

src/views/fcbi/customer/history.vue

@@ -0,0 +1,151 @@
+<!-- 顧客購入履歴 -->
+<template>
+  <div class="app-container">
+    <el-form ref="queryRef" :inline="true" :model="queryParams">
+      <el-form-item label="顧客名" prop="customerName">
+        <el-input v-model="queryParams.customerName"
+                  clearable maxlength="255" @keyup.enter="handleQuery"/>
+      </el-form-item>
+      <el-form-item label="顧客名(カナ)" prop="customerNameKana">
+        <el-input v-model="queryParams.customerNameKana"
+                  clearable
+                  maxlength="255" @keyup.enter="handleQuery"/>
+      </el-form-item>
+        <el-form-item>
+          <el-button icon="Search" type="primary" @click="handleQuery">検索</el-button>
+          <el-button icon="Refresh" type="primary" @click="resetQuery">クリア</el-button>
+        </el-form-item>
+    </el-form>
+
+    <el-table v-show="initLoadingCompleted" v-loading="listLoading" :border="true" :data="CustomerList">
+      <el-table-column :show-overflow-tooltip="true" align="center" header-align="left" label="FC" min-width="60"
+                       prop="brandName"
+                       width=""/>
+      <el-table-column :show-overflow-tooltip="true" align="center" header-align="left" label="店舗名" min-width="90"
+                       prop="storeName"
+                       width=""/>
+      <el-table-column :show-overflow-tooltip="true" align="center" header-align="center" label="商品名" min-width="100"
+                       prop="purchaseProductName"
+                       width=""/>
+      <el-table-column :show-overflow-tooltip="true" align="center" header-align="center" label="購入年月日" min-width="70"
+                       prop="purchaseMonth" :formatter="formatPurchaseMonth"
+                       width=""/>
+      <el-table-column :show-overflow-tooltip="true" align="center" header-align="center" label="単価" min-width="60"
+                       prop="purchaseCost" :formatter="formatPrice"
+                       width=""/>
+      <el-table-column :show-overflow-tooltip="true" align="center" header-align="center" label="数量" min-width="70"
+                       prop="purchaseQuantity"
+                       width=""/>
+      <el-table-column :show-overflow-tooltip="true" align="center" header-align="center" label="購入金額" min-width="70"
+                       prop="purchaseAmount" :formatter="formatPrice"
+                       width=""/>
+      <el-table-column :show-overflow-tooltip="true" align="center" header-align="center" label="購入状態" min-width="70"
+                       prop="validPurchaseFlagName"
+                       width=""/>
+    </el-table>
+
+    <pagination v-show="listTotalCnt>0"
+                v-model:limit="queryParams.pageSize"
+                v-model:page="queryParams.pageNum"
+                :total="listTotalCnt"
+                @pagination="getSearchList"/>
+  </div>
+</template>
+
+<script name="CustomerHistory" setup>
+
+import {customerHistory} from "@/api/fcbi/customer.js"
+import {useRoute} from 'vue-router';
+
+// 認証項目のテーブルデータを格納するリアクティブ
+const CustomerList = ref([]);
+// データ読み込み中のローディング状態を管理するリアクティブ
+const listLoading = ref(false);
+// 検索結果の総件数を格納するリアクティブ
+const listTotalCnt = ref(0);
+// 初期ロードが完了したかどうかを示すリアクティブ
+const initLoadingCompleted = ref(false);
+const {proxy} = getCurrentInstance();
+const route = useRoute();
+const customerId = route.params.customerId;
+
+/**
+ * コンポーネントの状態を管理するリアクティブオブジェクト
+ */
+const data = reactive({
+  form: {},
+  // 検索条件を格納するオブジェクト
+  queryParams: {
+    pageNum: 1,
+    pageSize: 10,
+    customerName: '',
+    customerNameKana: '',
+  },
+});
+
+//値の書式設定関数
+const formatPrice = (row, column, cellValue) => {
+  if (cellValue === null || cellValue === undefined) return '';
+  const num = Number(cellValue);
+  if (isNaN(num)) return cellValue;
+
+  return num.toLocaleString(undefined, {
+    minimumFractionDigits: 2,
+    maximumFractionDigits: 2
+  });
+};
+
+// 日付フォーマット関数
+const formatPurchaseMonth = (row, column, cellValue) => {
+  if (!cellValue) return '';
+  const str = cellValue.toString();
+  if (str.length !== 8) return cellValue;
+    return `${str.slice(0, 4)}-${str.slice(4, 6)}-${str.slice(6, 8)}`;
+};
+
+// リアクティブオブジェクトからプロパティを参照可能なオブジェクトに変換
+const {queryParams} = toRefs(data);
+
+/**
+ * 検索ボタンのクリックイベントハンドラー
+ * 検索条件を初期ページに設定して検索を実行する
+ */
+function handleQuery() {
+  queryParams.value.pageNum = 1;
+  getSearchList();
+}
+
+/**
+ * 発注リストを検索する関数
+ * APIを呼び出して検索条件に一致する発注データを取得する
+ */
+function getSearchList() {
+  listLoading.value = true;
+  let params = {
+    pageNum: queryParams.value.pageNum,
+    pageSize: queryParams.value.pageSize,
+    customerName: queryParams.value.customerName,
+    customerNameKana: queryParams.value.customerNameKana,
+    customerId: customerId
+  };
+  customerHistory(params).then(response => {
+    CustomerList.value = response.rows;
+    listTotalCnt.value = response.total;
+    listLoading.value = false;
+    initLoadingCompleted.value = true;
+  });
+}
+/**
+ * リセット ボタンアクション
+ */
+function resetQuery() {
+  proxy.resetForm("queryRef");
+  handleQuery();
+}
+// コンポーネント初期化時に検索を実行
+getSearchList();
+</script>
+
+<style>
+
+</style>

src/views/fcbi/customer/list.vue

@@ -25,8 +25,8 @@
           </el-form-item>
         </el-col>
         <el-form-item label="FC" prop="brandCode" >
-          <el-checkbox-group v-model="queryParams.brandNames ">
-            <el-checkbox v-for="dict in yamada_fc_brand" :key="dict.label" :label="dict.label">{{ dict.label }}</el-checkbox>
+          <el-checkbox-group v-model="queryParams.brandCodes ">
+            <el-checkbox v-for="dict in yamada_fc_brand" :key="dict.value" :label="dict.value">{{ dict.label }}</el-checkbox>
           </el-checkbox-group>
         </el-form-item>
         <el-form-item>
@@ -69,7 +69,7 @@
       <el-table-column align="center" class-name="small-padding fixed-width" label="操作" min-width="180" width="300">
         <template #default="scope">
           <el-button @click="CustomerDetail(scope.row)"  v-hasPermi="['fcbi:customer:detail']"  icon="Edit" link type="primary" >顧客詳細</el-button>
-          <el-button @click="Confirm(scope.row)"  v-hasPermi="['fcbi:customer:history']"  icon="Edit" link type="primary" >顧客購入履歴</el-button>
+          <el-button @click="CustomerHistory(scope.row)"  v-hasPermi="['fcbi:customer:history']"  icon="Edit" link type="primary" >顧客購入履歴</el-button>
         </template>
       </el-table-column>
     </el-table>
@@ -113,7 +113,7 @@ const data = reactive({
     customerName: '',
     customerNameKana: '',
     storeCode: '',
-    brandNames : [],
+    brandCodes : [],
   },
 });
 
@@ -155,7 +155,7 @@ function getSearchList() {
     customerName: queryParams.value.customerName,
     customerNameKana: queryParams.value.customerNameKana,
     storeCode: queryParams.value.storeCode,
-    brandNames : queryParams.value.brandNames ,
+    brandCodes : queryParams.value.brandCodes ,
   };
   customerSurvey(params).then(response => {
     CustomerList.value = response.rows;
@@ -173,12 +173,21 @@ const CustomerDetail = (row) => {
     }
   });
 };
+
+const CustomerHistory = (row) => {
+  router.push({
+    name: 'customerHistory',
+    params: {
+      customerId: row.customerId
+    }
+  });
+};
 /**
  * リセット ボタンアクション
  */
 function resetQuery() {
   proxy.resetForm("queryRef");
-  queryParams.value.brandNames = [];
+  queryParams.value.brandCodes = [];
   handleQuery();
 }
 // コンポーネント初期化時に検索を実行