antissoft / lvqianmeiye_ERP

Commit 6bac91b24965ec93a95bac3f2fdc98db92348dfc

Authored by “wangming”
1 parent fa962cd2

Refactor LqMdxx view layout and enhance search functionality 

- Updated the layout structure to improve UI consistency and user experience.
- Simplified the search form by removing unnecessary fields and enhancing the design.
- Added new buttons for batch actions and improved the visibility of the header section.
- Implemented a clear selection feature for better user interaction.
- Enhanced table columns with overflow tooltips for better data visibility.
- Updated styles for a more modern look and feel, including responsive design adjustments.
Inline Side-by-side
Showing 2 changed files with 451 additions and 134 deletions
antis-ncc-admin/src/views/lqMdxx/index.vue
  View file @6bac91b
1 <template> 1 <template>
2 - <div class="NCC-common-layout">  
3 - <div class="NCC-common-layout-center">  
4 - <el-row class="NCC-common-search-box" :gutter="16">  
5 - <el-form @submit.native.prevent>  
6 - <!-- <el-col :span="6">  
7 - <el-form-item label="主键">  
8 - <el-input v-model="query.id" placeholder="主键" clearable />  
9 - </el-form-item>  
10 - </el-col>  
11 - <el-col :span="6">  
12 - <el-form-item label="门店编码">  
13 - <el-input v-model="query.mdbm" placeholder="门店编码" clearable />  
14 - </el-form-item>  
15 - </el-col>  
16 - <el-col :span="6">  
17 - <el-form-item label="单据门店编号">  
18 - <el-input v-model="query.djmdbh" placeholder="单据门店编号" clearable />  
19 - </el-form-item>  
20 - </el-col> -->  
21 - <el-col :span="6">  
22 - <el-form-item label="单据门店">  
23 - <el-input v-model="query.djmd" placeholder="单据门店" clearable />  
24 - </el-form-item>  
25 - </el-col>  
26 - <el-col :span="6">  
27 - <el-form-item label="店名">  
28 - <el-input v-model="query.dm" placeholder="店名" clearable />  
29 - </el-form-item>  
30 - </el-col>  
31 - <el-col :span="6">  
32 - <el-form-item label="城市">  
33 - <el-input v-model="query.cs" placeholder="城市" clearable />  
34 - </el-form-item>  
35 - </el-col>  
36 - <template v-if="showAll">  
37 -  
38 - <!-- <el-col :span="6">  
39 - <el-form-item label="地址">  
40 - <el-input v-model="query.dz" placeholder="地址" clearable />  
41 - </el-form-item>  
42 - </el-col> -->  
43 - <el-col :span="6">  
44 - <el-form-item label="姓名">  
45 - <el-input v-model="query.xm" placeholder="姓名" clearable />  
46 - </el-form-item>  
47 - </el-col>  
48 - <el-col :span="6">  
49 - <el-form-item label="电话号码">  
50 - <el-input v-model="query.dhhm" placeholder="电话号码" clearable />  
51 - </el-form-item>  
52 - </el-col>  
53 - <el-col :span="6">  
54 - <el-form-item label="座机">  
55 - <el-input v-model="query.zj" placeholder="座机" clearable />  
56 - </el-form-item>  
57 - </el-col>  
58 - <el-col :span="6">  
59 - <el-form-item label="开业时间">  
60 - <el-date-picker v-model="query.kysj" type="daterange" value-format="timestamp" format="yyyy-MM-dd" start-placeholder="开始日期" end-placeholder="结束日期">  
61 - </el-date-picker>  
62 - </el-form-item>  
63 - </el-col>  
64 - <el-col :span="6">  
65 - <el-form-item label="最新状态">  
66 - <el-select v-model="query.zxzt" placeholder="最新状态" clearable >  
67 - <el-option v-for="(item, index) in zxztOptions" :key="index" :label="item.fullName" :value="item.id" />  
68 - </el-select>  
69 - </el-form-item>  
70 - </el-col>  
71 - <el-col :span="6">  
72 - <el-form-item label="工商名称">  
73 - <el-input v-model="query.gsmc" placeholder="工商名称" clearable />  
74 - </el-form-item>  
75 - </el-col>  
76 - <el-col :span="6">  
77 - <el-form-item label="法人">  
78 - <el-input v-model="query.fr" placeholder="法人" clearable />  
79 - </el-form-item>  
80 - </el-col>  
81 - <el-col :span="6">  
82 - <el-form-item label="有无社保">  
83 - <el-select v-model="query.ywsb" placeholder="有无社保" clearable >  
84 - <el-option v-for="(item, index) in ywsbOptions" :key="index" :label="item.fullName" :value="item.id" />  
85 - </el-select>  
86 - </el-form-item>  
87 - </el-col>  
88 - </template>  
89 - <el-col :span="6">  
90 - <el-form-item>  
91 - <el-button type="primary" icon="el-icon-search" @click="search()">查询</el-button>  
92 - <el-button icon="el-icon-refresh-right" @click="reset()">重置</el-button>  
93 - <el-button type="text" icon="el-icon-arrow-down" @click="showAll=true" v-if="!showAll">展开</el-button>  
94 - <el-button type="text" icon="el-icon-arrow-up" @click="showAll=false" v-else>收起</el-button>  
95 - </el-form-item>  
96 - </el-col>  
97 - </el-form>  
98 - </el-row>  
99 - <div class="NCC-common-layout-main NCC-flex-main">  
100 - <div class="NCC-common-head">  
101 - <div>  
102 - <el-button type="primary" icon="el-icon-plus" @click="addOrUpdateHandle()">新增</el-button>  
103 - <el-button type="text" icon="el-icon-download" @click="exportData()">导出</el-button>  
104 - <el-button type="text" icon="el-icon-delete" @click="handleBatchRemoveDel()">批量删除</el-button>  
105 - </div>  
106 - <div class="NCC-common-head-right">  
107 - <el-tooltip effect="dark" content="刷新" placement="top">  
108 - <el-link icon="icon-ym icon-ym-Refresh NCC-common-head-icon" :underline="false" @click="reset()" />  
109 - </el-tooltip>  
110 - <screenfull isContainer />  
111 - </div>  
112 - </div>  
113 - <NCC-table v-loading="listLoading" :data="list" has-c @selection-change="handleSelectionChange"> 2 + <div class="app-container">
  3 + <!-- 页面头部 -->
  4 + <div class="page-header">
  5 + <div class="header-left">
  6 + <h2>门店信息管理</h2>
  7 + <p class="page-desc">管理门店基本信息，包括门店编码、店名、地址、联系方式等</p>
  8 + </div>
  9 + <div class="header-right">
  10 + <el-button type="primary" icon="el-icon-plus" @click="addOrUpdateHandle()">新增</el-button>
  11 + <el-button type="success" icon="el-icon-download" @click="exportData()">导出</el-button>
  12 + <el-button type="danger" icon="el-icon-delete" @click="handleBatchRemoveDel()" :disabled="multipleSelection.length === 0">批量删除</el-button>
  13 + <el-button icon="el-icon-refresh" @click="reset()">刷新</el-button>
  14 + </div>
  15 + </div>
  16 +
  17 + <!-- 搜索区域 -->
  18 + <div class="search-container">
  19 + <el-form :model="query" ref="queryForm" :inline="true" label-width="80px">
  20 + <el-form-item label="单据门店" prop="djmd">
  21 + <el-input v-model="query.djmd" placeholder="请输入单据门店" clearable style="width: 200px" />
  22 + </el-form-item>
  23 + <el-form-item label="店名" prop="dm">
  24 + <el-input v-model="query.dm" placeholder="请输入店名" clearable style="width: 200px" />
  25 + </el-form-item>
  26 + <el-form-item label="城市" prop="cs">
  27 + <el-input v-model="query.cs" placeholder="请输入城市" clearable style="width: 200px" />
  28 + </el-form-item>
  29 + <template v-if="showAll">
  30 + <el-form-item label="姓名" prop="xm">
  31 + <el-input v-model="query.xm" placeholder="请输入姓名" clearable style="width: 200px" />
  32 + </el-form-item>
  33 + <el-form-item label="电话号码" prop="dhhm">
  34 + <el-input v-model="query.dhhm" placeholder="请输入电话号码" clearable style="width: 200px" />
  35 + </el-form-item>
  36 + <el-form-item label="座机" prop="zj">
  37 + <el-input v-model="query.zj" placeholder="请输入座机" clearable style="width: 200px" />
  38 + </el-form-item>
  39 + <el-form-item label="开业时间" prop="kysj">
  40 + <el-date-picker v-model="query.kysj" type="daterange" value-format="timestamp" format="yyyy-MM-dd" start-placeholder="开始日期" end-placeholder="结束日期" style="width: 240px" />
  41 + </el-form-item>
  42 + <el-form-item label="最新状态" prop="zxzt">
  43 + <el-select v-model="query.zxzt" placeholder="请选择最新状态" clearable style="width: 200px">
  44 + <el-option v-for="(item, index) in zxztOptions" :key="index" :label="item.fullName" :value="item.id" />
  45 + </el-select>
  46 + </el-form-item>
  47 + <el-form-item label="工商名称" prop="gsmc">
  48 + <el-input v-model="query.gsmc" placeholder="请输入工商名称" clearable style="width: 200px" />
  49 + </el-form-item>
  50 + <el-form-item label="法人" prop="fr">
  51 + <el-input v-model="query.fr" placeholder="请输入法人" clearable style="width: 200px" />
  52 + </el-form-item>
  53 + <el-form-item label="有无社保" prop="ywsb">
  54 + <el-select v-model="query.ywsb" placeholder="请选择有无社保" clearable style="width: 200px">
  55 + <el-option v-for="(item, index) in ywsbOptions" :key="index" :label="item.fullName" :value="item.id" />
  56 + </el-select>
  57 + </el-form-item>
  58 + </template>
  59 + <el-form-item>
  60 + <el-button type="primary" icon="el-icon-search" @click="search()">查询</el-button>
  61 + <el-button icon="el-icon-refresh-right" @click="reset()">重置</el-button>
  62 + <el-button type="text" icon="el-icon-arrow-down" @click="showAll=true" v-if="!showAll">展开</el-button>
  63 + <el-button type="text" icon="el-icon-arrow-up" @click="showAll=false" v-else>收起</el-button>
  64 + </el-form-item>
  65 + </el-form>
  66 + <!-- 批量操作区域 -->
  67 + <div class="batch-action-container" v-if="multipleSelection.length > 0">
  68 + <span class="selected-count">已选择 {{ multipleSelection.length }} 条记录</span>
  69 + <el-button type="info" icon="el-icon-close" size="small" @click="handleClearSelection">取消选择</el-button>
  70 + </div>
  71 + </div>
  72 +
  73 + <!-- 数据表格 -->
  74 + <div class="table-container">
  75 + <NCC-table ref="table" v-loading="listLoading" :data="list" has-c height="calc(100vh - 420px)" @selection-change="handleSelectionChange">
114 <!-- <el-table-column prop="id" label="主键" align="left" /> --> 76 <!-- <el-table-column prop="id" label="主键" align="left" /> -->
115 <!-- <el-table-column prop="mdbm" label="门店编码" align="left" /> 77 <!-- <el-table-column prop="mdbm" label="门店编码" align="left" />
116 <el-table-column prop="djmdbh" label="门店编号" align="left" /> --> 78 <el-table-column prop="djmdbh" label="门店编号" align="left" /> -->
117 - <el-table-column prop="djmd" label="单据门店" align="left" />  
118 - <el-table-column prop="dm" label="店名" align="left" />  
119 - <el-table-column prop="cs" label="城市" align="left" /> 79 + <el-table-column prop="djmd" label="单据门店" align="left" show-overflow-tooltip />
  80 + <el-table-column prop="dm" label="店名" align="left" show-overflow-tooltip />
  81 + <el-table-column prop="cs" label="城市" align="left" show-overflow-tooltip />
120 <!-- <el-table-column prop="dz" label="地址" align="left" /> --> 82 <!-- <el-table-column prop="dz" label="地址" align="left" /> -->
121 - <el-table-column prop="xm" label="姓名" align="left" />  
122 - <el-table-column prop="dhhm" label="电话号码" align="left" />  
123 - <el-table-column prop="zj" label="座机" align="left" />  
124 - <el-table-column prop="kysj" width="150" label="开业时间" align="left" :formatter="ncc.tableDateFormat"/>  
125 - <el-table-column prop="zzrs" label="在职人数" align="left" />  
126 - <el-table-column label="最新状态" prop="zxzt" align="left"> 83 + <el-table-column prop="xm" label="姓名" align="left" show-overflow-tooltip />
  84 + <el-table-column prop="dhhm" label="电话号码" align="left" show-overflow-tooltip />
  85 + <el-table-column prop="zj" label="座机" align="left" show-overflow-tooltip />
  86 + <el-table-column prop="kysj" width="150" label="开业时间" align="left" :formatter="ncc.tableDateFormat" show-overflow-tooltip />
  87 + <el-table-column prop="zzrs" label="在职人数" align="left" show-overflow-tooltip />
  88 + <el-table-column label="最新状态" prop="zxzt" align="left" show-overflow-tooltip>
127 <template slot-scope="scope">{{ scope.row.zxzt | dynamicText(zxztOptions) }}</template> 89 <template slot-scope="scope">{{ scope.row.zxzt | dynamicText(zxztOptions) }}</template>
128 </el-table-column> 90 </el-table-column>
129 - <el-table-column prop="gsmc" label="工商名称" align="left" />  
130 - <el-table-column prop="fr" label="法人" align="left" /> 91 + <el-table-column prop="gsmc" label="工商名称" align="left" show-overflow-tooltip />
  92 + <el-table-column prop="fr" label="法人" align="left" show-overflow-tooltip />
131 <!-- <el-table-column label="有无社保" prop="ywsb" align="left"> 93 <!-- <el-table-column label="有无社保" prop="ywsb" align="left">
132 <template slot-scope="scope">{{ scope.row.ywsb | dynamicText(ywsbOptions) }}</template> 94 <template slot-scope="scope">{{ scope.row.ywsb | dynamicText(ywsbOptions) }}</template>
133 </el-table-column> --> 95 </el-table-column> -->
134 - <el-table-column label="是否新店" prop="isNewStore" align="left"> 96 + <el-table-column label="是否新店" prop="isNewStore" align="left" show-overflow-tooltip>
135 <template slot-scope="scope"> 97 <template slot-scope="scope">
136 <el-tag v-if="scope.row.isNewStore" type="success" size="small">新店</el-tag> 98 <el-tag v-if="scope.row.isNewStore" type="success" size="small">新店</el-tag>
137 <el-tag v-else type="info" size="small">老店</el-tag> 99 <el-tag v-else type="info" size="small">老店</el-tag>
138 </template> 100 </template>
139 </el-table-column> 101 </el-table-column>
140 - <el-table-column label="阶段" prop="stage" align="left"> 102 + <el-table-column label="阶段" prop="stage" align="left" show-overflow-tooltip>
141 <template slot-scope="scope"> 103 <template slot-scope="scope">
142 {{ scope.row.stage==1 ? '第一阶段' : scope.row.stage==2 ? '第二阶段' : scope.row.stage == 3 ? '第三阶段' : '无' }} 104 {{ scope.row.stage==1 ? '第一阶段' : scope.row.stage==2 ? '第二阶段' : scope.row.stage == 3 ? '第三阶段' : '无' }}
143 </template> 105 </template>
144 </el-table-column> 106 </el-table-column>
145 - <el-table-column label="操作" fixed="right" width="150"> 107 + <el-table-column label="操作" fixed="right" width="320" show-overflow-tooltip>
146 <template slot-scope="scope"> 108 <template slot-scope="scope">
147 - <el-button type="text" @click="addOrUpdateHandle(scope.row.id)" >编辑</el-button>  
148 - <el-button type="text" @click="viewNewStoreHandle(scope.row)">查看新店设置</el-button>  
149 - <el-button type="text" @click="setNewStoreHandle(scope.row)" >设置新店</el-button>  
150 - <el-button type="text" @click="handleDel(scope.row.id)" class="NCC-table-delBtn" >删除</el-button> 109 + <span class="operation-buttons">
  110 + <el-button type="text" @click="addOrUpdateHandle(scope.row.id)">编辑</el-button>
  111 + <el-button type="text" @click="viewNewStoreHandle(scope.row)">查看新店设置</el-button>
  112 + <el-button type="text" @click="setNewStoreHandle(scope.row)">设置新店</el-button>
  113 + <el-button type="text" @click="handleDel(scope.row.id)" class="NCC-table-delBtn">删除</el-button>
  114 + </span>
151 </template> 115 </template>
152 </el-table-column> 116 </el-table-column>
153 </NCC-table> 117 </NCC-table>
154 <pagination :total="total" :page.sync="listQuery.currentPage" :limit.sync="listQuery.pageSize" @pagination="initData" /> 118 <pagination :total="total" :page.sync="listQuery.currentPage" :limit.sync="listQuery.pageSize" @pagination="initData" />
155 - </div>  
156 - </div> 119 + </div>
157 <NCC-Form v-if="formVisible" ref="NCCForm" @refresh="refresh" /> 120 <NCC-Form v-if="formVisible" ref="NCCForm" @refresh="refresh" />
158 <ExportBox v-if="exportBoxVisible" ref="ExportBox" @download="download" /> 121 <ExportBox v-if="exportBoxVisible" ref="ExportBox" @download="download" />
159 <SetNewStoreDialog v-if="setNewStoreVisible" ref="SetNewStoreDialog" @refresh="refresh" /> 122 <SetNewStoreDialog v-if="setNewStoreVisible" ref="SetNewStoreDialog" @refresh="refresh" />
@@ -280,6 +243,12 @@ @@ -280,6 +243,12 @@
280 const res = val.map(item => item.id) 243 const res = val.map(item => item.id)
281 this.multipleSelection = res 244 this.multipleSelection = res
282 }, 245 },
  246 + handleClearSelection() {
  247 + if (this.$refs.table && this.$refs.table.clearSelection) {
  248 + this.$refs.table.clearSelection()
  249 + }
  250 + this.multipleSelection = []
  251 + },
283 handleBatchRemoveDel() { 252 handleBatchRemoveDel() {
284 if (!this.multipleSelection.length) { 253 if (!this.multipleSelection.length) {
285 this.$message({ 254 this.$message({
@@ -385,6 +354,353 @@ @@ -385,6 +354,353 @@
385 } 354 }
386 this.initData() 355 this.initData()
387 } 356 }
388 - } 357 + }
  358 + }
  359 +</script>
  360 +
  361 +<style lang="scss" scoped>
  362 +.app-container {
  363 + padding: 16px;
  364 + background: linear-gradient(135deg, #f5f7fa 0%, #e8ecf1 50%, #f0f4f8 100%);
  365 + min-height: 100vh;
  366 + font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  367 +}
  368 +
  369 +.page-header {
  370 + display: flex;
  371 + justify-content: space-between;
  372 + align-items: flex-start;
  373 + margin-bottom: 16px;
  374 + padding: 18px 24px;
  375 + background: linear-gradient(135deg, rgba(255, 255, 255, 0.98) 0%, rgba(255, 255, 255, 0.95) 100%);
  376 + backdrop-filter: blur(10px);
  377 + border-radius: 12px;
  378 + box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08), 0 2px 8px rgba(0, 0, 0, 0.04);
  379 + border: 1px solid rgba(144, 147, 153, 0.15);
  380 + position: relative;
  381 + overflow: hidden;
  382 + transition: all 0.3s ease;
  383 +
  384 + &:hover {
  385 + box-shadow: 0 6px 24px rgba(0, 0, 0, 0.12), 0 4px 12px rgba(0, 0, 0, 0.06);
  386 + transform: translateY(-1px);
  387 + }
  388 +
  389 + &::before {
  390 + content: '';
  391 + position: absolute;
  392 + top: 0;
  393 + left: 0;
  394 + right: 0;
  395 + height: 3px;
  396 + background: linear-gradient(90deg, #3b82f6 0%, #2563eb 50%, #3b82f6 100%);
  397 + }
  398 +
  399 + .header-left {
  400 + h2 {
  401 + margin: 0 0 8px 0;
  402 + color: #303133;
  403 + font-size: 22px;
  404 + font-weight: 700;
  405 + background: linear-gradient(135deg, #303133 0%, #606266 100%);
  406 + -webkit-background-clip: text;
  407 + -webkit-text-fill-color: transparent;
  408 + background-clip: text;
  409 + }
  410 +
  411 + .page-desc {
  412 + margin: 0;
  413 + color: #909399;
  414 + font-size: 14px;
  415 + }
  416 + }
  417 +
  418 + .header-right {
  419 + display: flex;
  420 + gap: 10px;
  421 + flex-wrap: wrap;
  422 +
  423 + .el-button {
  424 + border-radius: 8px;
  425 + padding: 10px 18px;
  426 + font-weight: 500;
  427 + transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  428 + box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  429 +
  430 + &:hover {
  431 + transform: translateY(-2px);
  432 + box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
  433 + }
  434 +
  435 + &.el-button--primary {
  436 + background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%);
  437 + border: none;
  438 +
  439 + &:hover {
  440 + background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%);
  441 + }
  442 + }
  443 +
  444 + &.el-button--success {
  445 + background: linear-gradient(135deg, #22c55e 0%, #16a34a 100%);
  446 + border: none;
  447 +
  448 + &:hover {
  449 + background: linear-gradient(135deg, #16a34a 0%, #15803d 100%);
  450 + }
  451 + }
  452 +
  453 + &.el-button--danger {
  454 + background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%);
  455 + border: none;
  456 +
  457 + &:hover {
  458 + background: linear-gradient(135deg, #dc2626 0%, #b91c1c 100%);
  459 + }
  460 +
  461 + &:disabled {
  462 + background: #e5e7eb;
  463 + color: #9ca3af;
  464 + cursor: not-allowed;
  465 + }
  466 + }
  467 +
  468 + &:not(.el-button--primary):not(.el-button--success):not(.el-button--danger) {
  469 + background: rgba(255, 255, 255, 0.9);
  470 + border-color: rgba(144, 147, 153, 0.3);
  471 + color: #606266;
  472 +
  473 + &:hover {
  474 + background: rgba(255, 255, 255, 1);
  475 + border-color: rgba(144, 147, 153, 0.5);
  476 + }
  477 + }
  478 + }
  479 + }
  480 +}
  481 +
  482 +.search-container {
  483 + margin-bottom: 16px;
  484 + padding: 18px 24px;
  485 + background: linear-gradient(135deg, rgba(255, 255, 255, 0.98) 0%, rgba(255, 255, 255, 0.95) 100%);
  486 + backdrop-filter: blur(10px);
  487 + border-radius: 12px;
  488 + box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08), 0 2px 8px rgba(0, 0, 0, 0.04);
  489 + border: 1px solid rgba(144, 147, 153, 0.15);
  490 + transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  491 +
  492 + &:hover {
  493 + box-shadow: 0 6px 24px rgba(0, 0, 0, 0.12), 0 4px 12px rgba(0, 0, 0, 0.06);
  494 + }
  495 +
  496 + ::v-deep .el-form {
  497 + .el-form-item {
  498 + margin-bottom: 16px;
  499 + }
  500 +
  501 + .el-form-item__label {
  502 + font-weight: 600;
  503 + color: #606266;
  504 + }
  505 +
  506 + .el-button {
  507 + border-radius: 8px;
  508 + padding: 10px 20px;
  509 + font-weight: 500;
  510 + transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  511 + box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  512 +
  513 + &:hover {
  514 + transform: translateY(-2px);
  515 + box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
  516 + }
  517 +
  518 + &.el-button--primary {
  519 + background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%);
  520 + border: none;
  521 +
  522 + &:hover {
  523 + background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%);
  524 + }
  525 + }
  526 +
  527 + &:not(.el-button--primary) {
  528 + background: rgba(255, 255, 255, 0.9);
  529 + border-color: rgba(144, 147, 153, 0.3);
  530 + color: #606266;
  531 +
  532 + &:hover {
  533 + background: rgba(255, 255, 255, 1);
  534 + border-color: rgba(144, 147, 153, 0.5);
  535 + }
  536 + }
  537 + }
  538 +
  539 + .el-input__inner,
  540 + .el-select .el-input__inner,
  541 + .el-date-editor .el-input__inner {
  542 + border-radius: 8px;
  543 + border: 1px solid rgba(144, 147, 153, 0.3);
  544 + transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  545 +
  546 + &:focus {
  547 + border-color: #3b82f6;
  548 + box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.15);
  549 + }
  550 + }
  551 + }
  552 +}
  553 +
  554 +.batch-action-container {
  555 + margin-top: 16px;
  556 + padding: 14px 18px;
  557 + background: linear-gradient(135deg, rgba(59, 130, 246, 0.08) 0%, rgba(37, 99, 235, 0.05) 100%);
  558 + border-radius: 10px;
  559 + border: 1px solid rgba(59, 130, 246, 0.2);
  560 + display: flex;
  561 + align-items: center;
  562 + gap: 12px;
  563 + box-shadow: 0 2px 8px rgba(59, 130, 246, 0.1);
  564 + animation: slideDown 0.3s ease;
  565 +
  566 + @keyframes slideDown {
  567 + from {
  568 + opacity: 0;
  569 + transform: translateY(-10px);
  570 + }
  571 + to {
  572 + opacity: 1;
  573 + transform: translateY(0);
  574 + }
  575 + }
  576 +
  577 + .selected-count {
  578 + color: #3b82f6;
  579 + font-weight: 600;
  580 + margin-right: 8px;
  581 + font-size: 14px;
  582 + }
  583 +
  584 + .el-button {
  585 + border-radius: 8px;
  586 + font-weight: 500;
  587 + transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  588 + box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
  589 +
  590 + &:hover {
  591 + transform: translateY(-2px);
  592 + box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
  593 + }
  594 + }
  595 +}
  596 +
  597 +.table-container {
  598 + margin-bottom: 20px;
  599 + padding: 18px 24px;
  600 + background: linear-gradient(135deg, rgba(255, 255, 255, 0.98) 0%, rgba(255, 255, 255, 0.95) 100%);
  601 + backdrop-filter: blur(10px);
  602 + border-radius: 12px;
  603 + box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08), 0 2px 8px rgba(0, 0, 0, 0.04);
  604 + border: 1px solid rgba(144, 147, 153, 0.15);
  605 + transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  606 + position: relative;
  607 + overflow: hidden;
  608 +
  609 + &:hover {
  610 + box-shadow: 0 6px 24px rgba(0, 0, 0, 0.12), 0 4px 12px rgba(0, 0, 0, 0.06);
  611 + }
  612 +
  613 + ::v-deep .NCC-table {
  614 + .el-table {
  615 + border-radius: 8px;
  616 + overflow: hidden;
  617 + border: 1px solid rgba(144, 147, 153, 0.2);
  618 +
  619 + .el-table__header {
  620 + background: linear-gradient(135deg, rgba(248, 249, 250, 0.9) 0%, rgba(240, 242, 245, 0.9) 100%);
  621 +
  622 + th {
  623 + background: transparent;
  624 + color: #303133;
  625 + font-weight: 600;
  626 + border-bottom: 2px solid rgba(144, 147, 153, 0.2);
  627 + padding: 14px 0;
  628 + white-space: nowrap;
  629 + overflow: hidden;
  630 + text-overflow: ellipsis;
  631 + }
  632 + }
  633 +
  634 + .el-table__body {
  635 + tr {
  636 + transition: all 0.3s ease;
  637 +
  638 + &:hover {
  639 + background: linear-gradient(135deg, rgba(239, 246, 255, 0.5) 0%, rgba(219, 234, 254, 0.5) 100%);
  640 + transform: translateX(2px);
  641 + }
  642 + }
  643 +
  644 + td {
  645 + border-bottom: 1px solid rgba(144, 147, 153, 0.15);
  646 + padding: 12px 0;
  647 + white-space: nowrap;
  648 + overflow: hidden;
  649 + text-overflow: ellipsis;
  650 + }
  651 + }
  652 +
  653 + .el-table__row--striped {
  654 + td {
  655 + background-color: #fafafa;
  656 + }
  657 + }
  658 +
  659 + // 操作列特殊处理，确保按钮不换行
  660 + // 操作列特殊处理，确保按钮不换行
  661 + .el-table__body-wrapper,
  662 + .el-table__fixed-body-wrapper,
  663 + .el-table__fixed-right-body-wrapper {
  664 + .operation-buttons {
  665 + display: inline-flex;
  666 + align-items: center;
  667 + gap: 4px;
  668 + white-space: nowrap;
  669 + flex-wrap: nowrap;
  670 + width: 100%;
  671 + justify-content: flex-start;
  672 + }
  673 + }
  674 + }
  675 +
  676 + .el-button--text {
  677 + padding: 4px 8px;
  678 + border-radius: 4px;
  679 + transition: all 0.3s ease;
  680 + white-space: nowrap;
  681 + flex-shrink: 0;
  682 +
  683 + &:hover {
  684 + background: rgba(59, 130, 246, 0.1);
  685 + color: #3b82f6;
  686 + }
  687 +
  688 + &.NCC-table-delBtn {
  689 + &:hover {
  690 + background: rgba(239, 68, 68, 0.1);
  691 + color: #ef4444;
  692 + }
  693 + }
389 } 694 }
390 -</script>  
391 \ No newline at end of file 695 \ No newline at end of file
  696 + }
  697 +}
  698 +
  699 +// 图标动画
  700 +::v-deep .el-icon {
  701 + transition: all 0.3s ease;
  702 +
  703 + &:hover {
  704 + transform: scale(1.1) rotate(5deg);
  705 + }
  706 +}
  707 +</style>
392 \ No newline at end of file 708 \ No newline at end of file
netcore/src/Modularity/Extend/NCC.Extend/LqSalaryService.cs
  View file @6bac91b
@@ -903,6 +903,7 @@ namespace NCC.Extend @@ -903,6 +903,7 @@ namespace NCC.Extend
903 } 903 }
904 904
905 // 4.3 最终工资 905 // 4.3 最终工资
  906 + salary.CalculatedGrossSalary = salary.HealthCoachBaseSalary + salary.TotalCommission + salary.HandworkFee + salary.TotalSubsidy - salary.TotalDeduction;
906 salary.ActualSalary = salary.HealthCoachBaseSalary + salary.TotalCommission + salary.HandworkFee + salary.TotalSubsidy - salary.TotalDeduction; 907 salary.ActualSalary = salary.HealthCoachBaseSalary + salary.TotalCommission + salary.HandworkFee + salary.TotalSubsidy - salary.TotalDeduction;
907 } 908 }
908 909