msumshk/TakeoutSaaS.TenantUI
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 完成会员消息触达模块页面与交互

Browse Source
This commit is contained in:
MSuMshk
2026-03-04 11:36:49 +08:00
parent 058ec9c142
commit 3056b56082
26 changed files with 3485 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
apps/web-antd/src/views/member/message-reach/styles/base.less Normal file
View File

@@ -0,0 +1,27 @@
.page-member-message-reach {
.mmr-page {
display: flex;
flex-direction: column;
gap: 16px;
}
.mmr-tab-panel {
display: flex;
flex-direction: column;
gap: 16px;
}
.mmr-spacer {
flex: 1;
}
.mmr-time-text {
font-size: 12px;
color: #6b7280;
white-space: nowrap;
}
.mmr-action-link {
padding-inline: 0;
}
}

163
apps/web-antd/src/views/member/message-reach/styles/drawer.less Normal file
View File

@@ -0,0 +1,163 @@
.page-member-message-reach {
.mmr-editor-form {
.ant-form-item {
margin-bottom: 16px;
}
}
.mmr-pill-group {
display: flex;
flex-wrap: wrap;
gap: 8px;
}
.mmr-pill {
padding: 4px 12px;
margin-right: 0;
font-size: 13px;
line-height: 22px;
border-radius: 999px;
}
.mmr-pill.ant-tag-checkable-checked {
color: #fff;
background: #1677ff;
}
.mmr-tag-panel {
margin-top: 10px;
}
.mmr-reach-row {
margin-top: 10px;
font-size: 12px;
font-weight: 500;
color: #1677ff;
}
.mmr-form-hint {
margin-top: 6px;
font-size: 12px;
color: #9ca3af;
}
.mmr-scheduled-picker {
width: 260px;
margin-top: 10px;
}
.mmr-template-link-wrap {
margin-bottom: 0;
}
.mmr-template-link {
padding-left: 0;
}
.mmr-drawer-footer {
display: flex;
gap: 10px;
justify-content: flex-end;
}
.mmr-detail-section {
margin-bottom: 20px;
}
.mmr-detail-section-title {
margin-bottom: 12px;
font-size: 14px;
font-weight: 600;
color: #111827;
}
.mmr-detail-title-row {
display: flex;
gap: 10px;
align-items: center;
margin-bottom: 12px;
}
.mmr-detail-title {
font-size: 18px;
font-weight: 700;
color: #111827;
}
.mmr-detail-meta {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 8px 16px;
font-size: 13px;
.label {
color: #6b7280;
}
.channels {
display: inline-flex;
gap: 4px;
align-items: center;
}
}
.mmr-detail-stat-grid {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 10px;
}
.mmr-detail-stat-item {
padding: 10px 12px;
background: #f8fafc;
border-radius: 8px;
.label {
margin-bottom: 4px;
font-size: 12px;
color: #6b7280;
}
.value {
font-size: 18px;
font-weight: 700;
color: #0f172a;
}
}
.mmr-detail-content {
padding: 10px 12px;
font-size: 13px;
line-height: 1.65;
color: #374151;
white-space: pre-wrap;
background: #f8fafc;
border: 1px solid #f1f5f9;
border-radius: 8px;
}
.mmr-detail-error {
margin-top: 10px;
font-size: 12px;
color: #dc2626;
}
.mmr-recipient-table {
.ant-table-thead > tr > th {
font-size: 12px;
background: #f8fafc;
}
.ant-table-tbody > tr > td {
font-size: 12px;
}
}
.mmr-error-text {
display: inline-block;
max-width: 220px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
}

7
apps/web-antd/src/views/member/message-reach/styles/index.less Normal file
View File

@@ -0,0 +1,7 @@
@import './base.less';
@import './layout.less';
@import './list.less';
@import './template.less';
@import './drawer.less';
@import './modal.less';
@import './responsive.less';

78
apps/web-antd/src/views/member/message-reach/styles/layout.less Normal file
View File

@@ -0,0 +1,78 @@
.page-member-message-reach {
.mmr-topbar {
display: flex;
gap: 12px;
align-items: center;
justify-content: space-between;
}
.mmr-tab-switch {
--ant-segmented-item-selected-bg: #fff;
--ant-segmented-item-selected-color: #1677ff;
}
.mmr-readonly-tip {
font-size: 12px;
color: #6b7280;
}
.mmr-toolbar {
display: flex;
flex-wrap: wrap;
gap: 10px;
align-items: center;
padding: 12px 14px;
background: #fff;
border-radius: 10px;
box-shadow: 0 2px 8px rgb(15 23 42 / 7%);
}
.mmr-select {
width: 120px;
}
.mmr-keyword-input {
width: 200px;
}
.mmr-stats {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 12px;
}
.mmr-stat-card {
padding: 16px 18px;
background: #fff;
border-radius: 10px;
box-shadow: 0 3px 10px rgb(15 23 42 / 7%);
transition:
transform 0.2s ease,
box-shadow 0.2s ease;
}
.mmr-stat-card:hover {
box-shadow: 0 10px 20px rgb(15 23 42 / 11%);
transform: translateY(-1px);
}
.mmr-stat-label {
margin-bottom: 6px;
font-size: 12px;
color: #9ca3af;
}
.mmr-stat-value {
font-size: 24px;
font-weight: 700;
line-height: 1.1;
color: #111827;
}
.mmr-stat-unit {
margin-left: 2px;
font-size: 13px;
font-weight: 500;
color: #6b7280;
}
}

53
apps/web-antd/src/views/member/message-reach/styles/list.less Normal file
View File

@@ -0,0 +1,53 @@
.page-member-message-reach {
.mmr-table-wrap {
overflow: hidden;
background: #fff;
border-radius: 10px;
box-shadow: 0 4px 14px rgb(15 23 42 / 8%);
}
.mmr-table {
.ant-table-thead > tr > th {
font-size: 13px;
font-weight: 600;
color: #475569;
background: #f8fafc;
white-space: nowrap;
}
.ant-table-tbody > tr > td {
font-size: 13px;
vertical-align: middle;
color: #0f172a;
}
}
.mmr-message-title {
font-weight: 600;
color: #0f172a;
}
.mmr-message-metric {
margin-top: 2px;
font-size: 12px;
color: #6b7280;
}
.mmr-channel-list {
display: flex;
flex-wrap: wrap;
gap: 4px;
}
.mmr-table-actions {
display: inline-flex;
gap: 8px;
align-items: center;
}
.mmr-pagination {
display: flex;
justify-content: flex-end;
padding: 14px 16px 16px;
}
}

7
apps/web-antd/src/views/member/message-reach/styles/modal.less Normal file
View File

@@ -0,0 +1,7 @@
.page-member-message-reach {
.mmr-template-modal-form {
.ant-form-item {
margin-bottom: 14px;
}
}
}

48
apps/web-antd/src/views/member/message-reach/styles/responsive.less Normal file
View File

@@ -0,0 +1,48 @@
.page-member-message-reach {
@media (max-width: 1200px) {
.mmr-stats {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.mmr-template-grid {
grid-template-columns: 1fr;
}
.mmr-detail-stat-grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
@media (max-width: 768px) {
.mmr-toolbar {
align-items: stretch;
padding: 12px;
}
.mmr-topbar {
flex-direction: column;
align-items: flex-start;
}
.mmr-select,
.mmr-keyword-input {
width: 100%;
}
.mmr-stats {
grid-template-columns: 1fr;
}
.mmr-detail-meta {
grid-template-columns: 1fr;
}
.mmr-detail-stat-grid {
grid-template-columns: 1fr;
}
.mmr-scheduled-picker {
width: 100%;
}
}
}

85
apps/web-antd/src/views/member/message-reach/styles/template.less Normal file
View File

@@ -0,0 +1,85 @@
.page-member-message-reach {
.mmr-template-wrap {
display: flex;
flex-direction: column;
gap: 16px;
}
.mmr-template-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 14px;
}
.mmr-template-card {
display: flex;
flex-direction: column;
gap: 12px;
min-height: 172px;
padding: 18px 20px;
background: #fff;
border-radius: 10px;
box-shadow: 0 4px 14px rgb(15 23 42 / 8%);
transition:
transform 0.2s ease,
box-shadow 0.2s ease;
}
.mmr-template-card:hover {
box-shadow: 0 10px 20px rgb(15 23 42 / 12%);
transform: translateY(-1px);
}
.mmr-template-head {
display: flex;
gap: 10px;
align-items: center;
justify-content: space-between;
}
.mmr-template-name {
flex: 1;
overflow: hidden;
font-size: 14px;
font-weight: 600;
color: #0f172a;
text-overflow: ellipsis;
white-space: nowrap;
}
.mmr-template-preview {
display: -webkit-box;
overflow: hidden;
font-size: 12px;
line-height: 1.65;
color: #6b7280;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
min-height: 40px;
}
.mmr-template-foot {
display: flex;
align-items: center;
justify-content: space-between;
margin-top: auto;
}
.mmr-template-usage {
font-size: 12px;
color: #9ca3af;
}
.mmr-template-actions {
display: inline-flex;
gap: 8px;
align-items: center;
}
.mmr-template-empty {
padding: 36px 0;
background: #fff;
border-radius: 10px;
box-shadow: 0 3px 10px rgb(15 23 42 / 7%);
}
}