Skip to content

S
sample-form-platform
Commit d324da8c authored by 姬鋆屾's avatar 姬鋆屾
Browse files
Options

推样表改版

parent d0a65501
Show whitespace changes
Inline Side-by-side
Showing with 50102 additions and 9105 deletions
sample-form-client-ui/admin/README.md
View file @ d324da8c
...@@ -29,3 +29,7 @@ yarn lint ...@@ -29,3 +29,7 @@ yarn lint
See [Configuration Reference](https://cli.vuejs.org/config/). See [Configuration Reference](https://cli.vuejs.org/config/).
http://localhost:8081?v=409&serveinfo={"deviceInfo":{"enabled":1,"productId":10,"productName":"样表机","siteCode":"","siteId":1,"siteName":"","source":1},"rabbmitInfo":{"downTopicFilter":"/down/C0-FB-F9-CD-3B-A4","exchangeName":"phxt.pdj","host":"10.12.185.213","messageTtl":"86400000","password":"admin@2020","port":5672,"uploadTopicFilter":"/upload/C0-FB-F9-CD-3B-A4","username":"taxi_mq","virtualHost":"/test"},"serviceInfo":{"homeUrl":"","serverUrl":"http://192.168.0.98:11078/"}}&devicenum=18-93-7F-C0-AD-B5 http://localhost:8081?v=409&serveinfo={"deviceInfo":{"enabled":1,"productId":10,"productName":"样表机","siteCode":"","siteId":1,"siteName":"","source":1},"rabbmitInfo":{"downTopicFilter":"/down/C0-FB-F9-CD-3B-A4","exchangeName":"phxt.pdj","host":"10.12.185.213","messageTtl":"86400000","password":"admin@2020","port":5672,"uploadTopicFilter":"/upload/C0-FB-F9-CD-3B-A4","username":"taxi_mq","virtualHost":"/test"},"serviceInfo":{"homeUrl":"","serverUrl":"http://192.168.0.98:11078/"}}&devicenum=18-93-7F-C0-AD-B5
### 效果图
/_![示例图片](./src/assets/img/baseImg.png) _/
sample-form-client-ui/admin/package-lock.json 0 → 100644
View file @ d324da8c
This source diff could not be displayed because it is too large. You can view the blob instead.
sample-form-client-ui/admin/src/App.vue
View file @ d324da8c
...@@ -216,7 +216,7 @@ export default { ...@@ -216,7 +216,7 @@ export default {
--gradient-ramp-assist3: #48fca5; --gradient-ramp-assist3: #48fca5;
} }
.main-bg-img { .main-bg-img {
background: url("./assets/img/bg(1).jpg") no-repeat; background: url("./assets/img/reg-bg.jpg") no-repeat;
} }
.main-ksck-img { .main-ksck-img {
background: url("./assets/img/btn_kuaisu.png") no-repeat; background: url("./assets/img/btn_kuaisu.png") no-repeat;
......
sample-form-client-ui/admin/src/pages/home/Home.vue
View file @ d324da8c
...@@ -30,7 +30,7 @@ ...@@ -30,7 +30,7 @@
</div> </div>
<!-- 搜索 --> <!-- 搜索 -->
<div class="flex flexc aic"> <div class="flex flexc aic">
<img class="mb32" width="700" src="../../assets/img/png_title@2x.png" /> <!-- <img class="mb32" width="700" src="../../assets/img/png_title@2x.png" /> -->
<div class="search-box"> <div class="search-box">
<el-input <el-input
v-model="search" v-model="search"
...@@ -68,10 +68,10 @@ ...@@ -68,10 +68,10 @@
</el-button> </el-button>
</div> </div>
<div class="hot-search-box flex aic mt28"> <div class="hot-search-box flex aic mt28">
<div class="hot-title flex aic jca"> <!-- <div class="hot-title flex aic jca">
<img src="../../assets/img/icon_hot.png" /> <img src="../../assets/img/icon_hot.png" />
<span>热门词汇：</span> <span>热门词汇：</span>
</div> </div> -->
<div <div
@click="handleClick($event)" @click="handleClick($event)"
v-onEvent="{ v-onEvent="{
...@@ -102,7 +102,6 @@ ...@@ -102,7 +102,6 @@
<span :data-value="v" v-else class="hot-search-item">{{ <span :data-value="v" v-else class="hot-search-item">{{
v.slice(0, 6) + "..." v.slice(0, 6) + "..."
}}</span> }}</span>
<span class="line"></span>
</div> </div>
</div> </div>
</vue-seamless-scroll> </vue-seamless-scroll>
...@@ -111,12 +110,10 @@ ...@@ -111,12 +110,10 @@
</div> </div>
<!-- 主体 --> <!-- 主体 -->
<div class="main flex aic"> <div class="main flex aic">
<div class="ranking mr25 flex flexc"> <div class="ranking flex flexc">
<div> <div class="flex ranking-title">
<img <img class="title_img" src="../../assets/img/reg-icon_hot.png" />
class="ranking-title" <p class="title_txt">热门表单</p>
src="../../assets/img/pic__hot_biaoqian.png"
/>
</div> </div>
<!-- 热门表单列表 --> <!-- 热门表单列表 -->
<div class="ranking-list flex1 flex flexc mt20"> <div class="ranking-list flex1 flex flexc mt20">
...@@ -127,7 +124,20 @@ ...@@ -127,7 +124,20 @@
:key="v.id" :key="v.id"
> >
<div class="flex aic jcc item-index"> <div class="flex aic jcc item-index">
<img v-if="i < 3" :src="checkTopImg(i)" /> <span
v-if="i < 3"
:style="{
color:
i == 0
? '#FF5948'
: i == 1
? '#FF6F48'
: i == 2
? '#FF8D48'
: '#565656',
}"
>{{ i + 1 }}.</span
>
<span v-else>{{ i + 1 }}.</span> <span v-else>{{ i + 1 }}.</span>
</div> </div>
<p <p
...@@ -144,13 +154,14 @@ ...@@ -144,13 +154,14 @@
> >
{{ v.materialName ? v.materialName : v.materiaFullName }} {{ v.materialName ? v.materialName : v.materiaFullName }}
</p> </p>
<p v-if="i < 3" class="text_hot">热</p>
</div> </div>
</div> </div>
<div v-else class="tac empty-text">暂无数据</div> <div v-else class="tac empty-text">暂无数据</div>
</div> </div>
</div> </div>
<div class="right flex flexc aic jcb"> <div class="right flex flexc">
<div class="right-top flex aic jcb"> <div class="right-top">
<router-link <router-link
to="/matterList" to="/matterList"
v-onEvent="{ v-onEvent="{
...@@ -161,22 +172,20 @@ ...@@ -161,22 +172,20 @@
routers: $route, routers: $route,
}" }"
> >
<div class="fill-btn flex aic jcc pointer main-ksck-img"> <div class="top_img_box">
<span class="fill-btn-text1">快</span> <div class="top_img_text_box">
<span class="fill-btn-text2">速</span> <h3 class="text_box_title">快速查看</h3>
<span class="fill-btn-text3">查</span> <p class="text_box_desc">多种样表快捷查看</p>
<span class="fill-btn-text4">看</span> </div>
<img src="../../assets/img/reg-quickbg.png" alt="" />
</div> </div>
</router-link> </router-link>
</div> </div>
<!-- 热门事项 --> <!-- 热门事项 -->
<div class="right-bottom flex flexc"> <div class="right-bottom flex flexc">
<div> <div class="flex ranking-title">
<img <img class="title_img" src="../../assets/img/reg-icon_hot.png" />
height="45" <p class="title_txt">热门事项</p>
class="hot-matter-title"
src="../../assets/img/pic__hot_shixiang.png"
/>
</div> </div>
<div <div
class="hot-matter-list flex1 mt10" class="hot-matter-list flex1 mt10"
...@@ -188,7 +197,20 @@ ...@@ -188,7 +197,20 @@
:key="v.id" :key="v.id"
> >
<div class="flex aic jcc item-index"> <div class="flex aic jcc item-index">
<img v-if="i < 3" :src="checkTopImg(i)" /> <span
v-if="i < 3"
:style="{
color:
i == 0
? '#FF5948'
: i == 1
? '#FF6F48'
: i == 2
? '#FF8D48'
: '#565656',
}"
>{{ i + 1 }}.</span
>
<span v-else>{{ i + 1 }}.</span> <span v-else>{{ i + 1 }}.</span>
</div> </div>
<p <p
...@@ -205,6 +227,7 @@ ...@@ -205,6 +227,7 @@
> >
{{ v.matterName ? v.matterName : v.matterFullName }} {{ v.matterName ? v.matterName : v.matterFullName }}
</p> </p>
<p v-if="i < 3" class="text_hot">热</p>
</div> </div>
</div> </div>
<div v-else class="tac empty-text">暂无数据</div> <div v-else class="tac empty-text">暂无数据</div>
...@@ -268,7 +291,7 @@ export default { ...@@ -268,7 +291,7 @@ export default {
return { return {
direction: 2, // 滚动方向 direction: 2, // 滚动方向
step: 0.5, // 数值越大速度滚动越快 step: 0.5, // 数值越大速度滚动越快
limitMoveNum: 5, // 开启无缝滚动的数据量 设置(数值<=页面展示数据条数不滚)(超过页面展示条数滚动) limitMoveNum: 100, // 开启无缝滚动的数据量 设置(数值<=页面展示数据条数不滚)(超过页面展示条数滚动)
openWatch: true, // 开启数据实时监控刷新dom openWatch: true, // 开启数据实时监控刷新dom
waitTime: 2500, // 单行停顿时间(singleHeight,waitTime) waitTime: 2500, // 单行停顿时间(singleHeight,waitTime)
}; };
...@@ -466,16 +489,23 @@ export default { ...@@ -466,16 +489,23 @@ export default {
background-color: rgba(255, 255, 255, 0.1); background-color: rgba(255, 255, 255, 0.1);
} }
.seamless-warp2 { .seamless-warp2 {
width: 750px; width: 880px;
overflow: hidden; overflow: hidden;
} }
.hot-search-item { .hot-search-item {
width: 150px; width: 170px;
height: 24px; display: flex;
align-items: center;
justify-content: center;
height: 42px;
font-size: 22px; font-size: 22px;
text-align: center; text-align: center;
cursor: pointer; cursor: pointer;
background: rgba(255, 255, 255, 0.1);
border-radius: 20px;
margin-right: 20px;
padding: 0 10px;
} }
.line { .line {
display: inline-block; display: inline-block;
...@@ -530,14 +560,38 @@ export default { ...@@ -530,14 +560,38 @@ export default {
} }
.main { .main {
margin-top: 40px; margin-top: 40px;
.ranking-title {
width: 100%;
padding-left: 25px;
align-items: center;
.title_txt {
font-size: 28px;
font-family: Source Han Sans CN;
font-weight: bold;
color: #f84403;
margin-left: 10px;
}
}
.text_hot {
width: 24px;
height: 24px;
background: #ff5614;
border-radius: 4px;
color: #fff;
text-align: center;
font-size: 20px;
line-height: 24px;
}
.ranking { .ranking {
width: 700px; width: 650px;
height: 495px; height: 570px;
background: linear-gradient(180deg, #fdefed, #fffdf8); background: #ffffff;
box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1); border-radius: 24px 24px 4px 4px;
border-radius: 16px;
border: 3px solid #ffffff;
position: relative; position: relative;
padding-top: 25px;
padding-right: 20px;
.empty-text { .empty-text {
font-size: 18px; font-size: 18px;
color: #999; color: #999;
...@@ -554,8 +608,9 @@ export default { ...@@ -554,8 +608,9 @@ export default {
margin-bottom: 10px; margin-bottom: 10px;
line-height: 56px; line-height: 56px;
border-radius: 8px; border-radius: 8px;
font-size: 28px; font-size: 24px;
color: var(--main-theme-color); font-family: Source Han Sans CN;
font-weight: 500;
letter-spacing: 2px; letter-spacing: 2px;
cursor: pointer; cursor: pointer;
&:nth-child(2n-1) { &:nth-child(2n-1) {
...@@ -568,8 +623,41 @@ export default { ...@@ -568,8 +623,41 @@ export default {
} }
} }
.right { .right {
width: 530px; width: 612px;
height: 495px; height: 520px;
background: rgba(255, 255, 255, 0.7);
border-radius: 0px 24px 24px 0px;
.right-top {
width: 100%;
padding: 27px 48px;
padding-right: 0;
padding-bottom: 20px;
.top_img_box {
position: relative;
.top_img_text_box {
position: absolute;
top: 50%;
left: 8%;
transform: translateY(-50%);
.text_box_title {
font-size: 42px;
font-family: Source Han Sans CN;
font-weight: bold;
color: #ffffff;
text-shadow: 0px 2px 5px rgba(0, 0, 0, 0.15);
}
.text_box_desc {
font-size: 18px;
font-family: Source Han Sans CN;
font-weight: 400;
color: #ffffff;
margin-top: 10px;
letter-spacing: 2px;
}
}
}
}
.fill-btn { .fill-btn {
width: 530px; width: 530px;
height: 170px; height: 170px;
...@@ -621,13 +709,10 @@ export default { ...@@ -621,13 +709,10 @@ export default {
color: #ffffff; color: #ffffff;
} }
.right-bottom { .right-bottom {
width: 530px; width: 100%;
height: 304px; height: 304px;
background: #fff;
border: 3px solid #ffffff;
border-radius: 16px;
box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
position: relative; position: relative;
padding-left: 25px;
.empty-text { .empty-text {
font-size: 18px; font-size: 18px;
color: #999; color: #999;
...@@ -639,18 +724,19 @@ export default { ...@@ -639,18 +724,19 @@ export default {
.hot-matter-list { .hot-matter-list {
height: 130px; height: 130px;
padding: 0px 14px; padding: 0px 14px;
padding-top: 10px;
padding-right: 70px;
overflow: hidden; overflow: hidden;
.seamless-warp { .seamless-warp {
height: 100%; height: 100%;
overflow: hidden; overflow: hidden;
} }
.hot-matter-item { .hot-matter-item {
height: 45px; margin-bottom: 25px;
margin-bottom: 4px; font-size: 24px;
line-height: 45px; font-family: Source Han Sans CN;
border-radius: 8px; font-weight: 500;
font-size: 26px; color: #565656;
color: var(--main-theme-color);
letter-spacing: 2px; letter-spacing: 2px;
cursor: pointer; cursor: pointer;
&:nth-child(2n) { &:nth-child(2n) {
......
sample-form-client-ui/admin/yarn.lock
View file @ d324da8c
This source diff could not be displayed because it is too large. You can view the blob instead.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment