Skip to content

S
smart_gov_platform
Commit 15cd83e4 authored by “yiyousong”'s avatar “yiyousong”
Browse files
Options

pref:修改页面

parent b3f894c7
Hide whitespace changes
Inline Side-by-side
Showing with 241 additions and 251 deletions
base-manager-ui/admin/src/assets/css/common.css
View file @ 15cd83e4
/* 颜色 */
.primary{
color:#1890FF;
.primary {
color: #1890ff;
}
.delete{
color:#FA4D4C;
.delete {
color: #fa4d4c;
}
.green{
color:#1BBC9B;
.green {
color: #1bbc9b;
}
.edit{
color:#03d76f !important;
.edit {
color: #03d76f !important;
}
.clofff{
color:#fff;
.clofff {
color: #fff;
}
.bgdel{
background-color: #FA4D4C;
.bgdel {
background-color: #fa4d4c;
}
.bgpr{
background-color: #1890FF;
.bgpr {
background-color: #1890ff;
}
.bgg{
background-color:#1BBC9B;
.bgg {
background-color: #1bbc9b;
}
.bgw {
background-color: #fff;
}
.h-full {
height: 100%;
}
.w-full {
width: 100%;
}
.bgw{
background-color: #fff;
}
/* 版心 */
.container{
width:1200px;
.container {
width: 1200px;
}
/* 弹性布局 */
.flex{
display: flex;
.flex {
display: flex;
}
.flex1{
flex:1
.flex1 {
flex: 1;
}
.flexc{
flex-direction: column;
.flexc {
flex-direction: column;
}
.flexwrap{
flex-wrap: wrap;
.flexwrap {
flex-wrap: wrap;
}
.jcc{
justify-content: center;
.jcc {
justify-content: center;
}
.jca{
justify-content: space-around;
.jca {
justify-content: space-around;
}
.jcb{
justify-content: space-between;
.jcb {
justify-content: space-between;
}
.jce{
justify-content: space-evenly;
.jce {
justify-content: space-evenly;
}
.jc-start{
justify-content: flex-start;
.jc-start {
justify-content: flex-start;
}
.jc-end{
justify-content: flex-end;
.jc-end {
justify-content: flex-end;
}
.aic{
align-items: center;
.aic {
align-items: center;
}
.aca{
align-content: space-around;
.aca {
align-content: space-around;
}
.acb{
align-content: space-between;
.acb {
align-content: space-between;
}
.ace{
align-content: space-evenly;
.ace {
align-content: space-evenly;
}
/* margin */
.m10{
margin:10px
.m10 {
margin: 10px;
}
.m15{
margin:15px;
.m15 {
margin: 15px;
}
.m20{
margin:20px;
.m20 {
margin: 20px;
}
.mt10{
margin-top:10px;
.mt10 {
margin-top: 10px;
}
.mt15{
margin-top:15px;
.mt15 {
margin-top: 15px;
}
.mt20{
margin-top:20px;
.mt20 {
margin-top: 20px;
}
.ml10{
margin-left:10px;
.ml10 {
margin-left: 10px;
}
.ml15{
margin-left:15px;
.ml15 {
margin-left: 15px;
}
.ml20{
margin-left:20px;
.ml20 {
margin-left: 20px;
}
.ml25{
margin-left:25px;
.ml25 {
margin-left: 25px;
}
.mr5 {
margin-right: 5px;
}
.mr10{
margin-right:10px;
margin-right: 5px;
}
.mr15{
margin-right:15px;
.mr8 {
margin-right: 8px;
}
.mr20{
margin-right:20px;
.mr10 {
margin-right: 10px;
}
.mr25{
margin-right:25px;
.mr15 {
margin-right: 15px;
}
.mb10{
margin-bottom:10px;
.mr20 {
margin-right: 20px;
}
.mb15{
margin-bottom:15px;
.mr25 {
margin-right: 25px;
}
.mb20{
margin-bottom:20px;
.mb10 {
margin-bottom: 10px;
}
.mb25{
margin-bottom:25px;
.mb15 {
margin-bottom: 15px;
}
.mb20 {
margin-bottom: 20px;
}
.mb25 {
margin-bottom: 25px;
}
/* padding */
.pd10{
padding:10px;
.pd10 {
padding: 10px;
}
.pd15{
padding:15px;
.pd15 {
padding: 15px;
}
.pd20{
padding:20px;
.pd20 {
padding: 20px;
}
.pdt10{
padding-top:10px;
.pdt10 {
padding-top: 10px;
}
.pdt15{
padding-top:15px;
.pdt15 {
padding-top: 15px;
}
.pdt20{
padding-top:20px;
.pdt20 {
padding-top: 20px;
}
.pdt30{
padding-top:30px;
.pdt30 {
padding-top: 30px;
}
.pdl10{
padding-left:10px;
.pdl10 {
padding-left: 10px;
}
.pdl15{
padding-left:15px;
.pdl15 {
padding-left: 15px;
}
.pdl20{
padding-left:20px;
.pdl20 {
padding-left: 20px;
}
.pdr6{
padding-right:6px;
.pdr6 {
padding-right: 6px;
}
.pdr10{
padding-right:10px;
.pdr10 {
padding-right: 10px;
}
.pdr15{
padding-right:15px;
.pdr15 {
padding-right: 15px;
}
.pdr20{
padding-right:20px;
.pdr20 {
padding-right: 20px;
}
.pdb10{
padding-bottom:10px;
.pdb10 {
padding-bottom: 10px;
}
.pdb15{
padding-bottom:15px;
.pdb15 {
padding-bottom: 15px;
}
.pdb20{
padding-bottom:20px;
.pdb20 {
padding-bottom: 20px;
}
/* 字体大小 */
.font16{
font-size:16px;
.font16 {
font-size: 16px;
}
.font18{
font-size:18px;
.font18 {
font-size: 18px;
}
.font20{
font-size:20px;
.font20 {
font-size: 20px;
}
.font22{
font-size:22px;
.font22 {
font-size: 22px;
}
.font24{
font-size:24px;
.font24 {
font-size: 24px;
}
.font26{
font-size:26px;
.font26 {
font-size: 26px;
}
.font28{
font-size:28px;
.font28 {
font-size: 28px;
}
.font30{
font-size:30px;
.font30 {
font-size: 30px;
}
/* 字体位置 */
.tac{
text-align: center;
.tac {
text-align: center;
}
.tal{
text-align: left;
.tal {
text-align: left;
}
.tar{
text-align: right;
.tar {
text-align: right;
}
/* 加粗 */
.fontw600{
font-weight:600;
.fontw600 {
font-weight: 600;
}
.fontw700{
font-weight:700;
.fontw700 {
font-weight: 700;
}
.fontw800{
font-weight:800;
.fontw800 {
font-weight: 800;
}
.skin-box {
height: 100%;
height: 100%;
}
.empty {
height: 100%;
}
.pointer{
cursor: pointer;
.pointer {
cursor: pointer;
}
.auto-scroll-y {
overflow-y: auto;
}
.auto-scroll-y{
overflow-y: auto;
.auto-scroll-x {
overflow-y: auto;
}
.auto-scroll-x{
overflow-y: auto;
.auto-scroll {
overflow: auto;
}
.auto-scroll{
overflow: auto;
}
\ No newline at end of file
base-manager-ui/admin/src/components/TabHeader.vue
View file @ 15cd83e4
<template>
<div class="tab-header flex jcb aic">
<div>
<a-icon :type="icon" class="mr5 primary" />
<div class="h-full flex aic">
<a-icon :type="icon" class="mr8 primary" />
<span class="label">{{ label }}</span>
</div>
<div>
......
base-manager-ui/admin/src/pages/basicset/surface/components/LeftMenu.vue
View file @ 15cd83e4
<template>
<div class="left-menu">
<div class="left-menu flex flexc">
<div class="search-box">
<a-input-search
placeholder="请输入设备关键字搜索"
......@@ -8,7 +8,7 @@
@search="onSearch"
/>
</div>
<div class="menu">
<div class="menu flex1 auto-scroll-y">
<a-card-grid
:class="{ active: i === isActive }"
v-for="(v, i) in productList"
......@@ -41,7 +41,9 @@ export default {
async getProductList(search = {}) {
let res = await getProductList({ page: 1, size: -1, ...search });
let { data } = res.data.data;
this.productList = data;
this.productList = data.filter(
(v) => !v.productName.includes("电子门牌")
);
this.changeMenu(0, this.productList[0]);
},
// 搜索
......@@ -70,12 +72,12 @@ export default {
<style lang="less" scoped>
.left-menu {
height: 100%;
background-color: #fff;
}
.search-box {
padding: 15px 15px 0px;
}
.menu {
height: 70vh;
margin-top: 15px;
overflow-y: auto;
padding: 0px 15px 15px 15px;
......
base-manager-ui/admin/src/pages/basicset/surface/components/RightPreview.vue
View file @ 15cd83e4
......@@ -13,7 +13,7 @@
</a-select>
</div>
<a-spin size="small" :spinning="spinning">
<div class="preview-list">
<div ref="previewList" class="preview-list">
<div v-if="previewList.length > 0">
<div
class="preview-item"
......@@ -64,6 +64,7 @@ export default {
},
watch: {
curProduct(newVal) {
this.$refs.previewList.scrollTop = 0;
if (Object.keys(newVal).length) {
this.getSkinList({ productId: newVal.productId });
}
......@@ -156,22 +157,25 @@ export default {
<style lang="less" scoped>
.right-preview {
height: 100%;
width: 100%;
display: flex;
flex-direction: column;
padding: 15px 0px;
padding-top: 15px;
background-color: #fff;
.preview-seach {
height: 32px;
padding: 0px 15px;
margin-bottom: 15px;
flex-shrink: 0;
}
.preview-list {
height: 65vh;
padding: 0px 15px;
display: flex;
flex-direction: column;
// border-bottom: 1px solid #ccc;
overflow-y: auto;
// border-bottom: 1px solid #ccc;
.preview-item {
margin-bottom: 6px;
height: 120px;
......@@ -188,10 +192,12 @@ export default {
}
}
.preview-btn {
border-top: 1px solid #ccc;
height: 100px;
display: flex;
flex-direction: column;
justify-content: center;
flex-shrink: 0;
}
}
</style>
\ No newline at end of file
base-manager-ui/admin/src/pages/basicset/surface/components/ShowBox.vue
View file @ 15cd83e4
......@@ -166,26 +166,16 @@ export default {
.show {
width: 100%;
height: 100%;
padding: 20px 0px;
background-image: linear-gradient(#cfe9ff, #fff);
display: flex;
flex-direction: column;
justify-content: center;
overflow-y: auto;
&::-webkit-scrollbar {
width: 5px;
}
&::-webkit-scrollbar-thumb {
border-radius: 5px;
background: rgba(144, 147, 153, 0.5);
}
&::-webkit-scrollbar-track {
box-shadow: 0;
border-radius: 0px;
background: #f0f2f5;
}
.show-content {
width: 100%;
height: 75vh;
overflow-y: auto;
.show-header {
text-align: center;
color: #48866c;
......
base-manager-ui/admin/src/pages/basicset/surface/index.vue
View file @ 15cd83e4
......@@ -11,8 +11,6 @@ export default {};
<style lang="less" scoped>
.index {
width: 100%;
min-height: 100%;
background-color: #fff;
display: flex;
height: 100%;
}
</style>
\ No newline at end of file
base-manager-ui/admin/src/pages/basicset/surface/surface.vue
View file @ 15cd83e4
<template>
<div class="surface">
<div class="container">
<TabHeader label="皮肤管理">
<a-space>
<a-button v-permission="[1]" icon="plus" @click="addDev"
>新增设备</a-button
>
<a-button
type="primary"
v-permission="[1]"
@click="$router.push('surface/addsurfacetemplate')"
>新增皮肤模板</a-button
>
</a-space>
</TabHeader>
<div class="main">
<div class="menu-box">
<LeftMenu
ref="LeftMenu"
@clickFacility="clickFacility"
@searchProduct="searchProduct"
></LeftMenu>
</div>
<div class="show-box">
<ShowBox @editSkin="editSkin"></ShowBox>
</div>
<div class="preview-box">
<RightPreview
ref="RightPreview"
@addSkin="addSkin"
@editClassify="editClassify"
:classifyList="classifyList"
></RightPreview>
</div>
<div class="surface flex flexc">
<TabHeader label="皮肤管理">
<a-space>
<a-button v-permission="[1]" icon="plus" @click="addDev"
>新增设备</a-button
>
<a-button
type="primary"
v-permission="[1]"
@click="$router.push('surface/addsurfacetemplate')"
>新增皮肤模板</a-button
>
</a-space>
</TabHeader>
<div class="main flex1">
<div class="menu-box">
<LeftMenu
ref="LeftMenu"
@clickFacility="clickFacility"
@searchProduct="searchProduct"
></LeftMenu>
</div>
<div class="show-box">
<ShowBox @editSkin="editSkin"></ShowBox>
</div>
<div class="preview-box">
<RightPreview
ref="RightPreview"
@addSkin="addSkin"
@editClassify="editClassify"
:classifyList="classifyList"
></RightPreview>
</div>
<!-- 编辑分类弹窗 -->
<EditClassify
:visible.sync="visible"
:classifyList="classifyList"
@addCategorySuccess="addCategorySuccess"
@closeModal="addCategorySuccess"
></EditClassify>
<!-- 新增，编辑皮肤弹窗 -->
<AddSurface
ref="AddSurface"
:isShow.sync="isShow"
:classifyList="classifyList"
@addSkinSuccess="addSkinSuccess"
></AddSurface>
<!-- 新增设备 -->
<AddDev :visible.sync="addDevVisible" @addDev="addDevSuccess"></AddDev>
</div>
<!-- 编辑分类弹窗 -->
<EditClassify
:visible.sync="visible"
:classifyList="classifyList"
@addCategorySuccess="addCategorySuccess"
@closeModal="addCategorySuccess"
></EditClassify>
<!-- 新增，编辑皮肤弹窗 -->
<AddSurface
ref="AddSurface"
:isShow.sync="isShow"
:classifyList="classifyList"
@addSkinSuccess="addSkinSuccess"
></AddSurface>
<!-- 新增设备 -->
<AddDev :visible.sync="addDevVisible" @addDev="addDevSuccess"></AddDev>
</div>
</template>
......@@ -142,15 +140,9 @@ export default {
.surface {
width: 100%;
height: 100%;
.container {
width: 100%;
height: 100%;
position: relative;
}
position: relative;
.main {
height: 100%;
border-top: 1px solid rgb(224, 224, 224);
background-color: #fff;
display: flex;
.menu-box {
width: 20%;
......@@ -158,19 +150,12 @@ export default {
}
.show-box {
width: 65%;
height: 100%;
}
.preview-box {
width: 15%;
height: 100%;
}
}
}
/deep/.ant-card {
height: 100%;
display: flex;
flex-direction: column;
}
/deep/.ant-card-body {
flex: 1;
padding: 0px;
}
</style>
\ No newline at end of file
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