Browse Source

1、前端添加工资导入按钮,及导入接口

fuwb 2 months ago
parent
commit
a482146ef7

+ 4 - 0
client/src/api/salary/index.ts

@@ -4,3 +4,7 @@ import { SalaryInfoPageDTO } from './types'
 export const getSalaryPage = async (json: SalaryInfoPageDTO) => {
   return await request.post({ url: '/salary/page', data: json }, '/business')
 }
+
+export const uploadFile = async (formData: FormData) => {
+  return await request.post({ url: '/salary/upload/file', data: formData }, '/business')
+}

+ 30 - 12
client/src/views/OaSystem/searchCenter/salary/index.vue

@@ -11,16 +11,7 @@
         <el-button plain @click="resetSearchKey">重置</el-button>
       </el-form-item>
       <el-form-item>
-        <el-upload
-          style="margin-top: 8px"
-          action=""
-          :on-preview="handlePreview"
-          :on-remove="handleRemove"
-          :before-remove="beforeRemove"
-          :on-exceed="handleExceed"
-        >
-          <el-button type="primary">上传文件</el-button>
-        </el-upload>
+        <el-button type="primary" @click="handleUpload">导入文件</el-button>
       </el-form-item>
     </el-form>
   </div>
@@ -49,6 +40,16 @@
       @current-change="handleCurrentChange"
     />
   </div>
+
+  <el-dialog v-model="uploadFileDialog" title="工资文件上传">
+    <el-upload :auto-upload="false" :limit="1" :on-change="changeFile">
+      <el-button type="primary">导入文件</el-button>
+      <template #tip>
+        <div class="el-upload__tip"> 只支持上传 xlsx 文件 </div>
+      </template>
+    </el-upload>
+    <el-button type="primary" @click="submitFile">上传文件</el-button>
+  </el-dialog>
 </template>
 
 <script lang="ts" setup>
@@ -63,7 +64,8 @@ const queryParams = reactive({
   pageSize: 10,
   isAdmin: 1
 })
-const dialogFormVisible = ref(false)
+const uploadFileDialog = ref(false)
+const file = ref()
 
 // 获取工资列表
 const salaryList = async (json) => {
@@ -73,8 +75,24 @@ const salaryList = async (json) => {
 }
 
 const handleUpload = () => {
-  dialogFormVisible.value = true
+  uploadFileDialog.value = true
+}
+
+// 选择文件
+const changeFile = (uploadFile) => {
+  file.value = uploadFile.raw
 }
+const submitFile = async () => {
+  const formData = new FormData()
+  formData.append('file', file.value)
+  formData.append('type', '参公')
+  const res = await SalaryApi.uploadFile(formData)
+  console.log(res)
+}
+
+onMounted(() => {
+  salaryList(queryParams)
+})
 </script>
 
 <style lang="scss" scoped>