huangqizhen
/
gold-vue
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

拆分样式统一

zhangrenyuan/feature-20251104133449-现金管理二期
ZhangYong 3 weeks ago
parent
63c488e5eb
commit
fdca8550d2
4 changed files with 1113 additions and 1141 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 440
      src/views/moneyManage/receiveDetail/receiveFinance.vue
  2. 1808
      src/views/moneyManage/receiveDetail/receiveManage.vue
  3. 5
      src/views/moneyManage/receiveDetail/receiveService.vue
  4. 1
      src/views/moneyManage/receiveDetail/utils/recriveFormRules.js

440
src/views/moneyManage/receiveDetail/receiveFinance.vue
View File

@ -840,328 +840,292 @@ const handlePagination = (type, val) => {
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
// 地区财务界面样式优化：移除客服/总部相关样式，保留核心样式
.content { .content {
height: 100%; height: 100%;
width: 80vw; width: 80vw;
margin: 0 auto;
padding: 1vh 0;
// 搜索卡片样式
.div-card1 {
.card1 {
background: #F3FAFE;
border: none;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
.row {
height: auto;
width: 100%;
display: flex;
align-items: center;
margin-bottom: 1vh;
min-height: 40px;
.rowItem {
display: flex;
align-items: center;
margin-right: 1.5vw;
width: auto;
el-text {
min-width: 60px;
margin-right: 0.5vw;
color: #333;
font-weight: 500;
}
.card1 {
width: 100%;
background: #F3FAFE;
el-input,
el-select,
el-cascader {
min-width: 160px;
}
}
.row {
height: 4vh;
width: 80vw;
display: flex;
min-height: 40px;
.buttons {
display: flex;
justify-content: center;
align-items: center;
margin-left: 10px;
}
.rowItem {
display: flex;
width: 15vw;
align-items: center;
justify-content: center;
margin-right: 0.5vw;
}
.buttons {
display: flex;
justify-content: center;
align-items: center;
margin-left: 10px;
} }
} }
} }
// 数据展示卡片样式
.div-card2 { .div-card2 {
margin-top: 1.5vh;
width: 100%;
margin-top: 2vh;
.card2 { .card2 {
background: #F3FAFE;
border: none;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
background: #E7F4FD;
}
// 标签页样式
.btns {
display: flex;
align-items: center;
justify-content: space-between;
padding: 1vh 1vw;
border-bottom: 1px solid #E5EBFE;
.btns {
display: flex;
align-items: center;
justify-content: space-between;
padding-bottom: 10px;
.tabs {
.btnItem {
margin-right: 0.5vw;
border-radius: 4px;
padding: 0.3vh 1vw;
font-size: 0.9vw;
.tabs {
min-width: 300px;
&:hover {
opacity: 0.9;
}
}
}
.btnAdd {
display: none; // 隐藏客服的添加收款按钮
.btnItem {
margin-left: 10px;
border-radius: 5px;
} }
} }
}
// 表格样式
.table {
margin: 1vh 1vw;
overflow: hidden;
.el-table {
border: none;
.el-table__header th {
background: #E5EBFE;
color: #2741DE;
font-weight: 500;
}
.el-table__body tr {
background: #F3FAFE;
&:hover>td {
background: #EEF3FF !important;
}
}
.table {
margin: 10px;
border-radius: 20px;
.el-table-column {
&[label="序号"],
&[label="Homily ID"],
&[label="姓名"] {
background: #F3FAFE;
z-index: 1;
}
&[label="操作"] {
el-link {
color: #2741DE;
cursor: pointer;
&:hover {
color: #1A30B9;
text-decoration: underline;
}
}
}
}
.ellipsis-container {
position: relative;
width: 100%;
// 驳回理由悬浮提示
.ellipsis-container {
.ellipsis-text {
color: #333;
cursor: pointer;
&:hover {
color: #2741DE;
}
}
.custom-tooltip {
position: fixed;
z-index: 9999;
padding: 8px 12px;
width: 200px;
background-color: #fff;
color: #333;
border: 1px solid #E5EBFE;
border-radius: 4px;
box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1);
max-height: 300px;
overflow-y: auto;
font-size: 14px;
line-height: 1.5;
}
}
.ellipsis-text {
display: inline-block;
width: 100%;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
cursor: pointer;
} }
}
// 分页样式
.pagination {
padding: 1vh 1vw;
text-align: right;
.el-pagination {
.el-pager li {
&.active {
background: #2741DE;
color: #fff;
}
}
.custom-tooltip {
position: fixed;
z-index: 9999;
padding: 8px 12px;
width: 200px;
background-color: #E4F0FC;
color: #333333;
border: 1px solid #e5e7eb;
border-radius: 4px;
box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1);
min-height: 30px;
max-height: 300px;
overflow-y: auto;
font-size: 14px;
line-height: 1.5;
} }
} }
} }
.pagination {
margin-top: 10px;
padding: 10px 10px;
}
} }
// 审核弹窗样式
:deep(.adddialog) { :deep(.adddialog) {
min-width: 500px;
background-color: #F3FAFE !important; background-color: #F3FAFE !important;
margin-top: 8vh;
border-radius: 8px; border-radius: 8px;
.addForm { .addForm {
padding: 1.5vh 2vw;
padding: 0 60px 1vh 60px;
.el-form-item {
margin-bottom: 1.5vh;
.el-date-editor {
display: flex;
flex: 1;
&:last-of-type {
margin-bottom: 0;
}
}
.el-form-item__label {
color: #333;
font-weight: 500;
min-width: 80px;
}
.pic {
display: flex;
align-items: center;
.pic {
display: flex;
align-items: center;
.uploader {
height: 80px;
width: 80px;
.uploader {
height: 80px;
width: 80px;
border: 1px dashed #DCDFE6;
.el-upload {
height: 100%;
width: 100%;
display: flex;
align-items: center;
justify-content: center;
}
.el-upload {
height: 100%;
width: 100%;
} }
}
.picText {
margin-left: 1vw;
color: #999;
font-size: 12px;
}
.picText {
color: #999999;
font-family: "PingFang SC";
font-size: 10px;
font-style: normal;
font-weight: 400;
line-height: 20px;
margin-left: 10px;
} }
} }
}
.dialog-footer {
display: flex;
justify-content: center;
padding-bottom: 1.5vh;
}
}
:deep(.editdialog) {
min-width: 990px;
background-color: #F3FAFE !important;
margin-top: 8vh;
border-radius: 8px;
.editForm {
padding: 0 60px 1vh 60px;
.dialog-footer {
.el-date-editor {
display: flex; display: flex;
justify-content: center;
gap: 1vw;
padding-top: 1.5vh;
flex: 1;
}
button {
padding: 0.5vh 1.5vw;
border-radius: 4px;
.pic {
display: flex;
align-items: center;
&:first-of-type {
background: #7E91FF;
border: none;
color: #fff;
}
.uploader {
height: 80px;
width: 80px;
&:last-of-type {
background: #2741DE;
border: none;
color: #fff;
.el-upload {
height: 100%;
width: 100%;
} }
} }
.picText {
color: #999999;
font-family: "PingFang SC";
font-size: 10px;
font-style: normal;
font-weight: 400;
line-height: 20px;
margin-left: 10px;
}
} }
} }
}
// 编辑弹窗样式
:deep(.editdialog) {
background-color: #F3FAFE !important;
border-radius: 8px;
width: 60vw !important;
.content { .content {
display: flex; display: flex;
gap: 2vw;
padding: 1.5vh 2vw;
height: 100%;
width: 100%;
.left {
min-width: 500px;
}
.left,
.right { .right {
flex: 1; flex: 1;
}
.editForm,
.editFormRighrt {
.el-form-item {
margin-bottom: 1.5vh;
.editFormRighrt {
padding: 0 60px 0 40px;
.el-form-item__label {
color: #333;
font-weight: 500;
min-width: 80px;
.el-date-editor {
display: flex;
flex: 1;
} }
} }
}
.right {
.editBtns { .editBtns {
display: flex; display: flex;
justify-content: center; justify-content: center;
gap: 1vw;
margin-top: 2vh;
.editBtn1,
.editBtn2 {
padding: 0.5vh 1.5vw;
border-radius: 4px;
border: none;
color: #fff;
.txt {
font-size: 14px;
}
margin-top: 60px;
.txt {
color: #f3fafe;
text-align: center;
font-family: "PingFang SC";
font-size: 14px;
font-style: normal;
font-weight: 700;
line-height: 22px;
} }
.editBtn1 { .editBtn1 {
min-width: 80px;
padding: 5px 12px;
justify-content: center;
align-items: center;
gap: 4px;
border-radius: 4px;
background: #7E91FF; background: #7E91FF;
border: none;
box-shadow: 0 0 4px 0 #00000040;
} }
.editBtn2 { .editBtn2 {
display: flex;
width: 80px;
min-width: 80px;
padding: 5px 12px;
justify-content: center;
align-items: center;
gap: 4px;
border-radius: 4px;
background: #2741DE; background: #2741DE;
border: none;
box-shadow: 0 0 4px 0 #00000040;
margin-left: 60px;
} }
} }
} }
} }
} }
:deep(.adddialog .el-form-item__label) {
min-width: 80px;
width: auto;
font-weight: 800;
padding-bottom: 15px;
}
}
// 表格样式统一
:deep(.el-table__header-wrapper),
:deep(.el-table__body-wrapper),
:deep(.el-table__cell),
:deep(.el-table__body td) {
background-color: #F3FAFE !important;
}
:deep(.el-table__header th) {
background-color: #F3FAFE !important;
} }
// 全局样式修复
:deep(.el-date-editor) {
width: 100%;
:deep(.el-table__row:hover > .el-table__cell) {
background-color: #E5EBFE !important;
} }
:deep(.el-select-dropdown) {
max-height: 200px;
// 驳回理由弹窗样式
.reject-reason-box {
--el-message-box-height: 500px;
} }
:deep(.el-cascader-panel) {
max-height: 200px;
.reject-reason-box .el-message-box__content {
max-height: 350px;
overflow-y: auto;
white-space: pre-wrap;
} }
</style> </style>

1808
src/views/moneyManage/receiveDetail/receiveManage.vue
File diff suppressed because it is too large
View File

5
src/views/moneyManage/receiveDetail/receiveService.vue
View File

@ -198,7 +198,10 @@
<el-input disabled v-model="addFormData.marketName" placeholder="请输入所属地区" /> <el-input disabled v-model="addFormData.marketName" placeholder="请输入所属地区" />
</el-form-item> </el-form-item>
<el-form-item label="活动名称" required prop="activity"> <el-form-item label="活动名称" required prop="activity">
<el-input v-model="addFormData.activity" placeholder="请输入活动名称" />
<el-select v-model="addFormData.activity" placeholder="请选择活动方式" style="width: 10vw;" clearable>
<el-option v-for="item in activityList" :key="item.id" :label="item.activityName"
:value="item.id" />
</el-select>
</el-form-item> </el-form-item>
<el-form-item label="产品名称" required @change="ifGold" prop="goodsName"> <el-form-item label="产品名称" required @change="ifGold" prop="goodsName">
<ProductSelect ref="productSelectRef" v-model="addFormData.goodsName"></ProductSelect> <ProductSelect ref="productSelectRef" v-model="addFormData.goodsName"></ProductSelect>

1
src/views/moneyManage/receiveDetail/utils/recriveFormRules.js
View File

@ -15,7 +15,6 @@ export const addFormRule = {
// 活动名称：必填 + 长度小于30 // 活动名称：必填 + 长度小于30
activity: [ activity: [
{ required: true, message: '请输入活动名称', trigger: 'blur' }, { required: true, message: '请输入活动名称', trigger: 'blur' },
{ max: 30, message: '活动名称长度不能超过30个字符', trigger: 'blur' }
], ],
// 产品名称：必填 // 产品名称：必填
goodsName: [ goodsName: [

Write Preview
Loading…
Cancel
Save