历史数据导出模板功能增加哎

src/api/stock/history/index.ts

@@ -1,4 +1,4 @@
-import request from '@/utils/request';
+ import request from '@/utils/request';
 import { AxiosPromise } from 'axios';
 
 /**
@@ -34,6 +34,7 @@ export interface StockPoolHistoryVO {
   dayLowestPrice?: number;
   dayAvgPrice?: number;
   dayClosePrice?: number;
+  highTrend?: number;
   createTime?: string;
   updateTime?: string;
 }
@@ -134,3 +135,14 @@ export function importStockHistory(file: File, recordDate: string, updateSupport
     }
   });
 }
+
+/**
+ * 下载导入模版
+ */
+export function downloadTemplate() {
+  return request({
+    url: '/stock/history/downloadTemplate',
+    method: 'get',
+    responseType: 'blob'
+  });
+}

src/views/stock/history/index.vue

@@ -33,7 +33,16 @@
       <template #header>
         <el-row :gutter="10">
           <el-col :span="1.5">
-            <el-button v-has-permi="['stock:history:import']" type="primary" plain icon="Upload" @click="handleImport">导入数据</el-button>
+            <el-button v-has-permi="['stock:history:add']" type="primary" plain icon="Plus" @click="handleAdd">新增</el-button>
+          </el-col>
+          <el-col :span="1.5">
+            <el-button v-has-permi="['stock:history:edit']" type="success" plain icon="Edit" :disabled="single" @click="handleUpdate">修改</el-button>
+          </el-col>
+          <el-col :span="1.5">
+            <el-button v-has-permi="['stock:history:import']" type="warning" plain icon="Upload" @click="handleImport">导入数据</el-button>
+          </el-col>
+          <el-col :span="1.5">
+            <el-button v-has-permi="['stock:history:import']" type="info" plain icon="Download" @click="handleDownloadTemplate">下载模版</el-button>
           </el-col>
           <el-col :span="1.5">
             <el-button v-has-permi="['stock:history:remove']" type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete">删除</el-button>
@@ -43,8 +52,8 @@
       </template>
 
       <el-table v-loading="loading" border :data="historyList" @selection-change="handleSelectionChange">
-        <el-table-column type="selection" width="50" align="center" />
-        <el-table-column label="记录日期" align="center" prop="recordDate" width="120" />
+        <el-table-column type="selection" width="60" align="center" />
+        <el-table-column label="日期" align="center" prop="recordDate" width="120" />
         <el-table-column label="股票代码" align="center" prop="stockCode" width="100" />
         <el-table-column label="股票名称" align="center" prop="stockName" width="120" />
         <el-table-column label="涨幅%" align="center" prop="changePercent" width="100">
@@ -55,7 +64,7 @@
         <el-table-column label="收盘价" align="center" prop="closePrice" width="100">
           <template #default="scope">{{ formatNumber(scope.row.closePrice) }}</template>
         </el-table-column>
-        <el-table-column label="总金额" align="center" prop="totalAmount" width="120">
+        <el-table-column label="总金额" align="center" prop="totalAmount" width="140">
           <template #default="scope">{{ formatNumber(scope.row.totalAmount) }}</template>
         </el-table-column>
         <el-table-column label="强度评分" align="center" prop="strengthScore" width="100">
@@ -79,8 +88,16 @@
         <el-table-column label="当天收盘价" align="center" prop="dayClosePrice" width="110">
           <template #default="scope">{{ formatNumber(scope.row.dayClosePrice) }}</template>
         </el-table-column>
-        <el-table-column label="操作" align="center" width="80" fixed="right">
+        <el-table-column label="最高涨幅%" align="center" prop="highTrend" width="110">
           <template #default="scope">
+            <span :class="getChangeClass(scope.row.highTrend)">{{ formatNumber(scope.row.highTrend) }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="操作" align="center" width="120" fixed="right">
+          <template #default="scope">
+            <el-tooltip content="修改" placement="top">
+              <el-button v-has-permi="['stock:history:edit']" link type="primary" icon="Edit" @click="handleUpdate(scope.row)"></el-button>
+            </el-tooltip>
             <el-tooltip content="删除" placement="top">
               <el-button v-has-permi="['stock:history:remove']" link type="danger" icon="Delete" @click="handleDelete(scope.row)"></el-button>
             </el-tooltip>
@@ -91,6 +108,107 @@
       <pagination v-show="total > 0" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" :total="total" @pagination="getList" />
     </el-card>
 
+    <!-- 添加或修改历史数据对话框 -->
+    <el-dialog v-model="dialog.visible" :title="dialog.title" width="700px" append-to-body>
+      <el-form ref="historyFormRef" :model="form" :rules="rules" label-width="100px">
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="记录日期" prop="recordDate">
+              <el-date-picker v-model="form.recordDate" type="date" placeholder="选择日期" value-format="YYYY-MM-DD" style="width: 100%" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="股票代码" prop="stockCode">
+              <el-input v-model="form.stockCode" placeholder="请输入股票代码" maxlength="20" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="股票名称" prop="stockName">
+              <el-input v-model="form.stockName" placeholder="请输入股票名称" maxlength="50" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="涨幅%" prop="changePercent">
+              <el-input-number v-model="form.changePercent" :precision="2" :step="0.1" style="width: 100%" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="收盘价" prop="closePrice">
+              <el-input-number v-model="form.closePrice" :precision="2" :min="0" :step="0.1" style="width: 100%" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="总金额" prop="totalAmount">
+              <el-input-number v-model="form.totalAmount" :precision="2" :min="0" style="width: 100%" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="强度评分" prop="strengthScore">
+              <el-input-number v-model="form.strengthScore" :precision="2" :step="0.1" style="width: 100%" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="流通市值" prop="circulationMarketValue">
+              <el-input-number v-model="form.circulationMarketValue" :precision="2" :min="0" style="width: 100%" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="主升周期" prop="mainRisePeriod">
+              <el-input v-model="form.mainRisePeriod" placeholder="请输入主升周期" maxlength="50" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="近期涨手" prop="recentRiseHand">
+              <el-input v-model="form.recentRiseHand" placeholder="请输入近期涨手" maxlength="50" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="近期涨停" prop="recentLimitUp">
+              <el-input v-model="form.recentLimitUp" placeholder="请输入近期涨停" maxlength="50" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="当天最高价" prop="dayHighestPrice">
+              <el-input-number v-model="form.dayHighestPrice" :precision="2" :min="0" :step="0.1" style="width: 100%" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="当天最低价" prop="dayLowestPrice">
+              <el-input-number v-model="form.dayLowestPrice" :precision="2" :min="0" :step="0.1" style="width: 100%" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="当天均价" prop="dayAvgPrice">
+              <el-input-number v-model="form.dayAvgPrice" :precision="2" :min="0" :step="0.1" style="width: 100%" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="当天收盘价" prop="dayClosePrice">
+              <el-input-number v-model="form.dayClosePrice" :precision="2" :min="0" :step="0.1" style="width: 100%" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-form>
+      <template #footer>
+        <el-button type="primary" @click="submitForm">确 定</el-button>
+        <el-button @click="cancel">取 消</el-button>
+      </template>
+    </el-dialog>
+
     <!-- 导入对话框 -->
     <el-dialog v-model="importDialog.visible" title="导入历史数据" width="500px" append-to-body>
       <el-form ref="importFormRef" :model="importForm" :rules="importRules" label-width="100px">
@@ -138,7 +256,7 @@
 
 <script setup name="StockHistory" lang="ts">
 import { ref, reactive, getCurrentInstance } from 'vue';
-import { listStockHistory, delStockHistory, importStockHistory } from '@/api/stock/history';
+import { listStockHistory, getStockHistory, addStockHistory, updateStockHistory, delStockHistory, importStockHistory, downloadTemplate } from '@/api/stock/history';
 import type { UploadFile, UploadFiles, UploadInstance } from 'element-plus';
 
 const { proxy } = getCurrentInstance() as ComponentInternalInstance;
@@ -147,12 +265,14 @@ const historyList = ref<any[]>([]);
 const loading = ref(true);
 const showSearch = ref(true);
 const ids = ref<number[]>([]);
+const single = ref(true);
 const multiple = ref(true);
 const total = ref(0);
 const dateRange = ref<[string, string]>();
 const importing = ref(false);
 
 const queryFormRef = ref<ElFormInstance>();
+const historyFormRef = ref<ElFormInstance>();
 const importFormRef = ref<ElFormInstance>();
 const uploadRef = ref<UploadInstance>();
 
@@ -165,6 +285,18 @@ const queryParams = ref({
   endDate: undefined as string | undefined
 });
 
+const dialog = reactive({ visible: false, title: '' });
+const form = ref<any>({});
+
+const rules: Record<string, any[]> = {
+  recordDate: [{ required: true, message: '请选择记录日期', trigger: 'change' }],
+  stockCode: [
+    { required: true, message: '股票代码不能为空', trigger: 'blur' },
+    { pattern: /^\d{6}$/, message: '股票代码必须是6位数字', trigger: 'blur' }
+  ],
+  stockName: [{ required: true, message: '股票名称不能为空', trigger: 'blur' }]
+};
+
 const importDialog = reactive({ visible: false });
 const importForm = ref({
   recordDate: '',
@@ -226,15 +358,98 @@ const resetQuery = () => {
 /** 多选框选中数据 */
 const handleSelectionChange = (selection: any[]) => {
   ids.value = selection.map(item => item.id);
+  single.value = selection.length !== 1;
   multiple.value = !selection.length;
 };
 
+/** 新增按钮操作 */
+const handleAdd = () => {
+  reset();
+  dialog.visible = true;
+  dialog.title = '添加历史数据';
+};
+
+/** 修改按钮操作 */
+const handleUpdate = async (row?: any) => {
+  reset();
+  const id = row?.id || ids.value[0];
+  const res = await getStockHistory(id);
+  form.value = res.data;
+  dialog.visible = true;
+  dialog.title = '修改历史数据';
+};
+
+/** 提交按钮 */
+const submitForm = () => {
+  historyFormRef.value?.validate(async (valid: boolean) => {
+    if (valid) {
+      if (form.value.id) {
+        await updateStockHistory(form.value);
+        proxy?.$modal.msgSuccess('修改成功');
+      } else {
+        await addStockHistory(form.value);
+        proxy?.$modal.msgSuccess('新增成功');
+      }
+      dialog.visible = false;
+      await getList();
+    }
+  });
+};
+
+/** 取消按钮 */
+const cancel = () => {
+  dialog.visible = false;
+  reset();
+};
+
+/** 表单重置 */
+const reset = () => {
+  form.value = {
+    id: undefined,
+    recordDate: '',
+    stockCode: '',
+    stockName: '',
+    changePercent: undefined,
+    closePrice: undefined,
+    totalAmount: undefined,
+    strengthScore: undefined,
+    circulationMarketValue: undefined,
+    mainRisePeriod: '',
+    recentRiseHand: '',
+    recentLimitUp: '',
+    dayHighestPrice: undefined,
+    dayLowestPrice: undefined,
+    dayAvgPrice: undefined,
+    dayClosePrice: undefined
+  };
+  historyFormRef.value?.resetFields();
+};
+
 /** 导入按钮操作 */
 const handleImport = () => {
   resetImportForm();
   importDialog.visible = true;
 };
 
+/** 下载模版 */
+const handleDownloadTemplate = async () => {
+  try {
+    const res = await downloadTemplate();
+    const blob = new Blob([res as any], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' });
+    const url = window.URL.createObjectURL(blob);
+    const link = document.createElement('a');
+    link.href = url;
+    link.download = '股票池历史数据导入模版.xlsx';
+    document.body.appendChild(link);
+    link.click();
+    document.body.removeChild(link);
+    window.URL.revokeObjectURL(url);
+    proxy?.$modal.msgSuccess('模版下载成功');
+  } catch (error) {
+    proxy?.$modal.msgError('模版下载失败');
+  }
+};
+
 /** 文件选择变化 */
 const handleFileChange = (file: UploadFile, files: UploadFiles) => {
   if (files.length > 0) {