Skip to content

S
sensorConsult
Commit cc8ecdfb authored by zhanglw's avatar zhanglw
Browse files
Options

首页查询、展柜

parent b43e9238
Hide whitespace changes
Inline Side-by-side
Showing with 715 additions and 16 deletions
src/assets/icons/svg/z_hot.svg 0 → 100644
View file @ cc8ecdfb
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1686983097021" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4679" width="128" height="128" xmlns:xlink="http://www.w3.org/1999/xlink"><path d="M989.9222626666667 444.3410103333334L580.1490096666668 34.909091333333336H119.41107066666666l870.511192 870.596525V444.3410103333334z" fill="" p-id="4680"></path><path d="M493.7399596666666 345.23927233333336l-32.726626-32.68008 63.282424-63.371637-65.454546-65.361454-63.282424 63.371636-32.727919-32.680081L516.2330506666667 60.89826233333335l32.727919 32.681374-61.895111 61.981737 65.454545 65.361455 61.895111-61.981737 32.72792 32.68008L493.7399596666666 345.23927233333336zM604.8452526666667 306.84703033333335c24.031677-24.064 50.614303-36.636444 79.751757-37.714748 29.134869-1.078303 55.240404 9.903838 78.314021 32.943839 21.950061 21.91903 32.323232 46.871273 31.120808 74.851555-1.202424 27.982869-13.257697 53.443232-36.167111 76.383677-23.901091 23.934707-50.253576 36.406303-79.057455 37.417374-28.806465 1.011071-54.480162-9.739636-77.02497-32.252121-22.016-21.986263-32.689131-47.067798-32.015515-75.245899 0.674909-28.179394 12.366869-53.638465 35.078465-76.383677z m36.196848 32.579232c-14.921697 14.943677-23.517091 30.756202-25.782303 47.437576-2.270384 16.68396 2.879354 31.297939 15.440162 43.843232 12.827152 12.806465 27.34804 18.232889 43.566545 16.270223 16.217212-1.960081 31.985778-10.608485 47.303111-25.947798 15.976727-15.998707 25.133253-32.109899 27.46699-48.332283 2.333737-16.219798-2.813414-30.637253-15.441454-43.247192-12.825859-12.807758-27.677737-18.133333-44.558222-15.972849-16.877899 2.157899-32.876606 10.808889-47.994829 25.949091zM940.0177776666667 537.5599193333333l-43.835475-43.770828-126.661818 126.841535-32.827475-32.780929 126.663112-126.841536-43.734627-43.672565 26.739071-26.777859 120.39499 120.226909-26.737778 26.775273z" fill="#FFFFFF" p-id="4681"></path></svg>
\ No newline at end of file
src/assets/styles/index.scss
View file @ cc8ecdfb
...@@ -5,6 +5,40 @@ ...@@ -5,6 +5,40 @@
@import 'sidebar'; @import 'sidebar';
@import 'btn'; @import 'btn';
@import 'eladmin'; @import 'eladmin';
@font-face{
font-family: Source Han Sans CN;
src: url("./font/SourceHanSansCN-Regular.otf");
}
@font-face{
font-family: PingFang SC;
src: url("./font/PingFang Regular.ttf");
}
::-webkit-scrollbar {
/*滚动条整体样式*/
width : 4px; /*高宽分别对应横竖滚动条的尺寸*/
height: 1px;
}
::-webkit-scrollbar-thumb {
/*滚动条里面小方块*/
border-radius : 4px;
background-color: #1961C5;
background-image: -webkit-linear-gradient(
45deg,
rgba(255, 255, 255, 0.2) 25%,
transparent 25%,
transparent 50%,
rgba(255, 255, 255, 0.2) 50%,
rgba(255, 255, 255, 0.2) 75%,
transparent 75%,
transparent
);
}
::-webkit-scrollbar-track {
/*滚动条里面轨道*/
box-shadow : inset 0 0 5px rgba(0, 0, 0, 0.2);
background : #ededed;
border-radius: 10px;
}
body { body {
height: 100%; height: 100%;
...@@ -23,6 +57,10 @@ html { ...@@ -23,6 +57,10 @@ html {
box-sizing: border-box; box-sizing: border-box;
} }
img {
-webkit-user-drag: none;
}
#app { #app {
height: 100%; height: 100%;
} }
......
src/components/Dict/index.js
View file @ cc8ecdfb
...@@ -19,6 +19,9 @@ const install = function(Vue) { ...@@ -19,6 +19,9 @@ const install = function(Vue) {
new Dict(this.dict).init(this.$options.dicts, () => { new Dict(this.dict).init(this.$options.dicts, () => {
this.$nextTick(() => { this.$nextTick(() => {
this.$emit('dictReady') this.$emit('dictReady')
if (this.$options.methods && this.$options.methods.onDictReady instanceof Function) {
this.$options.methods.onDictReady.call(this, this.dict)
}
}) })
}) })
} }
......
src/main.js
View file @ cc8ecdfb
...@@ -14,6 +14,9 @@ import checkPer from '@/utils/permission' ...@@ -14,6 +14,9 @@ import checkPer from '@/utils/permission'
import permission from './components/Permission' import permission from './components/Permission'
import './assets/styles/element-variables.scss' import './assets/styles/element-variables.scss'
// 节流标签
import throttle from '@/utils/throttle'
// global css // global css
import './assets/styles/index.scss' import './assets/styles/index.scss'
...@@ -27,6 +30,7 @@ import './router/index' // permission control ...@@ -27,6 +30,7 @@ import './router/index' // permission control
Vue.use(checkPer) Vue.use(checkPer)
Vue.use(permission) Vue.use(permission)
Vue.use(dict) Vue.use(dict)
Vue.use(throttle)
Vue.use(Element, { Vue.use(Element, {
size: Cookies.get('size') || 'mini' // set element-ui default size size: Cookies.get('size') || 'mini' // set element-ui default size
}) })
......
src/utils/throttle.js 0 → 100644
View file @ cc8ecdfb
export default {
install(Vue) {
Vue.directive('throttle', {
bind: (el, binding) => {
let throttleTime = binding.value // 防抖时间
if (!throttleTime) { // 用户若不设置防抖时间，则默认2s
throttleTime = 2000
}
let cbFun
el.addEventListener('click', event => {
if (!cbFun) { // 第一次执行
cbFun = setTimeout(() => {
cbFun = null
}, throttleTime)
} else {
event && event.stopImmediatePropagation()
}
}, true)
}
})
}
}
src/views/backstage/contentMgt/homePage/add.vue
View file @ cc8ecdfb
...@@ -99,11 +99,6 @@ ...@@ -99,11 +99,6 @@
<el-input v-model="formData.xxx" placeholder="单行输入" class="cell-input" /> <el-input v-model="formData.xxx" placeholder="单行输入" class="cell-input" />
</div> </div>
</el-form-item> </el-form-item>
<el-form-item label="产品ID：" class="form-cell" prop="xxx">
<div class="cell-box">
<el-input v-model="formData.xxx" placeholder="单行输入" class="cell-input" />
</div>
</el-form-item>
<el-form-item label="产品分类：" class="form-cell" prop="xxx"> <el-form-item label="产品分类：" class="form-cell" prop="xxx">
<div class="cell-box"> <div class="cell-box">
<el-select v-model="formData.xxx" placeholder="无" class="cell-select"> <el-select v-model="formData.xxx" placeholder="无" class="cell-select">
...@@ -111,6 +106,11 @@ ...@@ -111,6 +106,11 @@
</el-select> </el-select>
</div> </div>
</el-form-item> </el-form-item>
<el-form-item label="产品ID：" class="form-cell" prop="xxx">
<div class="cell-box">
<el-input v-model="formData.xxx" placeholder="单行输入" class="cell-input" />
</div>
</el-form-item>
<el-form-item label="产品运营名称：" class="form-cell" prop="xxx"> <el-form-item label="产品运营名称：" class="form-cell" prop="xxx">
<div class="cell-box"> <div class="cell-box">
<el-input v-model="formData.xxx" placeholder="单行输入" class="cell-input" /> <el-input v-model="formData.xxx" placeholder="单行输入" class="cell-input" />
......
src/views/homepage/floatBtn.vue → src/views/homepage/components/floatBtn.vue
View file @ cc8ecdfb
...@@ -12,7 +12,7 @@ ...@@ -12,7 +12,7 @@
<div class="line-s" /> <div class="line-s" />
<div class="fixed-contact-popover"> <div class="fixed-contact-popover">
<div class="fixed-contact-popover-img"> <div class="fixed-contact-popover-img">
<img src="../../assets/images/wxgz.jpg" alt=""> <img src="@/assets/home_images/wxgz.jpg" alt="">
</div> </div>
</div> </div>
</li> </li>
...@@ -51,7 +51,7 @@ export default { ...@@ -51,7 +51,7 @@ export default {
.fixed-contact { .fixed-contact {
position: fixed; position: fixed;
left: inherit; left: inherit;
right: 4%; right: 2vw;
margin-left: 0; margin-left: 0;
bottom: 200px; bottom: 200px;
width: 76px; width: 76px;
......
src/views/homepage/components/languageSetting.vue 0 → 100644
View file @ cc8ecdfb
<template>
<div class="title-box">
<div class="text" @click="click">语言选择 <i v-if="visible" class="el-icon-sort" /><i v-else class="el-icon-arrow-down" />
</div>
<div class="select-box">
<ul v-show="visible">
<li v-for="(item,index) in languages" :key="index" :class="currentObj===item?'active':''" @click="choose(item,index)">
{{ item.label }}
</li>
</ul>
</div>
</div>
</template>
<script>
export default {
data() {
return {
languages: [{
value: 'CH',
label: '中文'
}, {
value: 'EN',
label: 'English'
}],
currentObj: {},
visible: false
}
},
mounted() {
this.$nextTick(() => {
this.currentObj = this.languages[0]
})
},
methods: {
click() {
this.visible = !this.visible
},
choose(item, index) {
this.visible = false
this.currentObj = item
}
}
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
.title-box {
padding: 1px 15px 1px;
font-size: 20px;
font-family: Source Han Sans CN;
font-weight: 400;
color: #FFFFFF;
line-height: 48px;
cursor: pointer;
user-select: none;
}
.select-box {
position: relative;
font-size: 16px;
line-height: 32px;
ul {
list-style: none;
margin: 0;
position: absolute;
padding-inline-start: 0;
background-color: #1482f0;
width: 100%;
border: 1px solid #e4e4e4;
border-radius: 4px;
li {
padding: 0 10px;
text-align: center;
font-weight: 200;
color: #eee;
}
li:hover {
padding: 0 10px;
color: wheat;
background: rgba(255, 255, 255, 0.2);
}
.active {
font-weight: 600;
color: white;
}
}
}
</style>
src/views/homepage/components/searchPanel.vue 0 → 100644
View file @ cc8ecdfb
<template>
<div class="search-box">
<div class="search-btn">
<el-input v-model="query.keyword" placeholder="请输入关键字" style="width: 600px" />
<el-select v-model="query.productType" placeholder="全部产品" style="width: 160px">
<el-option v-for="item in [{value:undefined,label:'全部产品'}, ...dict.product_type]" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
<el-select v-model="query.area" placeholder="区域" style="width: 100px">
<el-option v-for="item in [{value:undefined,label:'区域'}, ...dict.area_province]" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
<el-button icon="el-icon-search" class="btn">搜索</el-button>
</div>
<div class="search-keyword">
<span v-for="(item, index) in keywords" :key="index" class="label" @click="keywordClick(item, 'keyword')">{{ item }}</span>
</div>
<div class="search-keyword-title">
<div class="title">品牌</div>
</div>
<div class="search-keyword-label">
<span v-for="(item, index) in brands" :key="index" class="label" @click="keywordClick(item, 'brand')">{{ item }}</span>
</div>
<div class="search-keyword-title">
<div class="title">供应商</div>
</div>
<div class="search-keyword-label">
<span v-for="(item, index) in suppliers" :key="index" class="label" @click="keywordClick(item, 'supplier')">{{ item }}</span>
</div>
</div>
</template>
<script>
export default {
dicts: ['product_type', 'area_province'],
data() {
return {
query: {},
keywords: ['曲线记录仪', '液位控制器', '双金属温度计', '位移传感器'],
brands: ['高领传感', '施克', '蓝之宇', '高领传感', '施克', '蓝之宇'],
suppliers: ['上海成渝智能科技发展有限公司', '山东盛茂科技有限公司', '山东天润科技有限公司']
}
},
mounted() {
this.$nextTick(() => {
})
},
methods: {
keywordClick(item, type) {
}
}
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
.search-box {
width: 100%;
text-align: center;
user-select: none;
.btn{
width: 100px;
height: 47px;
border: 1px solid rgba(255, 255, 255, 0.3);
font-size: 16px;
font-family: Source Han Sans CN;
font-weight: 400;
background: rgba(101,103,113,0.35);
color: #FFFFFF;
opacity: 0.7;
}
.btn:hover {
opacity: 1;
}
>>>.el-input__inner {
height: 47px;
border: 1px solid rgba(255, 255, 255, 0.3);
border-radius: 5px;
font-size: 16px;
font-family: Source Han Sans CN;
font-weight: 400;
background: rgba(101,103,113,0.35);
color: #FFFFFF;
opacity: 0.7;
}
>>>.el-input__inner:hover {
opacity: 1;
}
.search-keyword {
margin-top: 2px;
text-align: left;
padding-left: 25vw;
.label {
padding: 1px 15px 1px;
font-size: 16px;
font-family: Source Han Sans CN;
font-weight: 400;
color: #FFFFFF;
line-height: 35px;
cursor:pointer;
user-select: none;
}
.label:hover {
color: wheat;
}
}
.search-keyword-title {
display: flex;
justify-content: center;
margin-top: 40px;
font-size: 20px;
font-family: Source Han Sans CN;
font-weight: 400;
color: #FFFFFF;
.title {
width: 126px;
padding: 7px;
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 20px;
}
}
.search-keyword-label {
margin-top: 20px;
.label {
padding: 3px 25px 3px;
font-size: 20px;
font-family: Source Han Sans CN;
font-weight: 400;
color: #FFFFFF;
line-height: 35px;
cursor:pointer;
user-select: none;
}
.label:hover {
color: wheat;
}
}
}
</style>
src/views/homepage/components/titleMenus.vue 0 → 100644
View file @ cc8ecdfb
<template>
<div class="menus-box">
<span v-for="(item, index) in menus" :key="index" class="menus-item" :class="currentMenuObj===item?'active':''" @click="menuClick(item)">{{ item.name }}</span>
</div>
</template>
<script>
export default {
data() {
return {
menus: [
{ name: '首页', active: true }, { name: '优质产品' }, { name: '优质供应商' }, { name: '解决方案与服务' }, { name: '软件系统' }, { name: '专业培训' }, { name: '行业资讯' }, { name: '信息发布' }
],
currentMenuObj: null
}
},
mounted() {
this.$nextTick(() => {
this.currentMenuObj = this.menus[0]
})
},
methods: {
menuClick(item) {
this.currentMenuObj = item
}
}
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
.menus-box {
.menus-item {
padding: 1px 15px 1px;
font-size: 20px;
font-weight: 400;
font-family: Source Han Sans CN;
color: #FFFFFF;
line-height: 48px;
cursor:pointer;
user-select: none;
}
.menus-item:hover {
color: #F7601A;
}
.active {
color: #FFFFFF;
font-weight: 600;
}
}
</style>
src/views/homepage/components/userLogin.vue 0 → 100644
View file @ cc8ecdfb
<template>
<div class="user-login-box">
<div v-if="!userObj" class="not-login" @click="login">注册/登录</div>
</div>
</template>
<script>
export default {
data() {
return {
userObj: null,
activatedMenu: null
}
},
mounted() {
this.$nextTick(() => {
})
},
methods: {
login(item) {
}
}
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
.user-login-box {
padding: 1px 15px 1px;
font-size: 20px;
font-family: Source Han Sans CN;
font-weight: 400;
color: #FFFFFF;
line-height: 48px;
opacity: 0.6;
cursor:pointer;
user-select: none;
}
</style>
src/views/homepage/index.vue
View file @ cc8ecdfb
<template> <template>
<div> <div class="page-body">
<div class="xxx">首页内容</div> <div class="head-box">
<hr> <div class="head-box-top">
<div class="xxx">首页内容</div> <div class="top-call" />
<hr> <div class="top-call"><img src="@/assets/home_images/gemho_logo.png" alt="gemho-logo"></div>
<div class="xxx">首页内容</div> <div class="top-call"><title-menus ref="titleMenus" /></div>
<div class="top-call"><user-login ref="userLogin" /></div>
<div class="top-call"><language-setting ref="languageSetting" /></div>
</div>
<div class="head-title"><img src="@/assets/home_images/home_title.png" alt="home_title"></div>
<search-panel ref="searchPanel" style="margin-top: 64px;" />
</div>
<div class="line-btn" style="padding-top: 42px;">
<div class="btn-o">我要供应</div>
<div class="btn-o">我要采购</div>
</div>
<div class="line-btn" style="padding-top: 30px">
<div v-for="(item,index) in dict.product_type" :key="index" class="btn-b" :class="currentProductTypeObj===item?'active':''" @mouseenter="changeProductPush(item)">{{ item.label }}</div>
</div>
<div class="content-box" style="padding-top: 20px;">
<div class="showcase">
<div v-for="(item,index) in showcaseProducts" :key="index" class="box-card">
<img v-if="item.isGood" src="@/assets/home_images/recommend.png" class="stamp" title="推荐" style="top: 10px;right: 8px">
<div v-if="item.isHot" class="stamp" title="热门">
<svg-icon icon-class="z_hot" style="color: red;width: 50px;height: 50px;" />
</div>
<el-image
:src="item.imgSrc?imgSrcStart+'/img'+item.imgSrc:defaultImgProduct"
:preview-src-list="item.imgSrcList.length?item.imgSrcList:[defaultImgProduct]"
style="width:284px;height: 284px;margin: 0 32px 4px"
>
<div slot="placeholder" class="image-slot">加载中<span class="dot">...</span></div>
</el-image>
<el-row>
<el-col :span="21">
<div class="title" :title="item.title">{{ item.title }}</div>
</el-col>
<el-col :span="3">
<img v-if="item.isStore" class="touch" src="@/assets/home_images/to_like_h.png" @click="storeShowcase(item, 'product')">
<img v-else class="touch" src="@/assets/home_images/to_like.png" @click="storeShowcase(item, 'product')">
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<div class="subTitle" :title="item.subTitle">{{ item.subTitle }}</div>
</el-col>
</el-row>
<el-row style="margin-top: 6px">
<el-col :span="3" style="padding-left: 20px">
<img src="@/assets/home_images/locate.png">
</el-col>
<el-col :span="13">
<div class="area">{{ item.area }}</div>
</el-col>
<el-col :span="8">
<div class="date">{{ item.date }}</div>
</el-col>
</el-row>
<div class="line-btn" style="margin-top: 4px">
<div class="btn-o" style="width: 150px;border-radius: 10px;box-shadow: 0 1px 2px 0 rgba(0,0,0,0.2);font-size:20px;" @click="inquiry(item, 'product')">询 价</div>
</div>
</div>
<div style="padding: 15px 50px;text-align: right"><span class="more touch" title="点击查看更多..." @click="moreTo('product')">更多产品>></span></div>
</div>
</div>
<hr> <hr>
<div class="xxx">首页内容</div> <div class="xxx">首页内容</div>
<hr> <hr>
...@@ -18,12 +77,114 @@ ...@@ -18,12 +77,114 @@
</div> </div>
</template> </template>
<script> <script>
import floatBtn from './floatBtn' import default_product from '@/assets/home_images/default_product.png'
import floatBtn from './components/floatBtn'
import titleMenus from './components/titleMenus'
import userLogin from './components/userLogin'
import languageSetting from './components/languageSetting'
import searchPanel from './components/searchPanel'
export default { export default {
components: { floatBtn }, components: { floatBtn, titleMenus, userLogin, languageSetting, searchPanel },
dicts: ['product_type', 'area_province'],
data() { data() {
return { return {
defaultImgProduct: default_product,
imgSrcStart: process.env.VUE_APP_BASE_API,
query: {},
currentProductTypeObj: null,
showcaseProducts: [
{
isGood: true,
isHot: false,
isStore: false,
title: 'wiwo1002热能工程压力变送器',
subTitle: '乐清市柳市艾普乐传感器厂',
area: '北京',
date: '2023-06-12',
imgSrc: '',
imgSrcList: []
},
{
isGood: true,
isHot: true,
isStore: true,
title: 'wiwo1002热能工程压力变送器',
subTitle: '乐清市柳市艾普乐传感器厂',
area: '北京',
date: '2023-06-12',
imgSrc: '',
imgSrcList: []
},
{
isGood: false,
isHot: true,
isStore: false,
title: 'wiwo1002热能工程压力变送器',
subTitle: '乐清市柳市艾普乐传感器厂',
area: '北京',
date: '2023-06-12',
imgSrc: '',
imgSrcList: []
},
{
isGood: false,
isHot: false,
isStore: true,
title: 'wiwo1002热能工程压力变送器',
subTitle: '乐清市柳市艾普乐传感器厂',
area: '北京',
date: '2023-06-12',
imgSrc: '',
imgSrcList: []
},
{
isGood: false,
isHot: true,
isStore: false,
title: 'wiwo1002热能工程压力变送器',
subTitle: '乐清市柳市艾普乐传感器厂',
area: '北京',
date: '2023-06-12',
imgSrc: '',
imgSrcList: []
},
{
isGood: false,
isHot: false,
isStore: false,
title: 'wiwo1002热能工程压力变送器',
subTitle: '乐清市柳市艾普乐传感器厂',
area: '北京',
date: '2023-06-12',
imgSrc: '',
imgSrcList: []
},
{
isGood: true,
isHot: false,
isStore: false,
title: 'wiwo1002热能工程压力变送器',
subTitle: '乐清市柳市艾普乐传感器厂',
area: '北京',
date: '2023-06-12',
imgSrc: '',
imgSrcList: []
},
{
isGood: false,
isHot: false,
isStore: false,
title: 'wiwo1002热能工程压力变送器',
subTitle: '乐清市柳市艾普乐传感器厂',
area: '北京',
date: '2023-06-12',
imgSrc: '',
imgSrcList: []
}
],
throttle: null, // 节流器
throttleTime: 300
} }
}, },
mounted() { mounted() {
...@@ -32,6 +193,33 @@ export default { ...@@ -32,6 +193,33 @@ export default {
}) })
}, },
methods: { methods: {
onDictReady(dict) {
this.currentProductTypeObj = dict.product_type[0]
},
// 变更产品推送
changeProductPush(item) {
clearTimeout(this.throttle)
this.throttle = setTimeout(() => {
if (this.currentProductTypeObj === item) {
return
}
console.log(item)
this.currentProductTypeObj = item
}, this.throttleTime)
},
// 点击询价
inquiry(item, type) {
console.log(item, type)
},
// 点击收藏
storeShowcase(item, type) {
item.isStore = !item.isStore
console.log(item, type)
},
// 点击更多
moreTo(type) {
console.log(type)
},
goTop() { goTop() {
document.body.scrollTop = 0 document.body.scrollTop = 0
document.documentElement.scrollTop = 0 document.documentElement.scrollTop = 0
...@@ -40,7 +228,142 @@ export default { ...@@ -40,7 +228,142 @@ export default {
} }
</script> </script>
<style rel="stylesheet/scss" lang="scss" scoped> <style rel="stylesheet/scss" lang="scss" scoped>
.touch {
cursor:pointer;
}
.clear {
clear: both
}
.content-box {
display: flex;
justify-content: center;
font-family: Source Han Sans CN;
font-weight: 400;
user-select: none;
.showcase {
width: 80%;
}
.box-card {
display: inline-block;
position: relative;
margin: 12px;
padding: 10px 0;
width: 350px;
background: #FFFFFF;
border: 1px solid rgba(0,0,0,0.12);
box-shadow: 1px 2px 8px 0 rgba(0,0,0,0.12);
border-radius: 10px;
.title {
width: 305px;
padding: 2px 20px;
font-size: 18px;
color: #333333;
overflow:hidden;
white-space: nowrap;
text-overflow: ellipsis;
-o-text-overflow:ellipsis;
}
.subTitle {
width: 260px;
padding: 2px 20px;
font-size: 15px;
color: #1961C5;
overflow:hidden;
white-space: nowrap;
text-overflow: ellipsis;
-o-text-overflow:ellipsis;
}
.area {
padding: 2px 0;
font-size: 17px;
color: #666666;
}
.date {
padding: 2px 10px;
font-size: 17px;
color: #999999;
}
.stamp {
border-style: none;
position: absolute;
top: 0;
right: 0;
z-index: 99;
}
}
.more {
font-size: 18px;
color: #0457C7;
}
.more:hover {
font-weight: 600;
}
}
.xxx { .xxx {
height: 300px; height: 300px;
} }
.head-box {
width: 100vw;
height: 750px;
background: #1961C5;
.head-box-top {
display: flex;
justify-content: space-evenly;
align-items: center;
padding: 15px 15px 0;
.top-call {
height: 50px;
}
}
.head-title {
width: 100%;
margin-top: 92px;
text-align: center;
user-select: none;
}
}
.line-btn {
display: flex;
justify-content: center;
font-family: Source Han Sans CN;
font-weight: 400;
.btn-o {
margin: 0 25px;
width: 360px;
padding: 10px;
background: #F7601A;
box-shadow: 0 3px 6px 0 rgba(0,0,0,0.2);
text-align: center;
border: 1px solid transparent;
font-size: 22px;
color: #FFFFFF;
cursor:pointer;
user-select: none;
}
.btn-o:hover {
border: 1px solid rgba(30, 144, 255, 0.8);
color: #1482f0;
}
.btn-b {
margin: 0 10px;
width: 168px;
padding: 6px;
background: #EFF6FF;
border: 1px solid transparent;
box-shadow: 0 1px 2px 0 rgba(0,0,0,0.2);
text-align: center;
font-size: 20px;
color: #1961C5;
cursor:pointer;
user-select: none;
}
.btn-b:hover {
border: 1px solid rgba(30, 144, 255, 0.9);
}
.active {
color: #FFFFFF;
font-weight: 400;
background: #1961C5;
}
}
</style> </style>
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