完善彩票系统中奖规则和移动端适配 - 修正大乐透中奖规则，补全七、八、九等奖判断逻辑 - 优化移动端菜单栏，采用横向滑动Tab设计 - 改进首页布局，优化早点补货和新鲜出锅区域 - 修复表格内容对齐和出锅日期显示问题 - 新增移动端专用CSS样式文件
This commit is contained in:
Mars
parent
deeee6baf4
commit
27550b396c
@ -334,21 +334,33 @@ class LotteryUpdater:
|
||||
return None, None
|
||||
# 大乐透规则
|
||||
else:
|
||||
# 中奖规则（简化版，实际可查官方）
|
||||
# 一等奖：投注号码与当期开奖号码全部相同(顺序不限，下同)，即中奖；
|
||||
if red_hit == 5 and blue_hit == 2:
|
||||
return '一等奖', 10000000
|
||||
# 二等奖：投注号码与当期开奖号码中的五个前区号码及任意一个后区号码相同，即中奖；
|
||||
elif red_hit == 5 and blue_hit == 1:
|
||||
return '二等奖', 5000000
|
||||
# 三等奖：投注号码与当期开奖号码中的五个前区号码相同，即中奖；
|
||||
elif red_hit == 5 and blue_hit == 0:
|
||||
return '三等奖', 3000
|
||||
# 四等奖：投注号码与当期开奖号码中的任意四个前区号码及两个后区号码相同，即中奖；
|
||||
elif red_hit == 4 and blue_hit == 2:
|
||||
return '四等奖', 200
|
||||
# 五等奖：投注号码与当期开奖号码中的任意四个前区号码及任意一个后区号码相同，即中奖；
|
||||
elif red_hit == 4 and blue_hit == 1:
|
||||
return '五等奖', 10
|
||||
# 六等奖：投注号码与当期开奖号码中的任意三个前区号码及两个后区号码相同，即中奖；
|
||||
elif red_hit == 3 and blue_hit == 2:
|
||||
return '五等奖', 10
|
||||
elif (red_hit == 2 and blue_hit == 2) or (red_hit == 1 and blue_hit == 2) or (red_hit == 0 and blue_hit == 2):
|
||||
return '六等奖', 5
|
||||
# 七等奖：投注号码与当期开奖号码中的任意四个前区号码相同，即中奖；
|
||||
elif red_hit == 4 and blue_hit == 0:
|
||||
return '七等奖', 5
|
||||
# 八等奖：投注号码与当期开奖号码中的任意三个前区号码及任意一个后区号码相同，或者任意两个前区号码及两个后区号码相同，即中奖；
|
||||
elif (red_hit == 3 and blue_hit == 1) or (red_hit == 2 and blue_hit == 2):
|
||||
return '八等奖', 5
|
||||
# 九等奖：投注号码与当期开奖号码中的任意三个前区号码相同，或者任意一个前区号码及两个后区号码相同，或者任意两个前区号码及任意一个后区号码相同，或者两个后区号码相同，即中奖。
|
||||
elif (red_hit == 3 and blue_hit == 0) or (red_hit == 1 and blue_hit == 2) or (red_hit == 2 and blue_hit == 1) or (red_hit == 0 and blue_hit == 2):
|
||||
return '九等奖', 5
|
||||
else:
|
||||
return None, None
|
||||
|
||||
|
||||
@ -2,15 +2,17 @@
|
||||
<div>
|
||||
<div class="nav-bar">
|
||||
<div class="nav-logo">好运早餐铺</div>
|
||||
<ul class="nav-menu">
|
||||
<li class="nav-item" :class="{active: $route.path === '/'}" @click="handleNav('/')">早点摊</li>
|
||||
<li class="nav-item" :class="{active: $route.path === '/ssq'}" @click="handleNav('/ssq')">红蓝球煎饼</li>
|
||||
<li class="nav-item" :class="{active: $route.path === '/dlt'}" @click="handleNav('/dlt')">大乐斗豆浆</li>
|
||||
<li class="nav-item" :class="{active: $route.path === '/statistics'}" @click="handleNav('/statistics')">数据小菜</li>
|
||||
<li class="nav-item" :class="{active: $route.path === '/advanced-analysis'}" @click="handleNav('/advanced-analysis')">老板推荐</li>
|
||||
<li class="nav-item" :class="{active: $route.path === '/prediction'}" @click="handleNav('/prediction')">灵感早点</li>
|
||||
<li class="nav-item" :class="{active: $route.path === '/number-generator'}" @click="handleNav('/number-generator')">一键下单</li>
|
||||
</ul>
|
||||
<div class="nav-tabs-wrapper">
|
||||
<ul class="nav-tabs">
|
||||
<li class="nav-tab" :class="{active: $route.path === '/'}" @click="handleNav('/')">早点摊</li>
|
||||
<li class="nav-tab" :class="{active: $route.path === '/ssq'}" @click="handleNav('/ssq')">红蓝球煎饼</li>
|
||||
<li class="nav-tab" :class="{active: $route.path === '/dlt'}" @click="handleNav('/dlt')">大乐斗豆浆</li>
|
||||
<li class="nav-tab" :class="{active: $route.path === '/statistics'}" @click="handleNav('/statistics')">数据小菜</li>
|
||||
<li class="nav-tab" :class="{active: $route.path === '/advanced-analysis'}" @click="handleNav('/advanced-analysis')">老板推荐</li>
|
||||
<li class="nav-tab" :class="{active: $route.path === '/prediction'}" @click="handleNav('/prediction')">灵感早点</li>
|
||||
<li class="nav-tab" :class="{active: $route.path === '/number-generator'}" @click="handleNav('/number-generator')">一键下单</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<router-view />
|
||||
</div>
|
||||
@ -28,7 +30,6 @@ export default {
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 只保留必要的全局样式，去除旧的el-menu等样式 */
|
||||
.layout-container {
|
||||
min-height: 100vh;
|
||||
display: flex;
|
||||
@ -52,27 +53,136 @@ export default {
|
||||
color: #909399;
|
||||
}
|
||||
|
||||
.nav-bar {
|
||||
background: #f7ecd7;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.nav-logo {
|
||||
font-size: 22px;
|
||||
font-weight: bold;
|
||||
color: #6B4F2B;
|
||||
padding: 16px 16px 0 16px;
|
||||
background: #f7ecd7;
|
||||
}
|
||||
|
||||
.nav-tabs-wrapper {
|
||||
width: 100%;
|
||||
overflow-x: auto;
|
||||
background: #f7ecd7;
|
||||
box-sizing: border-box;
|
||||
border-bottom: 1.5px solid #e9d8a6;
|
||||
margin-top: 8px;
|
||||
}
|
||||
|
||||
.nav-tabs {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: nowrap;
|
||||
min-width: max-content;
|
||||
width: fit-content;
|
||||
margin: 0;
|
||||
padding: 0 8px;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.nav-tab {
|
||||
flex: 0 0 auto;
|
||||
white-space: nowrap;
|
||||
font-size: 16px;
|
||||
padding: 12px 18px 10px 18px;
|
||||
margin: 0 2px;
|
||||
background: transparent;
|
||||
color: #6B4F2B;
|
||||
border: none;
|
||||
border-bottom: 2.5px solid transparent;
|
||||
transition: color 0.18s, border-bottom 0.18s;
|
||||
cursor: pointer;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.nav-tab.active,
|
||||
.nav-tab:active {
|
||||
color: #4B2E13;
|
||||
font-weight: bold;
|
||||
border-bottom: 2.5px solid #a7c957;
|
||||
background: #f9e3e3;
|
||||
}
|
||||
|
||||
.nav-tabs::-webkit-scrollbar {
|
||||
height: 4px;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.nav-tabs::-webkit-scrollbar-thumb {
|
||||
background: #e9d8a6;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
.nav-bar {
|
||||
flex-direction: column;
|
||||
padding: 0 8px;
|
||||
margin-top: 16px;
|
||||
margin-bottom: 16px;
|
||||
background: #f7ecd7;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
.nav-logo {
|
||||
font-size: 22px;
|
||||
margin-bottom: 8px;
|
||||
font-weight: bold;
|
||||
color: #6B4F2B;
|
||||
padding: 16px 16px 0 16px;
|
||||
background: #f7ecd7;
|
||||
}
|
||||
.nav-menu {
|
||||
min-width: 0;
|
||||
max-width: 100%;
|
||||
padding: 0 8px;
|
||||
height: 48px;
|
||||
.nav-tabs-wrapper {
|
||||
width: 100%;
|
||||
overflow-x: auto;
|
||||
background: #f7ecd7;
|
||||
box-sizing: border-box;
|
||||
border-bottom: 1.5px solid #e9d8a6;
|
||||
margin-top: 8px;
|
||||
}
|
||||
.nav-item {
|
||||
min-width: 60px;
|
||||
font-size: 15px;
|
||||
.nav-tabs {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: nowrap;
|
||||
min-width: max-content;
|
||||
width: fit-content;
|
||||
margin: 0;
|
||||
padding: 0 8px;
|
||||
list-style: none;
|
||||
}
|
||||
.nav-tab {
|
||||
flex: 0 0 auto;
|
||||
white-space: nowrap;
|
||||
font-size: 16px;
|
||||
padding: 12px 18px 10px 18px;
|
||||
margin: 0 2px;
|
||||
background: transparent;
|
||||
color: #6B4F2B;
|
||||
border: none;
|
||||
border-bottom: 2.5px solid transparent;
|
||||
transition: color 0.18s, border-bottom 0.18s;
|
||||
cursor: pointer;
|
||||
outline: none;
|
||||
}
|
||||
.nav-tab.active,
|
||||
.nav-tab:active {
|
||||
color: #4B2E13;
|
||||
font-weight: bold;
|
||||
border-bottom: 2.5px solid #a7c957;
|
||||
background: #f9e3e3;
|
||||
}
|
||||
.nav-tabs::-webkit-scrollbar {
|
||||
height: 4px;
|
||||
background: transparent;
|
||||
}
|
||||
.nav-tabs::-webkit-scrollbar-thumb {
|
||||
background: #e9d8a6;
|
||||
border-radius: 2px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -239,19 +239,64 @@ html, body {
|
||||
}
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
.el-col {
|
||||
/* 红蓝球煎饼页面专项修正 */
|
||||
.el-table, .el-table__body, .el-table__header {
|
||||
display: block !important;
|
||||
width: 100% !important;
|
||||
overflow-x: auto !important;
|
||||
box-sizing: border-box !important;
|
||||
}
|
||||
|
||||
.el-form-item__label {
|
||||
float: none;
|
||||
display: block;
|
||||
text-align: left;
|
||||
padding: 0 0 8px;
|
||||
.el-table th, .el-table td {
|
||||
white-space: normal !important;
|
||||
word-break: break-all !important;
|
||||
padding: 8px 4px !important;
|
||||
font-size: 14px !important;
|
||||
}
|
||||
|
||||
.el-form-item__content {
|
||||
margin-left: 0 !important;
|
||||
.el-table .el-button,
|
||||
.el-table .button-group {
|
||||
max-width: 100% !important;
|
||||
flex-wrap: wrap !important;
|
||||
white-space: normal !important;
|
||||
}
|
||||
.el-card, .el-table__wrapper {
|
||||
max-width: 100vw !important;
|
||||
overflow-x: auto !important;
|
||||
box-sizing: border-box !important;
|
||||
}
|
||||
.el-form, .el-form-item, .el-form-item__content {
|
||||
max-width: 100% !important;
|
||||
box-sizing: border-box !important;
|
||||
flex-wrap: wrap !important;
|
||||
}
|
||||
.el-input, .el-select, .el-date-editor, .el-button {
|
||||
max-width: 100% !important;
|
||||
box-sizing: border-box !important;
|
||||
}
|
||||
/* 新鲜出锅一行一栏，仅影响该区域 */
|
||||
.single-col-row {
|
||||
display: flex !important;
|
||||
flex-direction: column !important;
|
||||
}
|
||||
.single-col-row > .el-col {
|
||||
width: 100% !important;
|
||||
max-width: 100% !important;
|
||||
display: block !important;
|
||||
float: none !important;
|
||||
box-sizing: border-box !important;
|
||||
}
|
||||
/* 出锅记录表格横向可滚动，内容完整显示 */
|
||||
.el-table__wrapper, .el-card__body {
|
||||
overflow-x: auto !important;
|
||||
padding-bottom: 0 !important;
|
||||
}
|
||||
.el-table {
|
||||
min-width: 600px !important;
|
||||
width: max-content !important;
|
||||
}
|
||||
.el-table th, .el-table td {
|
||||
white-space: nowrap !important;
|
||||
padding: 8px 8px !important;
|
||||
font-size: 14px !important;
|
||||
}
|
||||
}
|
||||
|
||||
@ -548,4 +593,161 @@ body, #app {
|
||||
color: #4B2E13;
|
||||
font-weight: bold;
|
||||
box-shadow: 0 2px 8px 0 rgba(249,227,227,0.08);
|
||||
}
|
||||
|
||||
/* ======= 移动端适配样式合并自mobile.css ======= */
|
||||
@media screen and (max-width: 480px) {
|
||||
:root { --mobile-padding: 12px !important; --mobile-margin: 8px !important; }
|
||||
.nav-logo { font-size: 20px !important; }
|
||||
.nav-item { font-size: 12px !important; padding: 6px 8px !important; min-width: 50px !important; }
|
||||
.ball { width: 20px !important; height: 20px !important; font-size: 10px !important; }
|
||||
.chart { height: 200px !important; }
|
||||
.el-button { font-size: 12px !important; padding: 8px 16px !important; }
|
||||
.generate-btn, .copy-all-btn { font-size: 14px !important; padding: 12px !important; }
|
||||
.el-table { font-size: 10px !important; }
|
||||
.el-table th, .el-table td { padding: 6px 2px !important; }
|
||||
}
|
||||
|
||||
@media screen and (max-width: 768px) and (orientation: landscape) {
|
||||
.nav-bar { flex-direction: row !important; height: 60px !important; }
|
||||
.nav-logo { margin-bottom: 0 !important; margin-right: 20px !important; }
|
||||
.nav-menu { height: 48px !important; }
|
||||
.chart { height: 200px !important; }
|
||||
}
|
||||
|
||||
@media (hover: none) and (pointer: coarse) {
|
||||
.el-button, .nav-item, .tab-btn { min-height: 44px !important; min-width: 44px !important; }
|
||||
.el-button { padding: 12px 20px !important; }
|
||||
.nav-item { padding: 10px 16px !important; }
|
||||
.tab-btn { padding: 10px 16px !important; }
|
||||
.el-button:active, .nav-item:active, .tab-btn:active { transform: scale(0.95) !important; transition: transform 0.1s !important; }
|
||||
}
|
||||
|
||||
@media screen and (-webkit-min-device-pixel-ratio: 2) {
|
||||
.ball { border: 1px solid rgba(0, 0, 0, 0.1) !important; }
|
||||
.el-card { border: 0.5px solid #E9D8A6 !important; }
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
/* 如果系统支持深色模式，可以在这里添加深色主题样式 */
|
||||
}
|
||||
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
* { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
|
||||
}
|
||||
|
||||
/* 早点补货区域整体布局优化 */
|
||||
.update-card .card-header {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
justify-content: flex-start;
|
||||
gap: 24px;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
.update-card .card-header > span {
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
color: #6B4F2B;
|
||||
min-width: 100px;
|
||||
margin-top: 6px;
|
||||
}
|
||||
|
||||
.update-buttons {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 14px;
|
||||
align-items: flex-start;
|
||||
width: 100%;
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.update-buttons .el-button {
|
||||
width: 180px;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
border-radius: 24px;
|
||||
background: linear-gradient(90deg, #f7e7d5 0%, #f9e3e3 100%);
|
||||
color: #6B4F2B;
|
||||
box-shadow: 0 2px 8px 0 rgba(233, 216, 166, 0.10);
|
||||
margin: 0;
|
||||
transition: background 0.2s, color 0.2s;
|
||||
text-align: left;
|
||||
padding-left: 18px;
|
||||
}
|
||||
|
||||
.update-buttons .el-button:active {
|
||||
background: #f9e3e3;
|
||||
color: #4B2E13;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
.update-card .card-header {
|
||||
flex-direction: column;
|
||||
align-items: stretch;
|
||||
gap: 10px;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
.update-buttons {
|
||||
width: 100%;
|
||||
align-items: stretch;
|
||||
gap: 10px;
|
||||
}
|
||||
.update-buttons .el-button {
|
||||
width: 100%;
|
||||
font-size: 16px;
|
||||
padding-left: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
/* 彻底去除el-card底部空白和多余圆角 */
|
||||
.update-card,
|
||||
.update-card .el-card,
|
||||
.update-card .el-card__body {
|
||||
margin-bottom: 0 !important;
|
||||
padding-bottom: 0 !important;
|
||||
border-radius: 24px !important;
|
||||
}
|
||||
|
||||
.update-card .el-card__body {
|
||||
min-height: 0 !important;
|
||||
height: auto !important;
|
||||
display: flex !important;
|
||||
flex-direction: column !important;
|
||||
justify-content: flex-start !important;
|
||||
}
|
||||
|
||||
.update-card .el-row,
|
||||
.update-card .el-col {
|
||||
margin-bottom: 0 !important;
|
||||
padding-bottom: 0 !important;
|
||||
}
|
||||
|
||||
.update-card .el-card__body > :last-child {
|
||||
margin-bottom: 0 !important;
|
||||
padding-bottom: 0 !important;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
.update-card,
|
||||
.update-card .el-card,
|
||||
.update-card .el-card__body {
|
||||
margin-bottom: 0 !important;
|
||||
padding-bottom: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
.update-message {
|
||||
min-height: 0 !important;
|
||||
margin: 0 !important;
|
||||
padding: 0 !important;
|
||||
}
|
||||
|
||||
.update-card .el-card__body > :last-child {
|
||||
margin-bottom: 0 !important;
|
||||
}
|
||||
|
||||
/* 如果el-alert未显示，彻底不占位 */
|
||||
.update-message:empty {
|
||||
display: none !important;
|
||||
}
|
||||
560
frontend/src/assets/mobile.css
Normal file
560
frontend/src/assets/mobile.css
Normal file
@ -0,0 +1,560 @@
|
||||
/* 移动端专用样式文件 */
|
||||
/* 移动端断点定义 */
|
||||
:root {
|
||||
--mobile-breakpoint: 768px;
|
||||
--tablet-breakpoint: 1024px;
|
||||
--mobile-padding: 16px;
|
||||
--mobile-margin: 12px;
|
||||
}
|
||||
|
||||
/* 移动端基础样式重置 */
|
||||
@media screen and (max-width: 768px) {
|
||||
html, body {
|
||||
font-size: 14px;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
/* 导航栏移动端适配 */
|
||||
.nav-bar {
|
||||
flex-direction: column;
|
||||
padding: 0 var(--mobile-padding);
|
||||
margin-top: 16px;
|
||||
margin-bottom: 16px;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.nav-logo {
|
||||
font-size: 24px;
|
||||
margin-bottom: 12px;
|
||||
margin-right: 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.nav-menu {
|
||||
overflow-x: auto;
|
||||
flex-wrap: nowrap;
|
||||
scrollbar-width: thin;
|
||||
scrollbar-color: #E9D8A6 #fff;
|
||||
}
|
||||
|
||||
.nav-item {
|
||||
white-space: nowrap;
|
||||
font-size: 13px;
|
||||
padding: 8px 6px;
|
||||
min-width: 0;
|
||||
flex: 1 1 auto;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 卡片移动端适配 */
|
||||
.el-card {
|
||||
margin-bottom: var(--mobile-margin);
|
||||
border-radius: 16px;
|
||||
}
|
||||
|
||||
.el-card__header {
|
||||
padding: 16px 20px;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.el-card__body {
|
||||
padding: 16px 20px;
|
||||
}
|
||||
|
||||
/* 按钮移动端适配 */
|
||||
.el-button {
|
||||
border-radius: 20px;
|
||||
font-size: 14px;
|
||||
padding: 10px 24px;
|
||||
min-width: 80px;
|
||||
}
|
||||
|
||||
.update-buttons {
|
||||
gap: 6px;
|
||||
}
|
||||
|
||||
.update-buttons .el-button {
|
||||
padding: 8px 0;
|
||||
font-size: 14px;
|
||||
min-width: 0;
|
||||
width: 100%;
|
||||
border-radius: 16px;
|
||||
}
|
||||
|
||||
.update-card .card-header {
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
/* 表格移动端适配 */
|
||||
.el-table {
|
||||
font-size: 12px;
|
||||
border-radius: 12px;
|
||||
}
|
||||
|
||||
.el-table th,
|
||||
.el-table td {
|
||||
padding: 8px 4px;
|
||||
}
|
||||
|
||||
/* 表格内容自动换行 */
|
||||
.el-table .cell {
|
||||
white-space: normal;
|
||||
word-break: break-word;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
/* 操作按钮组移动端适配 */
|
||||
.button-group {
|
||||
flex-direction: column;
|
||||
gap: 6px;
|
||||
}
|
||||
|
||||
.button-group .el-button {
|
||||
width: 100%;
|
||||
margin-bottom: 4px;
|
||||
font-size: 12px;
|
||||
padding: 6px 12px;
|
||||
}
|
||||
|
||||
/* 表单移动端适配 */
|
||||
.el-form-item {
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.el-form-item__label {
|
||||
font-size: 14px;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
.el-form-item__content {
|
||||
margin-top: 8px;
|
||||
}
|
||||
|
||||
.el-input,
|
||||
.el-select,
|
||||
.el-textarea {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
/* 分页移动端适配 */
|
||||
.el-pagination {
|
||||
justify-content: center;
|
||||
flex-wrap: wrap;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.el-pagination .el-pager li {
|
||||
min-width: 32px;
|
||||
height: 32px;
|
||||
line-height: 32px;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
/* 标签页移动端适配 */
|
||||
.el-tabs__item {
|
||||
font-size: 14px;
|
||||
padding: 0 12px;
|
||||
}
|
||||
|
||||
/* 对话框移动端适配 */
|
||||
.el-dialog {
|
||||
width: 90% !important;
|
||||
margin: 5vh auto !important;
|
||||
border-radius: 16px;
|
||||
}
|
||||
|
||||
.el-dialog__header {
|
||||
padding: 16px 20px;
|
||||
}
|
||||
|
||||
.el-dialog__body {
|
||||
padding: 16px 20px;
|
||||
}
|
||||
|
||||
.el-dialog__footer {
|
||||
padding: 16px 20px;
|
||||
}
|
||||
|
||||
/* 图表移动端适配 */
|
||||
.chart {
|
||||
height: 300px !important;
|
||||
min-height: 250px;
|
||||
}
|
||||
|
||||
.chart-card {
|
||||
margin-bottom: var(--mobile-margin);
|
||||
}
|
||||
|
||||
/* 号码球移动端适配 */
|
||||
.ball {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
font-size: 12px;
|
||||
margin: 0 2px;
|
||||
}
|
||||
|
||||
.numbers {
|
||||
flex-wrap: wrap;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.red-balls,
|
||||
.blue-balls,
|
||||
.front-balls,
|
||||
.back-balls {
|
||||
flex-wrap: wrap;
|
||||
gap: 4px;
|
||||
}
|
||||
|
||||
/* 快速操作按钮移动端适配 */
|
||||
.quick-btn {
|
||||
font-size: 14px;
|
||||
padding: 12px 0;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
/* 布局移动端适配 */
|
||||
.el-row {
|
||||
flex-direction: column !important;
|
||||
}
|
||||
|
||||
.el-col {
|
||||
width: 100% !important;
|
||||
max-width: 100% !important;
|
||||
flex: 0 0 100% !important;
|
||||
}
|
||||
|
||||
.data-card {
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
/* 卡片头部移动端适配 */
|
||||
.card-header {
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
/* 状态信息移动端适配 */
|
||||
.status-item {
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
gap: 4px;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.status-label {
|
||||
font-weight: bold;
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
|
||||
.status-value,
|
||||
.status-time {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
/* 订单信息移动端适配 */
|
||||
.order-info {
|
||||
text-align: center;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.order-time,
|
||||
.order-batch {
|
||||
font-size: 14px;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
/* 号码显示移动端适配 */
|
||||
.number-display {
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
padding: 12px;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.number-display.multi {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.order-index {
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.recommend-type {
|
||||
font-size: 12px;
|
||||
margin-top: 8px;
|
||||
}
|
||||
|
||||
/* 历史记录移动端适配 */
|
||||
.history-header {
|
||||
flex-direction: column;
|
||||
gap: 12px;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.history-tabs {
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.tab-btn {
|
||||
flex: 1;
|
||||
font-size: 14px;
|
||||
padding: 8px 12px;
|
||||
}
|
||||
|
||||
.check-win-btn {
|
||||
width: 100%;
|
||||
font-size: 14px;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.history-group {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.group-header {
|
||||
flex-direction: column;
|
||||
gap: 4px;
|
||||
margin-bottom: 12px;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.group-number-item {
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
padding: 12px;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.win-info {
|
||||
text-align: center;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.win-level {
|
||||
display: block;
|
||||
font-weight: bold;
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
|
||||
.win-amount {
|
||||
display: block;
|
||||
color: #67c23a;
|
||||
}
|
||||
|
||||
/* 生成按钮移动端适配 */
|
||||
.generate-btn,
|
||||
.copy-all-btn {
|
||||
width: 100%;
|
||||
font-size: 16px;
|
||||
padding: 14px;
|
||||
margin-bottom: 12px;
|
||||
border-radius: 20px;
|
||||
}
|
||||
|
||||
/* 高级分析页面移动端适配 */
|
||||
.analysis-container {
|
||||
padding: var(--mobile-padding);
|
||||
}
|
||||
|
||||
.analysis-tabs {
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.analysis-chart {
|
||||
height: 250px;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.analysis-summary {
|
||||
font-size: 14px;
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
/* 预测页面移动端适配 */
|
||||
.prediction-container {
|
||||
padding: var(--mobile-padding);
|
||||
}
|
||||
|
||||
.prediction-form {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.prediction-result {
|
||||
margin-top: 16px;
|
||||
}
|
||||
|
||||
.prediction-numbers {
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
/* 工具提示移动端适配 */
|
||||
.el-tooltip__popper {
|
||||
max-width: 200px;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
/* 加载状态移动端适配 */
|
||||
.el-loading-mask {
|
||||
border-radius: 16px;
|
||||
}
|
||||
|
||||
/* 消息提示移动端适配 */
|
||||
.el-message {
|
||||
min-width: 200px;
|
||||
max-width: 90%;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
/* 确认框移动端适配 */
|
||||
.el-message-box {
|
||||
width: 90% !important;
|
||||
border-radius: 16px;
|
||||
}
|
||||
|
||||
.el-message-box__header {
|
||||
padding: 16px 20px;
|
||||
}
|
||||
|
||||
.el-message-box__content {
|
||||
padding: 16px 20px;
|
||||
}
|
||||
|
||||
.el-message-box__btns {
|
||||
padding: 16px 20px;
|
||||
}
|
||||
}
|
||||
|
||||
/* 超小屏幕适配 (小于480px) */
|
||||
@media screen and (max-width: 480px) {
|
||||
:root {
|
||||
--mobile-padding: 12px;
|
||||
--mobile-margin: 8px;
|
||||
}
|
||||
|
||||
.nav-logo {
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
.nav-item {
|
||||
font-size: 12px;
|
||||
padding: 6px 8px;
|
||||
min-width: 50px;
|
||||
}
|
||||
|
||||
.ball {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
font-size: 10px;
|
||||
}
|
||||
|
||||
.chart {
|
||||
height: 200px !important;
|
||||
}
|
||||
|
||||
.el-button {
|
||||
font-size: 12px;
|
||||
padding: 8px 16px;
|
||||
}
|
||||
|
||||
.generate-btn,
|
||||
.copy-all-btn {
|
||||
font-size: 14px;
|
||||
padding: 12px;
|
||||
}
|
||||
|
||||
.el-table {
|
||||
font-size: 10px;
|
||||
}
|
||||
|
||||
.el-table th,
|
||||
.el-table td {
|
||||
padding: 6px 2px;
|
||||
}
|
||||
}
|
||||
|
||||
/* 横屏模式适配 */
|
||||
@media screen and (max-width: 768px) and (orientation: landscape) {
|
||||
.nav-bar {
|
||||
flex-direction: row;
|
||||
height: 60px;
|
||||
}
|
||||
|
||||
.nav-logo {
|
||||
margin-bottom: 0;
|
||||
margin-right: 20px;
|
||||
}
|
||||
|
||||
.nav-menu {
|
||||
height: 48px;
|
||||
}
|
||||
|
||||
.chart {
|
||||
height: 200px !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* 触摸优化 */
|
||||
@media (hover: none) and (pointer: coarse) {
|
||||
.el-button,
|
||||
.nav-item,
|
||||
.tab-btn {
|
||||
min-height: 44px;
|
||||
min-width: 44px;
|
||||
}
|
||||
|
||||
.el-button {
|
||||
padding: 12px 20px;
|
||||
}
|
||||
|
||||
.nav-item {
|
||||
padding: 10px 16px;
|
||||
}
|
||||
|
||||
.tab-btn {
|
||||
padding: 10px 16px;
|
||||
}
|
||||
|
||||
/* 增加触摸反馈 */
|
||||
.el-button:active,
|
||||
.nav-item:active,
|
||||
.tab-btn:active {
|
||||
transform: scale(0.95);
|
||||
transition: transform 0.1s;
|
||||
}
|
||||
}
|
||||
|
||||
/* 高分辨率屏幕优化 */
|
||||
@media screen and (-webkit-min-device-pixel-ratio: 2) {
|
||||
.ball {
|
||||
border: 1px solid rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.el-card {
|
||||
border: 0.5px solid #E9D8A6;
|
||||
}
|
||||
}
|
||||
|
||||
/* 深色模式支持 */
|
||||
@media (prefers-color-scheme: dark) {
|
||||
/* 如果系统支持深色模式，可以在这里添加深色主题样式 */
|
||||
}
|
||||
|
||||
/* 减少动画（用户偏好） */
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
* {
|
||||
animation-duration: 0.01ms !important;
|
||||
animation-iteration-count: 1 !important;
|
||||
transition-duration: 0.01ms !important;
|
||||
}
|
||||
}
|
||||
@ -37,9 +37,13 @@
|
||||
</div>
|
||||
</template>
|
||||
<el-table :data="tableData" style="width: 100%" v-loading="loading">
|
||||
<el-table-column prop="issue" label="早点编号" width="100"></el-table-column>
|
||||
<el-table-column prop="open_date" label="出锅日期" width="120"></el-table-column>
|
||||
<el-table-column label="出锅号码">
|
||||
<el-table-column prop="issue" label="早点编号" width="100" align="center"></el-table-column>
|
||||
<el-table-column prop="open_time" label="出锅日期" width="120" align="center">
|
||||
<template #default="{ row }">
|
||||
{{ formatDate(row.open_time) }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="出锅号码" align="center">
|
||||
<template #default="{ row }">
|
||||
<div class="lottery-numbers">
|
||||
<span v-for="i in 5" :key="i" class="front-ball">{{ row[`front_ball_${i}`] }}</span>
|
||||
@ -47,7 +51,7 @@
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" width="150">
|
||||
<el-table-column label="操作" width="150" align="center">
|
||||
<template #default="{ row }">
|
||||
<el-button type="text" @click="handleEdit(row)">加料</el-button>
|
||||
<el-button type="text" @click="handleDelete(row)">撤单</el-button>
|
||||
@ -334,6 +338,12 @@ const handleCurrentChange = (val) => {
|
||||
fetchData()
|
||||
}
|
||||
|
||||
// 格式化日期
|
||||
const formatDate = (date) => {
|
||||
if (!date) return ''
|
||||
return dayjs(date).format('YYYY-MM-DD')
|
||||
}
|
||||
|
||||
// 初始化
|
||||
onMounted(() => {
|
||||
// 然后获取完整列表
|
||||
@ -364,19 +374,26 @@ onMounted(() => {
|
||||
|
||||
.lottery-numbers {
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
min-height: 32px;
|
||||
height: 32px;
|
||||
}
|
||||
|
||||
.front-ball,
|
||||
.back-ball {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
border-radius: 50%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: white;
|
||||
font-weight: bold;
|
||||
font-size: 16px;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.front-ball {
|
||||
@ -401,4 +418,13 @@ onMounted(() => {
|
||||
.upload-demo {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.el-table__cell {
|
||||
padding-top: 8px !important;
|
||||
padding-bottom: 8px !important;
|
||||
padding-left: 0 !important;
|
||||
padding-right: 0 !important;
|
||||
line-height: 32px !important;
|
||||
vertical-align: middle !important;
|
||||
}
|
||||
</style>
|
||||
@ -50,7 +50,7 @@
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-row :gutter="20">
|
||||
<el-row :gutter="20" class="single-col-row">
|
||||
<el-col :span="12">
|
||||
<el-card class="data-card">
|
||||
<template #header>
|
||||
@ -116,14 +116,12 @@
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-row :gutter="20" class="quick-row">
|
||||
<el-col :xs="24" :sm="12" :md="6" v-for="(item, idx) in quickActions" :key="idx">
|
||||
<el-button type="primary" class="quick-btn" @click="navigateTo(item.route)">
|
||||
<el-icon v-if="item.icon"><component :is="item.icon" /></el-icon>
|
||||
{{ item.label }}
|
||||
</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<div class="quick-row">
|
||||
<el-button v-for="(item, idx) in quickActions" :key="idx" class="quick-btn" @click="navigateTo(item.route)">
|
||||
<el-icon v-if="item.icon"><component :is="item.icon" /></el-icon>
|
||||
{{ item.label }}
|
||||
</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -382,38 +380,46 @@ onMounted(() => {
|
||||
}
|
||||
|
||||
.quick-row {
|
||||
margin-top: 20px;
|
||||
margin-top: 24px;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
gap: 12px 8px;
|
||||
}
|
||||
|
||||
.quick-btn {
|
||||
width: 100%;
|
||||
margin-bottom: 16px;
|
||||
border-radius: 12px;
|
||||
font-size: 18px;
|
||||
font-weight: 500;
|
||||
padding: 18px 0;
|
||||
min-width: 110px;
|
||||
height: 40px;
|
||||
border-radius: 20px !important;
|
||||
background: #f8f5f0;
|
||||
color: #a67c52;
|
||||
font-weight: 600;
|
||||
font-size: 16px;
|
||||
box-shadow: 0 2px 8px 0 rgba(166,124,82,0.08);
|
||||
border: none;
|
||||
transition: background 0.2s, color 0.2s;
|
||||
padding: 0 18px;
|
||||
margin: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
box-shadow: 0 2px 8px 0 rgba(64,158,255,0.08);
|
||||
}
|
||||
|
||||
@media screen and (max-width: 900px) {
|
||||
.quick-btn {
|
||||
font-size: 16px;
|
||||
padding: 14px 0;
|
||||
}
|
||||
|
||||
.update-buttons {
|
||||
flex-direction: column;
|
||||
}
|
||||
.quick-btn:hover, .quick-btn:focus {
|
||||
background: #ffe9c6;
|
||||
color: #d4a15a;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 600px) {
|
||||
@media (max-width: 600px) {
|
||||
.quick-row {
|
||||
gap: 8px 0;
|
||||
}
|
||||
.quick-btn {
|
||||
min-width: 0;
|
||||
flex: 1 1 45%;
|
||||
font-size: 15px;
|
||||
padding: 10px 0;
|
||||
padding: 0 8px;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -557,22 +557,24 @@ export default {
|
||||
margin-right: 8px;
|
||||
}
|
||||
.ball {
|
||||
display: inline-block;
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
border-radius: 50%;
|
||||
text-align: center;
|
||||
line-height: 36px;
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
font-size: 1.1rem;
|
||||
color: white;
|
||||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
|
||||
color: #fff;
|
||||
margin: 0 2px;
|
||||
line-height: 1;
|
||||
background: #ff4757;
|
||||
}
|
||||
.ball.red {
|
||||
background: linear-gradient(135deg, #e74c3c, #c0392b);
|
||||
.red-ball, .ball.red {
|
||||
background: #f56c6c !important;
|
||||
}
|
||||
.ball.blue {
|
||||
background: linear-gradient(135deg, #3498db, #2980b9);
|
||||
.blue-ball, .ball.blue {
|
||||
background: #409eff !important;
|
||||
}
|
||||
.separator {
|
||||
font-size: 1.5rem;
|
||||
@ -794,6 +796,15 @@ export default {
|
||||
color: #aaa;
|
||||
font-size: 0.98rem;
|
||||
}
|
||||
.red-balls,
|
||||
.blue-balls {
|
||||
overflow-x: auto;
|
||||
white-space: nowrap;
|
||||
min-width: 0;
|
||||
flex-wrap: nowrap !important;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
@media (max-width: 768px) {
|
||||
.number-generator {
|
||||
padding: 10px;
|
||||
|
||||
@ -162,7 +162,7 @@
|
||||
<!-- 预测操作按钮区域 -->
|
||||
<div class="prediction-actions">
|
||||
<el-row :gutter="20" justify="center" align="middle">
|
||||
<el-col :span="6">
|
||||
<el-col :span="8" :xs="24">
|
||||
<el-button
|
||||
type="primary"
|
||||
@click="predictML"
|
||||
@ -172,7 +172,7 @@
|
||||
{{ modelStatus && modelStatus.type !== 'error' ? 'AI灵感煎饼' : 'AI和面中' }}
|
||||
</el-button>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-col :span="8" :xs="24">
|
||||
<el-button
|
||||
type="warning"
|
||||
@click="predictPattern"
|
||||
@ -182,7 +182,7 @@
|
||||
老板经验豆浆
|
||||
</el-button>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-col :span="8" :xs="24">
|
||||
<el-button
|
||||
type="info"
|
||||
@click="predictEnsemble"
|
||||
@ -612,6 +612,33 @@ export default {
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.prediction-actions .el-button {
|
||||
width: 100%;
|
||||
height: 40px;
|
||||
border-radius: 20px !important;
|
||||
background: #f8f5f0;
|
||||
color: #a67c52;
|
||||
font-weight: 600;
|
||||
font-size: 16px;
|
||||
box-shadow: 0 2px 8px 0 rgba(166,124,82,0.08);
|
||||
border: none;
|
||||
transition: background 0.2s, color 0.2s;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.prediction-actions .el-button:hover,
|
||||
.prediction-actions .el-button:focus {
|
||||
background: #ffe9c6;
|
||||
color: #d4a15a;
|
||||
}
|
||||
|
||||
@media (max-width: 600px) {
|
||||
.prediction-actions .el-button {
|
||||
font-size: 15px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.prediction-history {
|
||||
margin-top: 30px;
|
||||
}
|
||||
|
||||
@ -37,9 +37,13 @@
|
||||
</div>
|
||||
</template>
|
||||
<el-table :data="tableData" style="width: 100%" v-loading="loading">
|
||||
<el-table-column prop="issue" label="早点编号" width="100"></el-table-column>
|
||||
<el-table-column prop="open_date" label="出锅日期" width="120"></el-table-column>
|
||||
<el-table-column prop="numbers" label="出锅号码">
|
||||
<el-table-column prop="issue" label="早点编号" width="100" align="center"></el-table-column>
|
||||
<el-table-column prop="open_time" label="出锅日期" width="120" align="center">
|
||||
<template #default="{ row }">
|
||||
{{ formatDate(row.open_time) }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="numbers" label="出锅号码" align="center">
|
||||
<template #default="{ row }">
|
||||
<div class="lottery-numbers">
|
||||
<span v-for="i in 6" :key="i" class="red-ball">{{ row[`red_ball_${i}`] }}</span>
|
||||
@ -47,7 +51,7 @@
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" width="150">
|
||||
<el-table-column label="操作" width="150" align="center">
|
||||
<template #default="{ row }">
|
||||
<el-button type="text" @click="handleEdit(row)">加料</el-button>
|
||||
<el-button type="text" @click="handleDelete(row)">撤单</el-button>
|
||||
@ -332,6 +336,12 @@ const handleCurrentChange = (val) => {
|
||||
fetchData()
|
||||
}
|
||||
|
||||
// 格式化日期
|
||||
const formatDate = (date) => {
|
||||
if (!date) return ''
|
||||
return dayjs(date).format('YYYY-MM-DD')
|
||||
}
|
||||
|
||||
// 初始化
|
||||
onMounted(() => {
|
||||
fetchData()
|
||||
@ -361,19 +371,26 @@ onMounted(() => {
|
||||
|
||||
.lottery-numbers {
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
min-height: 32px;
|
||||
height: 32px;
|
||||
}
|
||||
|
||||
.red-ball,
|
||||
.blue-ball {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
border-radius: 50%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: white;
|
||||
font-weight: bold;
|
||||
font-size: 16px;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.red-ball {
|
||||
@ -398,4 +415,13 @@ onMounted(() => {
|
||||
.upload-demo {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.el-table__cell {
|
||||
padding-top: 8px !important;
|
||||
padding-bottom: 8px !important;
|
||||
padding-left: 0 !important;
|
||||
padding-right: 0 !important;
|
||||
line-height: 32px !important;
|
||||
vertical-align: middle !important;
|
||||
}
|
||||
</style>
|
||||
@ -3,7 +3,7 @@
|
||||
<el-tabs v-model="activeTab">
|
||||
<el-tab-pane label="红蓝球煎饼" name="ssq">
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-col :span="12" :xs="24">
|
||||
<el-card class="chart-card">
|
||||
<template #header>
|
||||
<div class="card-header">
|
||||
@ -13,7 +13,7 @@
|
||||
<div ref="ssqRedChart" class="chart"></div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-col :span="12" :xs="24">
|
||||
<el-card class="chart-card">
|
||||
<template #header>
|
||||
<div class="card-header">
|
||||
@ -28,7 +28,7 @@
|
||||
|
||||
<el-tab-pane label="大乐斗豆浆" name="dlt">
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-col :span="12" :xs="24">
|
||||
<el-card class="chart-card">
|
||||
<template #header>
|
||||
<div class="card-header">
|
||||
@ -38,7 +38,7 @@
|
||||
<div ref="dltFrontChart" class="chart"></div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-col :span="12" :xs="24">
|
||||
<el-card class="chart-card">
|
||||
<template #header>
|
||||
<div class="card-header">
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user