diff --git a/antis-ncc-admin/.env.development b/antis-ncc-admin/.env.development
index f6590fa..c236b7d 100644
--- a/antis-ncc-admin/.env.development
+++ b/antis-ncc-admin/.env.development
@@ -2,7 +2,7 @@
 
 VUE_CLI_BABEL_TRANSPILE_MODULES = true
 # VUE_APP_BASE_API = 'https://erp.lvqianmeiye.com'
-# VUE_APP_BASE_API = 'http://erp_test.lvqianmeiye.com'
-VUE_APP_BASE_API = 'http://localhost:2011'
+VUE_APP_BASE_API = 'http://erp_test.lvqianmeiye.com'
+# VUE_APP_BASE_API = 'http://localhost:2011'
 # VUE_APP_BASE_API = 'http://localhost:2011'
 VUE_APP_BASE_WSS = 'ws://192.168.110.45:2011/websocket'
diff --git a/antis-ncc-admin/src/views/lqReimbursementApplication/ExportBox.vue b/antis-ncc-admin/src/views/lqReimbursementApplication copy/ExportBox.vue
index 4fc5c07..4fc5c07 100644
--- a/antis-ncc-admin/src/views/lqReimbursementApplication/ExportBox.vue
+++ b/antis-ncc-admin/src/views/lqReimbursementApplication copy/ExportBox.vue
diff --git a/antis-ncc-admin/src/views/lqReimbursementApplication/Form.vue b/antis-ncc-admin/src/views/lqReimbursementApplication copy/Form.vue
index 0b1dce9..0b1dce9 100644
--- a/antis-ncc-admin/src/views/lqReimbursementApplication/Form.vue
+++ b/antis-ncc-admin/src/views/lqReimbursementApplication copy/Form.vue
diff --git a/antis-ncc-admin/src/views/lqReimbursementApplication/detail.vue b/antis-ncc-admin/src/views/lqReimbursementApplication copy/detail.vue
index 94335e6..94335e6 100644
--- a/antis-ncc-admin/src/views/lqReimbursementApplication/detail.vue
+++ b/antis-ncc-admin/src/views/lqReimbursementApplication copy/detail.vue
diff --git a/antis-ncc-admin/src/views/lqReimbursementApplication copy/index.vue b/antis-ncc-admin/src/views/lqReimbursementApplication copy/index.vue
new file mode 100644
index 0000000..10c0d4d
--- /dev/null
+++ b/antis-ncc-admin/src/views/lqReimbursementApplication copy/index.vue
@@ -0,0 +1,362 @@
+<template>
+	<div class="NCC-common-layout">
+		<div class="NCC-common-layout-center">
+			<el-row class="NCC-common-search-box" :gutter="16">
+				<el-form @submit.native.prevent>
+		
+					<el-col :span="6">
+						<el-form-item label="申请时间">
+							<el-date-picker v-model="query.applicationTime" type="daterange" value-format="timestamp" format="yyyy-MM-dd" start-placeholder="开始日期" end-placeholder="结束日期">
+							</el-date-picker>
+						</el-form-item>
+					</el-col>
+					<el-col :span="6">
+						<el-form-item label="申请人">
+							<userSelect v-model="query.applicationUserId" placeholder="请选择申请人" clearable />	
+						</el-form-item>
+					</el-col>
+                    <el-col :span="6">
+						<el-form-item label="门店">
+							<el-select v-model="query.applicationStoreId" placeholder="请选择门店" clearable filterable style="width: 100%">
+								<el-option
+									v-for="store in storeOptions"
+									:key="store.id"
+									:label="store.dm"
+									:value="store.id">
+								</el-option>
+							</el-select>
+						</el-form-item>
+					</el-col>
+					<template v-if="showAll">
+                        <el-col :span="6">
+                            <el-form-item label="审批状态">
+							<el-select v-model="query.approveStatus" placeholder="请选择审批状态" clearable style="width: 100%">
+								<el-option label="已审批" value="已审批"></el-option>
+                                <el-option label="未通过" value="未通过"></el-option>
+								<el-option label="未审批" value="未审批"></el-option>
+							</el-select>
+						</el-form-item>
+                        </el-col>
+                        <!-- <el-col :span="6">
+							<el-form-item label="审批时间">
+								<el-date-picker v-model="query.approveTime" type="daterange" value-format="timestamp" format="yyyy-MM-dd" start-placeholder="开始日期" end-placeholder="结束日期">
+								</el-date-picker>
+							</el-form-item>
+						</el-col> -->
+					
+					<!-- <el-col :span="6">
+						<el-form-item label="总金额">
+							<el-input v-model="query.amount" placeholder="总金额" clearable />	
+						</el-form-item>
+					</el-col> -->
+					<!-- <el-col :span="6">
+						<el-form-item label="审批人">
+							<userSelect v-model="query.approveUser" placeholder="请选择审批人" />
+						</el-form-item>
+					</el-col>
+					<el-col :span="6">
+						<el-form-item label="审批结果">
+							<el-input v-model="query.approveStatus" placeholder="审批结果" clearable />	
+						</el-form-item>
+					</el-col> -->
+					<!-- <el-col :span="6">
+						<el-form-item label="关联购买编号">
+							<el-input v-model="query.purchaseRecordsId" placeholder="关联购买编号" clearable />	
+						</el-form-item>
+					</el-col> -->
+					</template>
+					<el-col :span="6">
+						<el-form-item>
+							<el-button type="primary" icon="el-icon-search" @click="search()">查询</el-button>
+							<el-button icon="el-icon-refresh-right" @click="reset()">重置</el-button>
+							<el-button type="text" icon="el-icon-arrow-down" @click="showAll=true" v-if="!showAll">展开</el-button>
+							<el-button type="text" icon="el-icon-arrow-up" @click="showAll=false" v-else>收起</el-button>
+						</el-form-item>
+					</el-col>
+				</el-form>
+			</el-row>
+			<div class="NCC-common-layout-main NCC-flex-main">
+				<div class="NCC-common-head">
+					<div>
+						<el-button type="primary" icon="el-icon-plus" @click="addOrUpdateHandle()">新增</el-button>
+                        <el-button type="text" icon="el-icon-delete" @click="handleBatchRemoveDel()">批量删除</el-button>
+						<!-- <el-button type="text" icon="el-icon-download" @click="exportData()">导出</el-button>
+						<el-button type="text" icon="el-icon-delete" @click="handleBatchRemoveDel()">批量删除</el-button> -->
+					</div>
+					<div class="NCC-common-head-right">
+						<el-tooltip effect="dark" content="刷新" placement="top">
+							<el-link icon="icon-ym icon-ym-Refresh NCC-common-head-icon" :underline="false" @click="reset()" />
+						</el-tooltip>
+						<screenfull isContainer />
+					</div>
+				</div>
+                <NCC-table v-loading="listLoading" :data="list" has-c @selection-change="handleSelectionChange">
+					<!-- <el-table-column prop="id" label="申请编号" align="left" /> -->
+					<!-- <el-table-column prop="applicationUserId" label="申请人编号" align="left" /> -->
+					<el-table-column prop="applicationUserName" label="申请人" align="left" />
+					<el-table-column prop="applicationStoreId" label="门店" align="left">
+						<template slot-scope="scope">
+							<div class="store-info">
+								<i class="el-icon-shop"></i>
+								<span>{{ getStoreName(scope.row.applicationStoreId) || '无' }}</span>
+							</div>
+						</template>
+					</el-table-column>
+					<el-table-column prop="applicationTime" label="申请时间" align="left" :formatter="ncc.tableDateFormat" />
+					<el-table-column prop="amount" label="总金额" align="left" />
+                    <el-table-column prop="approveStatus" label="审批状态" align="left"/>
+					<el-table-column prop="approveTime" label="审批时间" align="left" :formatter="ncc.tableDateFormat" />
+					<!-- <el-table-column prop="approveUser" label="审批人" align="left" />
+					<el-table-column prop="approveStatus" label="审批结果" align="left" /> -->
+					<!-- <el-table-column prop="purchaseRecordsId" label="关联购买编号" align="left" /> -->
+					<el-table-column label="操作" fixed="right" width="100">
+							<template slot-scope="scope">
+							<el-button type="text" v-if="scope.row.approveStatus === '未审批'" @click="addOrUpdateHandle(scope.row.id)" >编辑</el-button>
+							<el-button type="text" v-if="scope.row.approveStatus === '已审批'" @click="showDetail(scope.row.id)" >查看</el-button>
+                            <!-- <el-button type="text" v-if="scope.row.approveStatus === '未审批'" @click="handleDel(scope.row.id)" class="NCC-table-delBtn" >删除</el-button> -->
+						</template>
+					</el-table-column>
+				</NCC-table>
+                <pagination :total="total" :page.sync="listQuery.currentPage" :limit.sync="listQuery.pageSize" @pagination="initData" />
+            </div>
+        </div>
+		<NCC-Form v-if="formVisible" ref="NCCForm" @refresh="refresh" />
+		<ExportBox v-if="exportBoxVisible" ref="ExportBox" @download="download" />
+		<DetailDialog v-if="detailVisible" ref="DetailDialog" @close="handleDetailClose" />
+	</div>
+</template>
+<script>
+    import request from '@/utils/request'
+    import { getDictionaryDataSelector } from '@/api/systemData/dictionary'
+    import { getStoreSelector } from '@/api/extend/store'
+    import NCCForm from './Form'
+    import ExportBox from './ExportBox'
+    import DetailDialog from './detail'
+    import { previewDataInterface } from '@/api/systemData/dataInterface'
+	export default {
+        components: { NCCForm, ExportBox, DetailDialog },
+        data() {
+            return {
+                showAll: false,
+                storeOptions: [],
+                storeMap: {},
+                detailVisible: false,
+				query: {
+                    id:undefined,
+                    applicationUserId:undefined,
+                    applicationUserName:undefined,
+                    applicationStoreId:undefined,
+                    applicationTime:undefined,
+                    amount:undefined,
+                    approveUser:undefined,
+                    approveStatus:undefined,
+                    approveTime:undefined,
+                    purchaseRecordsId:undefined,
+				},
+                list: [],
+                listLoading: true,
+                multipleSelection: [], total: 0,
+                listQuery: {
+                    currentPage: 1,
+                    pageSize: 20,
+					sort: "desc",
+                    sidx: "",
+                },
+                formVisible: false,
+                exportBoxVisible: false,
+                columnList: [
+                    { prop: 'id', label: '申请编号' },
+                    { prop: 'applicationUserId', label: '申请人编号' },
+                    { prop: 'applicationUserName', label: '申请人姓名' },
+                    { prop: 'applicationStoreId', label: '申请门店' },
+                    { prop: 'applicationTime', label: '申请时间' },
+                    { prop: 'amount', label: '总金额' },
+                    { prop: 'approveUser', label: '审批人' },
+                    { prop: 'approveStatus', label: '审批结果' },
+                    { prop: 'approveTime', label: '审批时间' },
+                    { prop: 'purchaseRecordsId', label: '关联购买编号' },
+				],
+			}
+        },
+		computed: {},
+		created() {
+			this.loadStoreOptions()
+			this.initData()
+		},
+		methods: {
+            		// 加载门店列表
+			loadStoreOptions() {
+				request({
+					url: '/api/Extend/LqMdxx',
+					method: 'GET',
+					data: {
+						currentPage: 1,
+						pageSize: 1000
+					}
+				}).then(res => {
+					if (res.data && res.data.list) {
+						this.storeOptions = res.data.list;
+					}
+				}).catch(() => {
+					this.storeOptions = [];
+				});
+			},
+	
+			getStoreName(storeId) {
+				if (!storeId) return '无';
+				const store = this.storeOptions.find(item => item.id === storeId);
+				return store ? store.dm : '无';
+			},
+			initData() {
+                this.listLoading = true;
+                let _query = {
+                    ...this.listQuery,
+                    ...this.query
+                };
+                let query = {}
+                for (let key in _query) {
+                    if (Array.isArray(_query[key])) {
+                        query[key] = _query[key].join()
+                    } else {
+                        query[key] = _query[key]
+                    }
+                }
+                request({
+                    url: `/api/Extend/LqReimbursementApplication`,
+                    method: 'GET',
+                    data: query
+                }).then(res => {
+                    this.list = res.data.list
+                    this.total = res.data.pagination.total
+                    this.listLoading = false
+                })
+            },
+			handleDel(id) {
+                this.$confirm('此操作将永久删除该数据, 是否继续?', '提示', {
+                    type: 'warning'
+                }).then(() => {
+                    request({
+                        url: `/api/Extend/LqReimbursementApplication/${id}`,
+                        method: 'DELETE'
+                    }).then(res => {
+                        this.$message({
+                            type: 'success',
+                            message: res.msg,
+                            onClose: () => {
+                                this.initData()
+                            }
+                        });
+                    })
+                }).catch(() => {
+                });
+            },
+			handleSelectionChange(val) {
+                const res = val.map(item => item.id)
+                this.multipleSelection = res
+            },
+            handleBatchRemoveDel() {
+                if (!this.multipleSelection.length) {
+                    this.$message({
+                        type: 'error',
+                        message: '请选择一条数据',
+                        duration: 1500,
+                    })
+                    return
+                }
+                const ids = this.multipleSelection
+                this.$confirm('您确定要删除这些数据吗, 是否继续？', '提示', {
+                    type: 'warning'
+                }).then(() => {
+                    request({
+                        url: `/api/Extend/LqReimbursementApplication/batchRemove`,
+                        method: 'POST',
+                        data: ids ,
+                    }).then(res => {
+                        this.$message({
+                            type: 'success',
+                            message: res.msg,
+                            onClose: () => {
+                                this.initData()
+                            }
+                        });
+                    })
+                }).catch(() => { })
+            },
+			addOrUpdateHandle(id, isDetail) {
+                this.formVisible = true
+                this.$nextTick(() => {
+                    this.$refs.NCCForm.init(id, isDetail)
+                })
+            },
+			exportData() {
+                this.exportBoxVisible = true
+                this.$nextTick(() => {
+                    this.$refs.ExportBox.init(this.columnList)
+                })
+            },
+            download(data) {
+                let query = { ...data, ...this.listQuery, ...this.query }
+                request({
+                    url: `/api/Extend/LqReimbursementApplication/Actions/Export`,
+                    method: 'GET',
+                    data: query
+                }).then(res => {
+                    if (!res.data.url) return
+                    window.location.href = this.define.comUrl + res.data.url
+                    this.$refs.ExportBox.visible = false
+                    this.exportBoxVisible = false
+                })
+            },
+			search() {
+                this.listQuery = {
+                    currentPage: 1,
+                    pageSize: 20,
+                    sort: "desc",
+                    sidx: "",
+                }
+                this.initData()
+            },
+            refresh(isrRefresh) {
+                this.formVisible = false
+                if (isrRefresh) this.reset()
+            },
+            reset() {
+                for (let key in this.query) {
+                    this.query[key] = undefined
+                }
+                this.listQuery = {
+                    currentPage: 1,
+                    pageSize: 20,
+                    sort: "desc",
+                    sidx: "",
+                }
+                this.initData()
+            },
+            showDetail(id) {
+                this.detailVisible = true
+                this.$nextTick(() => {
+                    this.$refs.DetailDialog.init(id)
+                })
+            },
+            handleDetailClose() {
+                this.detailVisible = false
+            }
+		}
+    }
+</script>
+<style lang="scss" scoped>
+.store-info {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+
+  i {
+    color: #67C23A;
+    font-size: 14px;
+  }
+
+  span {
+    color: #303133;
+  }
+}
+</style>
\ No newline at end of file
diff --git a/antis-ncc-admin/src/views/lqReimbursementApplication/approval-history-dialog.vue b/antis-ncc-admin/src/views/lqReimbursementApplication/approval-history-dialog.vue
new file mode 100644
index 0000000..711b8cf
--- /dev/null
+++ b/antis-ncc-admin/src/views/lqReimbursementApplication/approval-history-dialog.vue
@@ -0,0 +1,217 @@
+<template>
+  <el-dialog 
+    title="审批历史" 
+    :visible.sync="visible" 
+    :close-on-click-modal="false"
+    class="NCC-dialog NCC-dialog_center" 
+    width="900px"
+    @close="handleClose"
+  >
+    <div class="history-content" v-loading="loading">
+      <el-timeline v-if="historyList && historyList.length > 0">
+        <el-timeline-item
+          v-for="(item, index) in historyList"
+          :key="index"
+          :timestamp="formatDateTime(item.approvalTime)"
+          placement="top"
+          :type="getTimelineType(item.approvalResult)"
+          :icon="getTimelineIcon(item.approvalResult)"
+        >
+          <el-card class="history-card">
+            <div class="history-header">
+              <div class="history-node-info">
+                <span class="node-name">{{ item.nodeName || '无' }}</span>
+                <el-tag size="small" type="info">第{{ item.nodeOrder }}节点</el-tag>
+              </div>
+              <el-tag 
+                :type="getRecordType(item.approvalResult)"
+                size="medium"
+              >
+                {{ item.approvalResult || '无' }}
+              </el-tag>
+            </div>
+            <div class="history-body">
+              <div class="history-item">
+                <span class="history-label">审批人：</span>
+                <span class="history-value">{{ item.approverName || '无' }}</span>
+              </div>
+              <div class="history-item" v-if="item.approvalOpinion">
+                <span class="history-label">审批意见：</span>
+                <span class="history-value">{{ item.approvalOpinion }}</span>
+              </div>
+              <div class="history-item" v-if="item.approvalTime">
+                <span class="history-label">审批时间：</span>
+                <span class="history-value">{{ formatDateTime(item.approvalTime) }}</span>
+              </div>
+            </div>
+          </el-card>
+        </el-timeline-item>
+      </el-timeline>
+      <el-empty v-else description="暂无审批历史" :image-size="120" />
+    </div>
+    <span slot="footer" class="dialog-footer">
+      <el-button @click="visible = false">关 闭</el-button>
+    </span>
+  </el-dialog>
+</template>
+
+<script>
+import request from '@/utils/request'
+
+export default {
+  name: 'ApprovalHistoryDialog',
+  data() {
+    return {
+      visible: false,
+      loading: false,
+      historyList: []
+    }
+  },
+  methods: {
+    init(id) {
+      this.visible = true
+      this.loading = true
+      this.historyList = []
+      this.getHistory(id)
+    },
+
+    async getHistory(id) {
+      try {
+        const response = await request({
+          url: `/api/Extend/LqReimbursementApplication/${id}/Actions/ApprovalHistory`,
+          method: 'GET'
+        })
+
+        if (response.code === 200) {
+          this.historyList = response.data || []
+        } else {
+          this.$message.error(response.msg || '获取审批历史失败')
+          this.historyList = []
+        }
+      } catch (error) {
+        console.error('获取审批历史失败:', error)
+        this.$message.error('获取审批历史失败')
+        this.historyList = []
+      } finally {
+        this.loading = false
+      }
+    },
+
+    handleClose() {
+      this.visible = false
+      this.historyList = []
+    },
+
+    formatDateTime(dateTime) {
+      if (!dateTime) return '无'
+      // 如果是时间戳（数字），需要转换
+      if (typeof dateTime === 'number') {
+        const date = new Date(dateTime)
+        const year = date.getFullYear()
+        const month = String(date.getMonth() + 1).padStart(2, '0')
+        const day = String(date.getDate()).padStart(2, '0')
+        const hours = String(date.getHours()).padStart(2, '0')
+        const minutes = String(date.getMinutes()).padStart(2, '0')
+        const seconds = String(date.getSeconds()).padStart(2, '0')
+        return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`
+      }
+      // 如果是字符串，直接返回
+      const date = new Date(dateTime)
+      if (isNaN(date.getTime())) return dateTime
+      const year = date.getFullYear()
+      const month = String(date.getMonth() + 1).padStart(2, '0')
+      const day = String(date.getDate()).padStart(2, '0')
+      const hours = String(date.getHours()).padStart(2, '0')
+      const minutes = String(date.getMinutes()).padStart(2, '0')
+      const seconds = String(date.getSeconds()).padStart(2, '0')
+      return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`
+    },
+
+    getRecordType(result) {
+      const typeMap = {
+        '待审批': 'info',
+        '通过': 'success',
+        '不通过': 'danger',
+        '退回': 'warning'
+      }
+      return typeMap[result] || ''
+    },
+
+    getTimelineType(result) {
+      const typeMap = {
+        '待审批': '',
+        '通过': 'success',
+        '不通过': 'danger',
+        '退回': 'warning'
+      }
+      return typeMap[result] || ''
+    },
+
+    getTimelineIcon(result) {
+      const iconMap = {
+        '待审批': 'el-icon-time',
+        '通过': 'el-icon-check',
+        '不通过': 'el-icon-close',
+        '退回': 'el-icon-back'
+      }
+      return iconMap[result] || 'el-icon-time'
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.history-content {
+  max-height: 70vh;
+  overflow-y: auto;
+  padding: 20px 0;
+}
+
+.history-card {
+  margin-bottom: 8px;
+
+  .history-header {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    margin-bottom: 12px;
+
+    .history-node-info {
+      display: flex;
+      align-items: center;
+      gap: 8px;
+
+      .node-name {
+        font-weight: 600;
+        color: #303133;
+        font-size: 16px;
+      }
+    }
+  }
+
+  .history-body {
+    .history-item {
+      margin-bottom: 8px;
+      display: flex;
+      align-items: flex-start;
+
+      &:last-child {
+        margin-bottom: 0;
+      }
+
+      .history-label {
+        min-width: 80px;
+        color: #606266;
+        font-weight: 500;
+      }
+
+      .history-value {
+        color: #303133;
+        flex: 1;
+        word-break: break-all;
+      }
+    }
+  }
+}
+</style>
+
diff --git a/antis-ncc-admin/src/views/lqReimbursementApplication/detail-dialog.vue b/antis-ncc-admin/src/views/lqReimbursementApplication/detail-dialog.vue
new file mode 100644
index 0000000..61cd0a1
--- /dev/null
+++ b/antis-ncc-admin/src/views/lqReimbursementApplication/detail-dialog.vue
@@ -0,0 +1,579 @@
+<template>
+  <el-dialog 
+    title="报销申请详情" 
+    :visible.sync="visible" 
+    :close-on-click-modal="false"
+    class="NCC-dialog NCC-dialog_center" 
+    width="1200px"
+    @close="handleClose"
+  >
+    <div class="detail-content" v-loading="loading">
+      <!-- 表单信息卡片 -->
+      <el-card class="info-card" shadow="hover" v-if="formData">
+        <div slot="header" class="card-header">
+          <i class="el-icon-document"></i>
+          <span class="card-title">申请信息</span>
+        </div>
+        <el-row :gutter="20">
+          <el-col :span="8">
+            <div class="info-item">
+              <label class="info-label">申请编号：</label>
+              <span class="info-value">{{ formData.id || '无' }}</span>
+            </div>
+          </el-col>
+          <el-col :span="8">
+            <div class="info-item">
+              <label class="info-label">申请人编号：</label>
+              <span class="info-value">{{ formData.applicationUserId || '无' }}</span>
+            </div>
+          </el-col>
+          <el-col :span="8">
+            <div class="info-item">
+              <label class="info-label">申请人姓名：</label>
+              <span class="info-value">{{ formData.applicationUserName || '无' }}</span>
+            </div>
+          </el-col>
+          <el-col :span="8">
+            <div class="info-item">
+              <label class="info-label">申请门店ID：</label>
+              <span class="info-value">{{ formData.applicationStoreId || '无' }}</span>
+            </div>
+          </el-col>
+          <el-col :span="8">
+            <div class="info-item">
+              <label class="info-label">申请时间：</label>
+              <span class="info-value">{{ formatDateTime(formData.applicationTime) || '无' }}</span>
+            </div>
+          </el-col>
+          <el-col :span="8">
+            <div class="info-item">
+              <label class="info-label">总金额：</label>
+              <span class="info-value amount">{{ formatMoney(formData.amount) || '无' }}</span>
+            </div>
+          </el-col>
+          <el-col :span="8">
+            <div class="info-item">
+              <label class="info-label">审批状态：</label>
+              <el-tag 
+                :type="getStatusType(formData.approveStatus)"
+                size="small"
+              >
+                {{ formData.approveStatus || '无' }}
+              </el-tag>
+            </div>
+          </el-col>
+          <el-col :span="8">
+            <div class="info-item">
+              <label class="info-label">购买记录编号：</label>
+              <span class="info-value">{{ formData.purchaseRecordsId || '无' }}</span>
+            </div>
+          </el-col>
+        </el-row>
+      </el-card>
+
+      <!-- 审批流程卡片 -->
+      <el-card class="info-card" shadow="hover" v-if="nodes && nodes.length > 0">
+        <div slot="header" class="card-header">
+          <i class="el-icon-s-order"></i>
+          <span class="card-title">审批流程</span>
+        </div>
+        <div class="approval-flow">
+          <div 
+            v-for="(node, index) in nodes" 
+            :key="node.nodeId" 
+            class="flow-node"
+            :class="{
+              'node-active': node.nodeOrder === currentNodeOrder,
+              'node-completed': node.nodeOrder < currentNodeOrder,
+              'node-pending': node.nodeOrder > currentNodeOrder
+            }"
+          >
+            <div class="node-header">
+              <div class="node-order">{{ node.nodeOrder }}</div>
+              <div class="node-info">
+                <div class="node-name">{{ node.nodeName || '无' }}</div>
+                <div class="node-type">
+                  <el-tag size="mini" :type="node.approvalType === '会签' ? 'success' : 'warning'">
+                    {{ node.approvalType || '无' }}
+                  </el-tag>
+                  <el-tag size="mini" type="info" v-if="node.isRequired === 1">必审</el-tag>
+                </div>
+              </div>
+            </div>
+            
+            <!-- 审批人列表 -->
+            <div class="approvers-list">
+              <div class="approvers-label">审批人：</div>
+              <div class="approvers-items">
+                <el-tag 
+                  v-for="approver in node.approvers" 
+                  :key="approver.userId"
+                  size="small"
+                  style="margin-right: 8px; margin-bottom: 4px;"
+                >
+                  {{ approver.userName || '无' }}
+                </el-tag>
+              </div>
+            </div>
+
+            <!-- 审批记录 -->
+            <div class="approval-records" v-if="node.approvalRecords && node.approvalRecords.length > 0">
+              <div class="records-label">审批记录：</div>
+              <div class="records-list">
+                <div 
+                  v-for="(record, recordIndex) in node.approvalRecords" 
+                  :key="recordIndex"
+                  class="record-item"
+                >
+                  <div class="record-header">
+                    <span class="record-approver">{{ record.approverName || '无' }}</span>
+                    <el-tag 
+                      size="mini" 
+                      :type="getRecordType(record.approvalResult)"
+                    >
+                      {{ record.approvalResult || '无' }}
+                    </el-tag>
+                  </div>
+                  <div class="record-opinion" v-if="record.approvalOpinion">
+                    意见：{{ record.approvalOpinion }}
+                  </div>
+                  <div class="record-time" v-if="record.approvalTime">
+                    时间：{{ formatDateTime(record.approvalTime) }}
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </el-card>
+
+      <!-- 当前审批人信息 -->
+      <el-card class="info-card" shadow="hover" v-if="currentApprovers && currentApprovers.length > 0">
+        <div slot="header" class="card-header">
+          <i class="el-icon-user-solid"></i>
+          <span class="card-title">当前审批人</span>
+        </div>
+        <div class="current-approvers">
+          <el-tag 
+            v-for="approver in currentApprovers" 
+            :key="approver.userId"
+            type="warning"
+            size="medium"
+            style="margin-right: 8px;"
+          >
+            {{ approver.userName || '无' }}
+          </el-tag>
+        </div>
+      </el-card>
+
+      <!-- 退回原因 -->
+      <el-card class="info-card" shadow="hover" v-if="returnedReason">
+        <div slot="header" class="card-header">
+          <i class="el-icon-warning"></i>
+          <span class="card-title">退回原因</span>
+        </div>
+        <div class="returned-reason">
+          {{ returnedReason }}
+        </div>
+      </el-card>
+
+      <!-- 审批操作区域 -->
+      <el-card class="info-card" shadow="hover" v-if="canApprove">
+        <div slot="header" class="card-header">
+          <i class="el-icon-edit"></i>
+          <span class="card-title">审批操作</span>
+        </div>
+        <el-form :model="approvalForm" label-width="100px" label-position="right">
+          <el-form-item label="审批结果" required>
+            <el-radio-group v-model="approvalForm.result">
+              <el-radio label="通过">通过</el-radio>
+              <el-radio label="不通过">不通过</el-radio>
+              <el-radio label="退回">退回</el-radio>
+            </el-radio-group>
+          </el-form-item>
+          <el-form-item label="审批意见">
+            <el-input 
+              v-model="approvalForm.opinion" 
+              type="textarea" 
+              :rows="4"
+              placeholder="请输入审批意见"
+            />
+          </el-form-item>
+        </el-form>
+      </el-card>
+    </div>
+    <span slot="footer" class="dialog-footer">
+      <el-button @click="visible = false">关 闭</el-button>
+      <el-button 
+        type="primary" 
+        @click="handleApprove"
+        :loading="approving"
+        v-if="canApprove"
+      >
+        提交审批
+      </el-button>
+    </span>
+  </el-dialog>
+</template>
+
+<script>
+import request from '@/utils/request'
+
+export default {
+  name: 'DetailDialog',
+  data() {
+    return {
+      visible: false,
+      loading: false,
+      approving: false,
+      formData: null,
+      nodes: [],
+      currentApprovers: [],
+      currentNodeOrder: 0,
+      approvalStatus: '',
+      returnedReason: null,
+      approvalForm: {
+        result: '通过',
+        opinion: ''
+      }
+    }
+  },
+  computed: {
+    canApprove() {
+      // 判断是否可以审批：状态为"审批中"且当前用户是当前审批人
+      if (this.approvalStatus !== '审批中') {
+        return false
+      }
+      // 这里可以根据实际登录用户信息判断
+      // 暂时返回true，实际应该判断当前登录用户是否在currentApprovers中
+      return true
+    }
+  },
+  methods: {
+    init(id) {
+      this.visible = true
+      this.loading = true
+      this.formData = null
+      this.nodes = []
+      this.currentApprovers = []
+      this.currentNodeOrder = 0
+      this.approvalStatus = ''
+      this.returnedReason = null
+      this.approvalForm = {
+        result: '通过',
+        opinion: ''
+      }
+      this.getDetail(id)
+    },
+
+    async getDetail(id) {
+      try {
+        const response = await request({
+          url: `/api/Extend/LqReimbursementApplication/${id}`,
+          method: 'GET'
+        })
+
+        if (response.code === 200 && response.data) {
+          this.formData = response.data.form || null
+          this.nodes = response.data.nodes || []
+          this.currentApprovers = response.data.currentApprovers || []
+          this.currentNodeOrder = response.data.currentNodeOrder || 0
+          this.approvalStatus = response.data.approvalStatus || ''
+          this.returnedReason = response.data.returnedReason || null
+        } else {
+          this.$message.error(response.msg || '获取详情失败')
+        }
+      } catch (error) {
+        console.error('获取详情失败:', error)
+        this.$message.error('获取详情失败')
+      } finally {
+        this.loading = false
+      }
+    },
+
+    async handleApprove() {
+      if (!this.approvalForm.result) {
+        this.$message.warning('请选择审批结果')
+        return
+      }
+
+      this.approving = true
+      try {
+        const response = await request({
+          url: `/api/Extend/LqReimbursementApplication/${this.formData.id}/Actions/Approve`,
+          method: 'POST',
+          data: {
+            result: this.approvalForm.result,
+            opinion: this.approvalForm.opinion || ''
+          }
+        })
+
+        if (response.code === 200) {
+          this.$message.success('审批成功')
+          this.visible = false
+          this.$emit('refresh')
+        } else {
+          this.$message.error(response.msg || '审批失败')
+        }
+      } catch (error) {
+        console.error('审批失败:', error)
+        this.$message.error('审批失败')
+      } finally {
+        this.approving = false
+      }
+    },
+
+    handleClose() {
+      this.visible = false
+      this.formData = null
+      this.nodes = []
+      this.currentApprovers = []
+      this.currentNodeOrder = 0
+      this.approvalStatus = ''
+      this.returnedReason = null
+      this.approvalForm = {
+        result: '通过',
+        opinion: ''
+      }
+    },
+
+    formatMoney(amount) {
+      if (!amount) return '无'
+      return `¥${Number(amount).toLocaleString('zh-CN', {
+        minimumFractionDigits: 2,
+        maximumFractionDigits: 2
+      })}`
+    },
+
+    formatDateTime(dateTime) {
+      if (!dateTime) return '无'
+      // 如果是时间戳（数字），需要转换
+      if (typeof dateTime === 'number') {
+        const date = new Date(dateTime)
+        const year = date.getFullYear()
+        const month = String(date.getMonth() + 1).padStart(2, '0')
+        const day = String(date.getDate()).padStart(2, '0')
+        const hours = String(date.getHours()).padStart(2, '0')
+        const minutes = String(date.getMinutes()).padStart(2, '0')
+        const seconds = String(date.getSeconds()).padStart(2, '0')
+        return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`
+      }
+      // 如果是字符串，直接返回
+      const date = new Date(dateTime)
+      if (isNaN(date.getTime())) return dateTime
+      const year = date.getFullYear()
+      const month = String(date.getMonth() + 1).padStart(2, '0')
+      const day = String(date.getDate()).padStart(2, '0')
+      const hours = String(date.getHours()).padStart(2, '0')
+      const minutes = String(date.getMinutes()).padStart(2, '0')
+      const seconds = String(date.getSeconds()).padStart(2, '0')
+      return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`
+    },
+
+    getStatusType(status) {
+      const statusMap = {
+        '待审批': 'info',
+        '审批中': 'warning',
+        '已通过': 'success',
+        '未通过': 'danger',
+        '已退回': 'warning'
+      }
+      return statusMap[status] || ''
+    },
+
+    getRecordType(result) {
+      const typeMap = {
+        '待审批': 'info',
+        '通过': 'success',
+        '不通过': 'danger',
+        '退回': 'warning'
+      }
+      return typeMap[result] || ''
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.detail-content {
+  max-height: 70vh;
+  overflow-y: auto;
+}
+
+.info-card {
+  margin-bottom: 20px;
+
+  .card-header {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    font-weight: 600;
+    color: #303133;
+
+    i {
+      font-size: 18px;
+      color: #409EFF;
+    }
+  }
+
+  .info-item {
+    margin-bottom: 16px;
+    display: flex;
+    align-items: center;
+
+    .info-label {
+      min-width: 120px;
+      color: #606266;
+      font-weight: 500;
+    }
+
+    .info-value {
+      color: #303133;
+      flex: 1;
+
+      &.amount {
+        color: #F56C6C;
+        font-weight: 600;
+        font-size: 16px;
+      }
+    }
+  }
+}
+
+.approval-flow {
+  .flow-node {
+    margin-bottom: 24px;
+    padding: 16px;
+    border: 1px solid #e4e7ed;
+    border-radius: 8px;
+    background: #fafafa;
+    transition: all 0.3s;
+
+    &.node-active {
+      border-color: #409EFF;
+      background: #ecf5ff;
+    }
+
+    &.node-completed {
+      border-color: #67C23A;
+      background: #f0f9ff;
+    }
+
+    &.node-pending {
+      border-color: #e4e7ed;
+      background: #fafafa;
+      opacity: 0.6;
+    }
+
+    .node-header {
+      display: flex;
+      align-items: center;
+      margin-bottom: 12px;
+
+      .node-order {
+        width: 32px;
+        height: 32px;
+        line-height: 32px;
+        text-align: center;
+        background: #409EFF;
+        color: #fff;
+        border-radius: 50%;
+        font-weight: 600;
+        margin-right: 12px;
+      }
+
+      .node-info {
+        flex: 1;
+
+        .node-name {
+          font-size: 16px;
+          font-weight: 600;
+          color: #303133;
+          margin-bottom: 8px;
+        }
+
+        .node-type {
+          display: flex;
+          gap: 8px;
+        }
+      }
+    }
+
+    .approvers-list {
+      margin-bottom: 12px;
+      display: flex;
+      align-items: flex-start;
+
+      .approvers-label {
+        min-width: 80px;
+        color: #606266;
+        font-weight: 500;
+      }
+
+      .approvers-items {
+        flex: 1;
+      }
+    }
+
+    .approval-records {
+      margin-top: 12px;
+      padding-top: 12px;
+      border-top: 1px solid #e4e7ed;
+
+      .records-label {
+        color: #606266;
+        font-weight: 500;
+        margin-bottom: 8px;
+      }
+
+      .records-list {
+        .record-item {
+          padding: 8px;
+          margin-bottom: 8px;
+          background: #fff;
+          border-radius: 4px;
+          border-left: 3px solid #409EFF;
+
+          .record-header {
+            display: flex;
+            justify-content: space-between;
+            align-items: center;
+            margin-bottom: 4px;
+
+            .record-approver {
+              font-weight: 500;
+              color: #303133;
+            }
+          }
+
+          .record-opinion {
+            color: #606266;
+            font-size: 14px;
+            margin-bottom: 4px;
+          }
+
+          .record-time {
+            color: #909399;
+            font-size: 12px;
+          }
+        }
+      }
+    }
+  }
+}
+
+.current-approvers {
+  padding: 12px;
+  background: #fff3cd;
+  border-radius: 4px;
+}
+
+.returned-reason {
+  padding: 12px;
+  background: #fef0f0;
+  border-radius: 4px;
+  color: #F56C6C;
+  line-height: 1.6;
+}
+</style>
+
diff --git a/antis-ncc-admin/src/views/lqReimbursementApplication/index.vue b/antis-ncc-admin/src/views/lqReimbursementApplication/index.vue
index 10c0d4d..b3423e0 100644
--- a/antis-ncc-admin/src/views/lqReimbursementApplication/index.vue
+++ b/antis-ncc-admin/src/views/lqReimbursementApplication/index.vue
@@ -1,362 +1,653 @@
-<template>
-	<div class="NCC-common-layout">
-		<div class="NCC-common-layout-center">
-			<el-row class="NCC-common-search-box" :gutter="16">
-				<el-form @submit.native.prevent>
-		
-					<el-col :span="6">
-						<el-form-item label="申请时间">
-							<el-date-picker v-model="query.applicationTime" type="daterange" value-format="timestamp" format="yyyy-MM-dd" start-placeholder="开始日期" end-placeholder="结束日期">
-							</el-date-picker>
-						</el-form-item>
-					</el-col>
-					<el-col :span="6">
-						<el-form-item label="申请人">
-							<userSelect v-model="query.applicationUserId" placeholder="请选择申请人" clearable />	
-						</el-form-item>
-					</el-col>
-                    <el-col :span="6">
-						<el-form-item label="门店">
-							<el-select v-model="query.applicationStoreId" placeholder="请选择门店" clearable filterable style="width: 100%">
-								<el-option
-									v-for="store in storeOptions"
-									:key="store.id"
-									:label="store.dm"
-									:value="store.id">
-								</el-option>
-							</el-select>
-						</el-form-item>
-					</el-col>
-					<template v-if="showAll">
-                        <el-col :span="6">
-                            <el-form-item label="审批状态">
-							<el-select v-model="query.approveStatus" placeholder="请选择审批状态" clearable style="width: 100%">
-								<el-option label="已审批" value="已审批"></el-option>
-                                <el-option label="未通过" value="未通过"></el-option>
-								<el-option label="未审批" value="未审批"></el-option>
-							</el-select>
-						</el-form-item>
-                        </el-col>
-                        <!-- <el-col :span="6">
-							<el-form-item label="审批时间">
-								<el-date-picker v-model="query.approveTime" type="daterange" value-format="timestamp" format="yyyy-MM-dd" start-placeholder="开始日期" end-placeholder="结束日期">
-								</el-date-picker>
-							</el-form-item>
-						</el-col> -->
-					
-					<!-- <el-col :span="6">
-						<el-form-item label="总金额">
-							<el-input v-model="query.amount" placeholder="总金额" clearable />	
-						</el-form-item>
-					</el-col> -->
-					<!-- <el-col :span="6">
-						<el-form-item label="审批人">
-							<userSelect v-model="query.approveUser" placeholder="请选择审批人" />
-						</el-form-item>
-					</el-col>
-					<el-col :span="6">
-						<el-form-item label="审批结果">
-							<el-input v-model="query.approveStatus" placeholder="审批结果" clearable />	
-						</el-form-item>
-					</el-col> -->
-					<!-- <el-col :span="6">
-						<el-form-item label="关联购买编号">
-							<el-input v-model="query.purchaseRecordsId" placeholder="关联购买编号" clearable />	
-						</el-form-item>
-					</el-col> -->
-					</template>
-					<el-col :span="6">
-						<el-form-item>
-							<el-button type="primary" icon="el-icon-search" @click="search()">查询</el-button>
-							<el-button icon="el-icon-refresh-right" @click="reset()">重置</el-button>
-							<el-button type="text" icon="el-icon-arrow-down" @click="showAll=true" v-if="!showAll">展开</el-button>
-							<el-button type="text" icon="el-icon-arrow-up" @click="showAll=false" v-else>收起</el-button>
-						</el-form-item>
-					</el-col>
-				</el-form>
-			</el-row>
-			<div class="NCC-common-layout-main NCC-flex-main">
-				<div class="NCC-common-head">
-					<div>
-						<el-button type="primary" icon="el-icon-plus" @click="addOrUpdateHandle()">新增</el-button>
-                        <el-button type="text" icon="el-icon-delete" @click="handleBatchRemoveDel()">批量删除</el-button>
-						<!-- <el-button type="text" icon="el-icon-download" @click="exportData()">导出</el-button>
-						<el-button type="text" icon="el-icon-delete" @click="handleBatchRemoveDel()">批量删除</el-button> -->
-					</div>
-					<div class="NCC-common-head-right">
-						<el-tooltip effect="dark" content="刷新" placement="top">
-							<el-link icon="icon-ym icon-ym-Refresh NCC-common-head-icon" :underline="false" @click="reset()" />
-						</el-tooltip>
-						<screenfull isContainer />
-					</div>
-				</div>
-                <NCC-table v-loading="listLoading" :data="list" has-c @selection-change="handleSelectionChange">
-					<!-- <el-table-column prop="id" label="申请编号" align="left" /> -->
-					<!-- <el-table-column prop="applicationUserId" label="申请人编号" align="left" /> -->
-					<el-table-column prop="applicationUserName" label="申请人" align="left" />
-					<el-table-column prop="applicationStoreId" label="门店" align="left">
-						<template slot-scope="scope">
-							<div class="store-info">
-								<i class="el-icon-shop"></i>
-								<span>{{ getStoreName(scope.row.applicationStoreId) || '无' }}</span>
-							</div>
-						</template>
-					</el-table-column>
-					<el-table-column prop="applicationTime" label="申请时间" align="left" :formatter="ncc.tableDateFormat" />
-					<el-table-column prop="amount" label="总金额" align="left" />
-                    <el-table-column prop="approveStatus" label="审批状态" align="left"/>
-					<el-table-column prop="approveTime" label="审批时间" align="left" :formatter="ncc.tableDateFormat" />
-					<!-- <el-table-column prop="approveUser" label="审批人" align="left" />
-					<el-table-column prop="approveStatus" label="审批结果" align="left" /> -->
-					<!-- <el-table-column prop="purchaseRecordsId" label="关联购买编号" align="left" /> -->
-					<el-table-column label="操作" fixed="right" width="100">
-							<template slot-scope="scope">
-							<el-button type="text" v-if="scope.row.approveStatus === '未审批'" @click="addOrUpdateHandle(scope.row.id)" >编辑</el-button>
-							<el-button type="text" v-if="scope.row.approveStatus === '已审批'" @click="showDetail(scope.row.id)" >查看</el-button>
-                            <!-- <el-button type="text" v-if="scope.row.approveStatus === '未审批'" @click="handleDel(scope.row.id)" class="NCC-table-delBtn" >删除</el-button> -->
-						</template>
-					</el-table-column>
-				</NCC-table>
-                <pagination :total="total" :page.sync="listQuery.currentPage" :limit.sync="listQuery.pageSize" @pagination="initData" />
+<template>
+  <div class="app-container">
+    <!-- 页面头部 -->
+    <div class="page-header">
+      <div class="header-left">
+        <h2>报销申请管理</h2>
+        <p class="page-desc">管理报销申请，包括待办审批、所有申请列表等</p>
+      </div>
+      <div class="header-right">
+        <el-button 
+          icon="el-icon-refresh" 
+          @click="getList"
+          :loading="listLoading"
+        >
+          刷新
+        </el-button>
+      </div>
+    </div>
+
+    <!-- 标签页切换 -->
+    <div class="tabs-container">
+      <el-tabs v-model="activeTab" @tab-click="handleTabChange">
+        <el-tab-pane label="所有待办" name="allPending">
+          <template slot="label">
+            <span><i class="el-icon-s-order"></i> 所有待办</span>
+          </template>
+        </el-tab-pane>
+        <el-tab-pane label="我的待办" name="myPending">
+          <template slot="label">
+            <span><i class="el-icon-user"></i> 我的待办</span>
+          </template>
+        </el-tab-pane>
+        <el-tab-pane label="所有申请" name="all">
+          <template slot="label">
+            <span><i class="el-icon-document"></i> 所有申请</span>
+          </template>
+        </el-tab-pane>
+      </el-tabs>
+    </div>
+
+    <!-- 搜索区域 -->
+    <div class="search-container">
+      <el-form :model="queryParams" ref="queryForm" :inline="true" label-width="100px" label-position="right">
+        <el-form-item label="申请门店ID" prop="applicationStoreId">
+          <el-input 
+            v-model="queryParams.applicationStoreId" 
+            placeholder="请输入申请门店ID" 
+            clearable
+            style="width: 200px"
+          />
+        </el-form-item>
+        <template v-if="activeTab === 'all'">
+          <el-form-item label="申请编号" prop="id">
+            <el-input 
+              v-model="queryParams.id" 
+              placeholder="请输入申请编号" 
+              clearable
+              style="width: 200px"
+            />
+          </el-form-item>
+          <el-form-item label="申请人编号" prop="applicationUserId">
+            <el-input 
+              v-model="queryParams.applicationUserId" 
+              placeholder="请输入申请人编号" 
+              clearable
+              style="width: 200px"
+            />
+          </el-form-item>
+          <el-form-item label="申请人姓名" prop="applicationUserName">
+            <el-input 
+              v-model="queryParams.applicationUserName" 
+              placeholder="请输入申请人姓名" 
+              clearable
+              style="width: 200px"
+            />
+          </el-form-item>
+          <el-form-item label="申请时间" prop="applicationTime">
+            <el-date-picker
+              v-model="queryParams.applicationTime"
+              type="daterange"
+              range-separator="至"
+              start-placeholder="开始日期"
+              end-placeholder="结束日期"
+              format="yyyy-MM-dd"
+              value-format="yyyy-MM-dd"
+              style="width: 240px"
+            />
+          </el-form-item>
+          <el-form-item label="金额" prop="amount">
+            <el-input 
+              v-model="queryParams.amount" 
+              placeholder="请输入金额" 
+              clearable
+              style="width: 200px"
+            />
+          </el-form-item>
+          <el-form-item label="审批状态" prop="approveStatus">
+            <el-select 
+              v-model="queryParams.approveStatus" 
+              placeholder="请选择审批状态"
+              clearable
+              style="width: 200px"
+            >
+              <el-option label="待审批" value="待审批" />
+              <el-option label="审批中" value="审批中" />
+              <el-option label="已通过" value="已通过" />
+              <el-option label="未通过" value="未通过" />
+              <el-option label="已退回" value="已退回" />
+            </el-select>
+          </el-form-item>
+          <el-form-item label="购买记录编号" prop="purchaseRecordsId">
+            <el-input 
+              v-model="queryParams.purchaseRecordsId" 
+              placeholder="请输入购买记录编号" 
+              clearable
+              style="width: 200px"
+            />
+          </el-form-item>
+        </template>
+        <el-form-item>
+          <el-button type="primary" icon="el-icon-search" @click="handleQuery">搜索</el-button>
+          <el-button icon="el-icon-refresh" @click="resetQuery">重置</el-button>
+        </el-form-item>
+      </el-form>
+    </div>
+
+    <!-- 数据表格 -->
+    <div class="table-container">
+      <NCC-table 
+        v-loading="listLoading" 
+        :data="list" 
+        border 
+        stripe
+        height="calc(100vh - 500px)"
+        :header-cell-style="{ background: '#f5f7fa', color: '#606266' }"
+      >
+        <!-- 申请编号 -->
+        <el-table-column label="申请编号" width="180" align="center">
+          <template slot-scope="scope">
+            <div class="id-item">
+              <i class="el-icon-document id-icon"></i>
+              <span>{{ scope.row.id || '无' }}</span>
+            </div>
+          </template>
+        </el-table-column>
+
+        <!-- 申请人 -->
+        <el-table-column label="申请人" width="140" align="center">
+          <template slot-scope="scope">
+            <div class="user-item">
+              <i class="el-icon-user user-icon"></i>
+              <span>{{ scope.row.applicationUserName || '无' }}</span>
+            </div>
+          </template>
+        </el-table-column>
+
+        <!-- 申请门店ID -->
+        <el-table-column label="申请门店ID" width="160" align="center">
+          <template slot-scope="scope">
+            <div class="store-item">
+              <i class="el-icon-shop store-icon"></i>
+              <span>{{ scope.row.applicationStoreId || '无' }}</span>
+            </div>
+          </template>
+        </el-table-column>
+
+        <!-- 申请时间 -->
+        <el-table-column label="申请时间" width="180" align="center">
+          <template slot-scope="scope">
+            <div class="time-item">
+              <i class="el-icon-time time-icon"></i>
+              <span>{{ formatDateTime(scope.row.applicationTime) || '无' }}</span>
+            </div>
+          </template>
+        </el-table-column>
+
+        <!-- 金额 -->
+        <el-table-column label="金额" width="140" align="center">
+          <template slot-scope="scope">
+            <div class="amount-item">
+              <i class="el-icon-money amount-icon"></i>
+              <span class="amount-value">{{ formatMoney(scope.row.amount) || '无' }}</span>
             </div>
-        </div>
-		<NCC-Form v-if="formVisible" ref="NCCForm" @refresh="refresh" />
-		<ExportBox v-if="exportBoxVisible" ref="ExportBox" @download="download" />
-		<DetailDialog v-if="detailVisible" ref="DetailDialog" @close="handleDetailClose" />
-	</div>
+          </template>
+        </el-table-column>
+
+        <!-- 审批状态 -->
+        <el-table-column label="审批状态" width="120" align="center">
+          <template slot-scope="scope">
+            <el-tag 
+              :type="getStatusType(scope.row.approveStatus)"
+              size="small"
+            >
+              {{ scope.row.approveStatus || '无' }}
+            </el-tag>
+          </template>
+        </el-table-column>
+
+        <!-- 当前审批人 -->
+        <el-table-column label="当前审批人" width="160" align="center" v-if="activeTab !== 'all'">
+          <template slot-scope="scope">
+            <div class="approver-item">
+              <i class="el-icon-user-solid approver-icon"></i>
+              <span>{{ scope.row.currentApprovers || '无' }}</span>
+            </div>
+          </template>
+        </el-table-column>
+
+        <!-- 当前节点 -->
+        <el-table-column label="当前节点" width="120" align="center" v-if="activeTab !== 'all'">
+          <template slot-scope="scope">
+            <div class="node-item">
+              <i class="el-icon-s-order node-icon"></i>
+              <span>{{ scope.row.currentNodeOrder ? `第${scope.row.currentNodeOrder}节点` : '无' }}</span>
+            </div>
+          </template>
+        </el-table-column>
+
+        <!-- 节点总数 -->
+        <el-table-column label="节点总数" width="100" align="center" v-if="activeTab !== 'all'">
+          <template slot-scope="scope">
+            <div class="node-count-item">
+              <i class="el-icon-s-data node-count-icon"></i>
+              <span>{{ scope.row.nodeCount || '无' }}</span>
+            </div>
+          </template>
+        </el-table-column>
+
+        <!-- 操作 -->
+        <el-table-column label="操作" width="200" align="left" fixed="right">
+          <template slot-scope="scope">
+            <div class="action-buttons">
+              <el-button 
+                type="text" 
+                icon="el-icon-view" 
+                @click="handleView(scope.row)"
+                size="small"
+                class="view-btn"
+              >
+                查看
+              </el-button>
+              <el-button 
+                type="text" 
+                icon="el-icon-time" 
+                @click="handleViewHistory(scope.row)"
+                size="small"
+                class="history-btn"
+              >
+                审批历史
+              </el-button>
+            </div>
+          </template>
+        </el-table-column>
+      </NCC-table>
+    </div>
+
+    <!-- 分页 -->
+    <div class="pagination-container">
+      <el-pagination
+        @size-change="handleSizeChange"
+        @current-change="handleCurrentChange"
+        :current-page="listQuery.currentPage"
+        :page-sizes="[10, 20, 50, 100]"
+        :page-size="listQuery.pageSize"
+        layout="total, sizes, prev, pager, next, jumper"
+        :total="total"
+      />
+    </div>
+
+    <!-- 详情/审批弹窗 -->
+    <detail-dialog 
+      v-if="detailVisible"
+      ref="DetailDialog"
+      @refresh="getList"
+    />
+
+    <!-- 审批历史弹窗 -->
+    <approval-history-dialog 
+      v-if="historyVisible"
+      ref="ApprovalHistoryDialog"
+    />
+  </div>
 </template>
+
 <script>
-    import request from '@/utils/request'
-    import { getDictionaryDataSelector } from '@/api/systemData/dictionary'
-    import { getStoreSelector } from '@/api/extend/store'
-    import NCCForm from './Form'
-    import ExportBox from './ExportBox'
-    import DetailDialog from './detail'
-    import { previewDataInterface } from '@/api/systemData/dataInterface'
-	export default {
-        components: { NCCForm, ExportBox, DetailDialog },
-        data() {
-            return {
-                showAll: false,
-                storeOptions: [],
-                storeMap: {},
-                detailVisible: false,
-				query: {
-                    id:undefined,
-                    applicationUserId:undefined,
-                    applicationUserName:undefined,
-                    applicationStoreId:undefined,
-                    applicationTime:undefined,
-                    amount:undefined,
-                    approveUser:undefined,
-                    approveStatus:undefined,
-                    approveTime:undefined,
-                    purchaseRecordsId:undefined,
-				},
-                list: [],
-                listLoading: true,
-                multipleSelection: [], total: 0,
-                listQuery: {
-                    currentPage: 1,
-                    pageSize: 20,
-					sort: "desc",
-                    sidx: "",
-                },
-                formVisible: false,
-                exportBoxVisible: false,
-                columnList: [
-                    { prop: 'id', label: '申请编号' },
-                    { prop: 'applicationUserId', label: '申请人编号' },
-                    { prop: 'applicationUserName', label: '申请人姓名' },
-                    { prop: 'applicationStoreId', label: '申请门店' },
-                    { prop: 'applicationTime', label: '申请时间' },
-                    { prop: 'amount', label: '总金额' },
-                    { prop: 'approveUser', label: '审批人' },
-                    { prop: 'approveStatus', label: '审批结果' },
-                    { prop: 'approveTime', label: '审批时间' },
-                    { prop: 'purchaseRecordsId', label: '关联购买编号' },
-				],
-			}
-        },
-		computed: {},
-		created() {
-			this.loadStoreOptions()
-			this.initData()
-		},
-		methods: {
-            		// 加载门店列表
-			loadStoreOptions() {
-				request({
-					url: '/api/Extend/LqMdxx',
-					method: 'GET',
-					data: {
-						currentPage: 1,
-						pageSize: 1000
-					}
-				}).then(res => {
-					if (res.data && res.data.list) {
-						this.storeOptions = res.data.list;
-					}
-				}).catch(() => {
-					this.storeOptions = [];
-				});
-			},
-	
-			getStoreName(storeId) {
-				if (!storeId) return '无';
-				const store = this.storeOptions.find(item => item.id === storeId);
-				return store ? store.dm : '无';
-			},
-			initData() {
-                this.listLoading = true;
-                let _query = {
-                    ...this.listQuery,
-                    ...this.query
-                };
-                let query = {}
-                for (let key in _query) {
-                    if (Array.isArray(_query[key])) {
-                        query[key] = _query[key].join()
-                    } else {
-                        query[key] = _query[key]
-                    }
-                }
-                request({
-                    url: `/api/Extend/LqReimbursementApplication`,
-                    method: 'GET',
-                    data: query
-                }).then(res => {
-                    this.list = res.data.list
-                    this.total = res.data.pagination.total
-                    this.listLoading = false
-                })
-            },
-			handleDel(id) {
-                this.$confirm('此操作将永久删除该数据, 是否继续?', '提示', {
-                    type: 'warning'
-                }).then(() => {
-                    request({
-                        url: `/api/Extend/LqReimbursementApplication/${id}`,
-                        method: 'DELETE'
-                    }).then(res => {
-                        this.$message({
-                            type: 'success',
-                            message: res.msg,
-                            onClose: () => {
-                                this.initData()
-                            }
-                        });
-                    })
-                }).catch(() => {
-                });
-            },
-			handleSelectionChange(val) {
-                const res = val.map(item => item.id)
-                this.multipleSelection = res
-            },
-            handleBatchRemoveDel() {
-                if (!this.multipleSelection.length) {
-                    this.$message({
-                        type: 'error',
-                        message: '请选择一条数据',
-                        duration: 1500,
-                    })
-                    return
-                }
-                const ids = this.multipleSelection
-                this.$confirm('您确定要删除这些数据吗, 是否继续？', '提示', {
-                    type: 'warning'
-                }).then(() => {
-                    request({
-                        url: `/api/Extend/LqReimbursementApplication/batchRemove`,
-                        method: 'POST',
-                        data: ids ,
-                    }).then(res => {
-                        this.$message({
-                            type: 'success',
-                            message: res.msg,
-                            onClose: () => {
-                                this.initData()
-                            }
-                        });
-                    })
-                }).catch(() => { })
-            },
-			addOrUpdateHandle(id, isDetail) {
-                this.formVisible = true
-                this.$nextTick(() => {
-                    this.$refs.NCCForm.init(id, isDetail)
-                })
-            },
-			exportData() {
-                this.exportBoxVisible = true
-                this.$nextTick(() => {
-                    this.$refs.ExportBox.init(this.columnList)
-                })
-            },
-            download(data) {
-                let query = { ...data, ...this.listQuery, ...this.query }
-                request({
-                    url: `/api/Extend/LqReimbursementApplication/Actions/Export`,
-                    method: 'GET',
-                    data: query
-                }).then(res => {
-                    if (!res.data.url) return
-                    window.location.href = this.define.comUrl + res.data.url
-                    this.$refs.ExportBox.visible = false
-                    this.exportBoxVisible = false
-                })
-            },
-			search() {
-                this.listQuery = {
-                    currentPage: 1,
-                    pageSize: 20,
-                    sort: "desc",
-                    sidx: "",
-                }
-                this.initData()
-            },
-            refresh(isrRefresh) {
-                this.formVisible = false
-                if (isrRefresh) this.reset()
-            },
-            reset() {
-                for (let key in this.query) {
-                    this.query[key] = undefined
-                }
-                this.listQuery = {
-                    currentPage: 1,
-                    pageSize: 20,
-                    sort: "desc",
-                    sidx: "",
-                }
-                this.initData()
-            },
-            showDetail(id) {
-                this.detailVisible = true
-                this.$nextTick(() => {
-                    this.$refs.DetailDialog.init(id)
-                })
-            },
-            handleDetailClose() {
-                this.detailVisible = false
-            }
-		}
+import request from '@/utils/request'
+import DetailDialog from './detail-dialog.vue'
+import ApprovalHistoryDialog from './approval-history-dialog.vue'
+
+export default {
+  name: 'LqReimbursementApplication',
+  components: {
+    DetailDialog,
+    ApprovalHistoryDialog
+  },
+  data() {
+    return {
+      activeTab: 'allPending', // 当前激活的标签页
+      listLoading: false,
+      list: [],
+      total: 0,
+      detailVisible: false,
+      historyVisible: false,
+      queryParams: {
+        applicationStoreId: '',
+        id: '',
+        applicationUserId: '',
+        applicationUserName: '',
+        applicationTime: null,
+        amount: '',
+        approveStatus: '',
+        purchaseRecordsId: ''
+      },
+      listQuery: {
+        currentPage: 1,
+        pageSize: 20,
+        sidx: 'applicationTime',
+        sort: 'desc'
+      }
     }
+  },
+  created() {
+    this.getList()
+  },
+  methods: {
+    // 获取列表数据
+    async getList() {
+      this.listLoading = true
+      try {
+        let url = '/api/Extend/LqReimbursementApplication'
+        
+        // 根据标签页选择不同的接口
+        if (this.activeTab === 'allPending') {
+          url = '/api/Extend/LqReimbursementApplication/Actions/AllPendingApproval'
+        } else if (this.activeTab === 'myPending') {
+          url = '/api/Extend/LqReimbursementApplication/Actions/PendingApproval'
+        }
+
+        const params = {
+          currentPage: this.listQuery.currentPage,
+          pageSize: this.listQuery.pageSize,
+          sidx: this.listQuery.sidx,
+          sort: this.listQuery.sort
+        }
+
+        // 添加查询参数
+        if (this.queryParams.applicationStoreId) {
+          params.applicationStoreId = this.queryParams.applicationStoreId
+        }
+
+        // 只有"所有申请"标签页才添加这些查询参数
+        if (this.activeTab === 'all') {
+          if (this.queryParams.id) {
+            params.id = this.queryParams.id
+          }
+          if (this.queryParams.applicationUserId) {
+            params.applicationUserId = this.queryParams.applicationUserId
+          }
+          if (this.queryParams.applicationUserName) {
+            params.applicationUserName = this.queryParams.applicationUserName
+          }
+          if (this.queryParams.applicationTime && this.queryParams.applicationTime.length === 2) {
+            params.applicationTime = `${this.queryParams.applicationTime[0]},${this.queryParams.applicationTime[1]}`
+          }
+          if (this.queryParams.amount) {
+            params.amount = this.queryParams.amount
+          }
+          if (this.queryParams.approveStatus) {
+            params.approveStatus = this.queryParams.approveStatus
+          }
+          if (this.queryParams.purchaseRecordsId) {
+            params.purchaseRecordsId = this.queryParams.purchaseRecordsId
+          }
+        }
+
+        const response = await request({
+          url: url,
+          method: 'GET',
+          data: params
+        })
+
+        if (response.code === 200) {
+          this.list = response.data.list || []
+          this.total = (response.data.pagination && response.data.pagination.Total) || 0
+        } else {
+          this.$message.error(response.msg || '获取列表失败')
+          this.list = []
+          this.total = 0
+        }
+      } catch (error) {
+        console.error('获取列表失败:', error)
+        this.$message.error('获取列表失败')
+        this.list = []
+        this.total = 0
+      } finally {
+        this.listLoading = false
+      }
+    },
+
+    // 标签页切换
+    handleTabChange() {
+      this.listQuery.currentPage = 1
+      this.resetQuery()
+    },
+
+    // 搜索
+    handleQuery() {
+      this.listQuery.currentPage = 1
+      this.getList()
+    },
+
+    // 重置搜索
+    resetQuery() {
+      this.queryParams = {
+        applicationStoreId: '',
+        id: '',
+        applicationUserId: '',
+        applicationUserName: '',
+        applicationTime: null,
+        amount: '',
+        approveStatus: '',
+        purchaseRecordsId: ''
+      }
+      this.listQuery = {
+        currentPage: 1,
+        pageSize: 20,
+        sidx: 'applicationTime',
+        sort: 'desc'
+      }
+      this.getList()
+    },
+
+    // 查看详情/审批
+    handleView(row) {
+      this.detailVisible = true
+      this.$nextTick(() => {
+        this.$refs.DetailDialog.init(row.id)
+      })
+    },
+
+    // 查看审批历史
+    handleViewHistory(row) {
+      this.historyVisible = true
+      this.$nextTick(() => {
+        this.$refs.ApprovalHistoryDialog.init(row.id)
+      })
+    },
+
+    // 分页大小改变
+    handleSizeChange(val) {
+      this.listQuery.pageSize = val
+      this.getList()
+    },
+
+    // 当前页改变
+    handleCurrentChange(val) {
+      this.listQuery.currentPage = val
+      this.getList()
+    },
+
+    // 格式化金额
+    formatMoney(amount) {
+      if (!amount) return '无'
+      return `¥${Number(amount).toLocaleString('zh-CN', {
+        minimumFractionDigits: 2,
+        maximumFractionDigits: 2
+      })}`
+    },
+
+    // 格式化日期时间
+    formatDateTime(dateTime) {
+      if (!dateTime) return '无'
+      const date = new Date(dateTime)
+      const year = date.getFullYear()
+      const month = String(date.getMonth() + 1).padStart(2, '0')
+      const day = String(date.getDate()).padStart(2, '0')
+      const hours = String(date.getHours()).padStart(2, '0')
+      const minutes = String(date.getMinutes()).padStart(2, '0')
+      return `${year}-${month}-${day} ${hours}:${minutes}`
+    },
+
+    // 获取状态类型
+    getStatusType(status) {
+      const statusMap = {
+        '待审批': 'info',
+        '审批中': 'warning',
+        '已通过': 'success',
+        '未通过': 'danger',
+        '已退回': 'warning'
+      }
+      return statusMap[status] || ''
+    }
+  }
+}
 </script>
+
 <style lang="scss" scoped>
-.store-info {
+.app-container {
+  padding: 20px;
+  background: #f5f5f5;
+}
+
+.page-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: flex-start;
+  margin-bottom: 20px;
+  padding: 20px;
+  background: #fff;
+  border-radius: 8px;
+  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+
+  .header-left {
+    h2 {
+      margin: 0 0 8px 0;
+      color: #303133;
+      font-size: 20px;
+      font-weight: 600;
+    }
+
+    .page-desc {
+      margin: 0;
+      color: #909399;
+      font-size: 14px;
+    }
+  }
+
+  .header-right {
+    display: flex;
+    gap: 12px;
+  }
+}
+
+.tabs-container {
+  margin-bottom: 20px;
+  padding: 20px;
+  background: #fff;
+  border-radius: 8px;
+  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+}
+
+.search-container {
+  padding: 20px;
+  background: #fff;
+  border-radius: 8px;
+  margin-bottom: 20px;
+  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+}
+
+.table-container {
+  background: #fff;
+  border-radius: 8px;
+  padding: 20px;
+  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+  margin-bottom: 20px;
+}
+
+// 表格项样式
+.id-item,
+.user-item,
+.store-item,
+.time-item,
+.amount-item,
+.approver-item,
+.node-item,
+.node-count-item {
   display: flex;
   align-items: center;
+  justify-content: center;
   gap: 6px;
-
-  i {
+  
+  .id-icon {
+    color: #409EFF;
+    font-size: 16px;
+  }
+  
+  .user-icon {
     color: #67C23A;
-    font-size: 14px;
+    font-size: 16px;
   }
-
+  
+  .store-icon {
+    color: #67C23A;
+    font-size: 16px;
+  }
+  
+  .time-icon {
+    color: #909399;
+    font-size: 16px;
+  }
+  
+  .amount-icon {
+    color: #F56C6C;
+    font-size: 16px;
+  }
+  
+  .approver-icon {
+    color: #409EFF;
+    font-size: 16px;
+  }
+  
+  .node-icon {
+    color: #909399;
+    font-size: 16px;
+  }
+  
+  .node-count-icon {
+    color: #909399;
+    font-size: 16px;
+  }
+  
   span {
-    color: #303133;
+    color: #606266;
   }
 }
-</style>
\ No newline at end of file
+
+.amount-value {
+  font-weight: 600;
+  color: #F56C6C;
+}
+
+// 操作按钮样式
+.action-buttons {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  
+  .view-btn {
+    color: #409EFF;
+    
+    &:hover {
+      color: #66b1ff;
+    }
+  }
+  
+  .history-btn {
+    color: #909399;
+    
+    &:hover {
+      color: #606266;
+    }
+  }
+}
+
+.pagination-container {
+  display: flex;
+  justify-content: center;
+  padding: 20px;
+  background: #fff;
+  border-radius: 8px;
+  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+}
+</style>
diff --git a/绿纤uni-app/common/config.js b/绿纤uni-app/common/config.js
index c156a1c..ab8ccef 100644
--- a/绿纤uni-app/common/config.js
+++ b/绿纤uni-app/common/config.js
@@ -10,8 +10,8 @@ const ENV_CONFIG = {
 	// 正式环境
 	production: {
 		name: '正式环境',
-		// apiBaseUrl: 'http://erp_test.lvqianmeiye.com',
-		apiBaseUrl: 'https://erp.lvqianmeiye.com',
+		apiBaseUrl: 'http://erp_test.lvqianmeiye.com',
+		// apiBaseUrl: 'https://erp.lvqianmeiye.com',
 		description: '生产环境服务器'
 	}
 };