a

src/views/professional/professionalpartychange/index.vue

@@ -0,0 +1,137 @@
+<template>
+  <div class="layout-padding">
+    <div class="layout-padding-auto layout-padding-view">
+      <!-- 搜索表单 -->
+      <search-form 
+        v-show="showSearch" 
+        :model="search" 
+        ref="searchFormRef"
+        @keyup-enter="handleFilter(search)"
+      >
+        <template #default="{ visible }">
+          <template v-if="visible">
+            <el-form-item label="工号" prop="teacherNo">
+              <el-input
+                v-model="search.teacherNo"
+                clearable
+                style="width: 200px"
+                placeholder="请输入工号"
+              />
+            </el-form-item>
+
+            <el-form-item label="用户名" prop="realName">
+              <el-input
+                v-model="search.realName"
+                clearable
+                style="width: 200px"
+                placeholder="请输入用户名"
+              />
+            </el-form-item>
+          </template>
+        </template>
+
+        <!-- 操作按钮 -->
+        <template #actions>
+          <el-form-item>
+            <el-button type="primary" @click="handleFilter(search)" icon="Search">查询</el-button>
+            <el-button @click="resetQuery" icon="Refresh">重置</el-button>
+          </el-form-item>
+        </template>
+      </search-form>
+
+      <!-- 表格 -->
+      <el-table
+        ref="tableRef"
+        :data="state.dataList"
+        v-loading="state.loading"
+        border
+        :cell-style="tableStyle.cellStyle"
+        :header-cell-style="tableStyle.headerCellStyle"
+      >
+        <el-table-column type="index" label="序号" width="60" align="center" />
+        
+        <el-table-column prop="teacherNo" label="工号" min-width="120" align="center" show-overflow-tooltip />
+        
+        <el-table-column prop="realName" label="用户名" min-width="120" align="center" show-overflow-tooltip />
+        
+        <el-table-column prop="oldBranchName" label="原支部名称" min-width="150" align="center" show-overflow-tooltip />
+        
+        <el-table-column prop="branchName" label="现支部名称" min-width="150" align="center" show-overflow-tooltip />
+        
+        <el-table-column prop="partyFee" label="党费" width="120" align="center">
+          <template #default="scope">
+            {{ scope.row.partyFee ? Number(scope.row.partyFee).toFixed(2) : '-' }}
+          </template>
+        </el-table-column>
+        
+        <el-table-column prop="changeTime" label="变动时间" width="180" align="center" />
+        
+        <el-table-column prop="createTime" label="创建时间" width="180" align="center" />
+        
+        <el-table-column prop="remarks" label="备注" min-width="200" align="center" show-overflow-tooltip />
+      </el-table>
+
+      <!-- 分页 -->
+      <pagination
+        v-bind="state.pagination"
+        @current-change="currentChangeHandle"
+        @size-change="sizeChangeHandle"
+      />
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref, reactive, onMounted } from 'vue'
+import { BasicTableProps, useTable } from '/@/hooks/table'
+import { fetchList } from '/@/api/professional/professionaluser/professionalpartychange'
+
+// 表格引用
+const tableRef = ref()
+const searchFormRef = ref()
+const showSearch = ref(true)
+
+// 搜索表单数据
+const search = reactive({
+  teacherNo: '',
+  realName: ''
+})
+
+// 配置 useTable
+const state: BasicTableProps = reactive<BasicTableProps>({
+  pageList: async (params: any) => {
+    const response = await fetchList(params)
+    return {
+      data: {
+        records: response.data.records || [],
+        total: response.data.total || 0
+      }
+    }
+  },
+  queryForm: search
+})
+
+const { getDataList, currentChangeHandle, sizeChangeHandle, tableStyle } = useTable(state)
+
+// 查询
+const handleFilter = () => {
+  getDataList()
+}
+
+// 重置查询
+const resetQuery = () => {
+  Object.assign(search, {
+    teacherNo: '',
+    realName: ''
+  })
+  getDataList()
+}
+
+// 初始化
+onMounted(() => {
+  getDataList()
+})
+</script>
+
+<style lang="scss" scoped>
+</style>