Skip to content

S
smart_gov_platform
Commit 5e59d933 authored by “yiyousong”'s avatar “yiyousong”
Browse files
Options

perf: 优化皮肤管理

parent 97e36003
Hide whitespace changes
Inline Side-by-side
Showing with 181 additions and 176 deletions
base-manager-ui/admin/src/pages/basicset/surface/appraiseskin/AppraiseSkin.vue
View file @ 5e59d933
......@@ -4,7 +4,7 @@
<div
:id="componentsId"
class="call-out-skin-across"
v-if="imageResolution === '1'"
v-if="resolution === '1920x1080'"
:style="{
background: filterItem('1', 0),
}"
......@@ -60,41 +60,6 @@
background: filterItem('4', i),
}"
></div>
<!-- <div
class="footer-btn flex flexc jcc"
:class="{ border: !filterItem('4', 1) }"
:style="{
background: filterItem('4', 1),
}"
></div>
<div
class="footer-btn flex flexc jcc"
:class="{ border: !filterItem('4', 2) }"
:style="{
background: filterItem('4', 2),
}"
></div>
<div
class="footer-btn flex flexc jcc"
:class="{ border: !filterItem('4', 3) }"
:style="{
background: filterItem('4', 3),
}"
></div>
<div
class="footer-btn flex flexc jcc"
:class="{ border: !filterItem('4', 4) }"
:style="{
background: filterItem('4', 4),
}"
></div>
<div
class="footer-btn flex flexc jcc"
:class="{ border: !filterItem('4', 5) }"
:style="{
background: filterItem('4', 5),
}"
></div> -->
</div>
</div>
<!-- 空数据显示 -->
......@@ -112,6 +77,9 @@
</template>
<script>
import { unifyResolution } from "@/utils";
import { filterItems } from "@/utils";
import { mapGetters } from "vuex";
export default {
props: {
skinFieldList: {
......@@ -123,48 +91,26 @@ export default {
},
imageResolution: {
required: true,
default: "1",
default: "",
},
componentsId: {
required: true,
type: String,
},
},
computed: {
...mapGetters("site", ["imageResolutions"]),
resolution() {
let data = filterItems(this.imageResolution, this.imageResolutions);
return unifyResolution(data);
},
},
data() {
return {
api: process.env.VUE_APP_API_IMG_URL,
};
},
methods: {
// 过滤图片
// filterImg(val) {
// let url = "";
// this.skinFieldList
// .filter((v) => {
// return v.fieldType === "2";
// })
// .forEach((v) => {
// if (v.fieldName !== "" && v.fieldName === val) {
// url = v.fieldValue;
// }
// });
// return url;
// },
// // 过滤颜色
// filterColor(val) {
// let str = "";
// this.skinFieldList
// .filter((v) => {
// return v.fieldType === "1";
// })
// .forEach((v) => {
// if (v.fieldName !== "" && v.fieldName === val) {
// str = v.fieldValue;
// }
// });
// return str;
// },
// 过滤属性类型
filterItem(type, index) {
let arr = this.skinFieldList.filter((v) => {
......
base-manager-ui/admin/src/pages/basicset/surface/calloutskin/CallOutSkin.vue
View file @ 5e59d933
......@@ -4,7 +4,7 @@
<div
:id="componentsId"
class="call-out-skin-across"
v-if="imageResolution === '1'"
v-if="resolution === '1920x1080'"
:style="{
background: filterItem('1', 0),
}"
......@@ -138,6 +138,9 @@
</template>
<script>
import { unifyResolution } from "@/utils";
import { filterItems } from "@/utils";
import { mapGetters } from "vuex";
export default {
props: {
skinFieldList: {
......@@ -149,48 +152,26 @@ export default {
},
imageResolution: {
required: true,
default: "1",
default: "",
},
componentsId: {
required: true,
type: String,
},
},
computed: {
...mapGetters("site", ["imageResolutions"]),
resolution() {
let data = filterItems(this.imageResolution, this.imageResolutions);
return unifyResolution(data);
},
},
data() {
return {
api: process.env.VUE_APP_API_IMG_URL,
};
},
methods: {
// 过滤图片
// filterImg(val) {
// let url = "";
// this.skinFieldList
// .filter((v) => {
// return v.fieldType === "2";
// })
// .forEach((v) => {
// if (v.fieldName !== "" && v.fieldName === val) {
// url = v.fieldValue;
// }
// });
// return url;
// },
// // 过滤颜色
// filterColor(val) {
// let str = "";
// this.skinFieldList
// .filter((v) => {
// return v.fieldType === "1";
// })
// .forEach((v) => {
// if (v.fieldName !== "" && v.fieldName === val) {
// str = v.fieldValue;
// }
// });
// return str;
// },
// 过滤属性类型
filterItem(type, index) {
let arr = this.skinFieldList.filter((v) => {
......
base-manager-ui/admin/src/pages/basicset/surface/centralizeskin/CentralizeSkin.vue
View file @ 5e59d933
......@@ -4,7 +4,7 @@
<div
class="centralize-across"
:id="componentsId"
v-if="imageResolution === '1'"
v-if="resolution === '1920x1080'"
:style="{
background: filterItem('1', 0),
}"
......@@ -161,7 +161,7 @@
<div
class="vertical-skin"
:id="componentsId"
v-else-if="imageResolution === '2'"
v-else-if="resolution === '1080x1920'"
:style="{
background: filterItem('1', 0),
}"
......@@ -288,6 +288,9 @@
</template>
<script>
import { unifyResolution } from "@/utils";
import { filterItems } from "@/utils";
import { mapGetters } from "vuex";
export default {
props: {
skinFieldList: {
......@@ -299,48 +302,26 @@ export default {
},
imageResolution: {
required: true,
default: "1",
default: "",
},
componentsId: {
required: true,
type: String,
},
},
computed: {
...mapGetters("site", ["imageResolutions"]),
resolution() {
let data = filterItems(this.imageResolution, this.imageResolutions);
return unifyResolution(data);
},
},
data() {
return {
api: process.env.VUE_APP_API_IMG_URL,
};
},
methods: {
// 过滤图片
// filterImg(val) {
// let url = "";
// this.skinFieldList
// .filter((v) => {
// return v.fieldType === "2";
// })
// .forEach((v) => {
// if (v.fieldName !== "" && v.fieldName === val) {
// url = v.fieldValue;
// }
// });
// return url;
// },
// // 过滤颜色
// filterColor(val) {
// let str = "";
// this.skinFieldList
// .filter((v) => {
// return v.fieldType === "1";
// })
// .forEach((v) => {
// if (v.fieldName !== "" && v.fieldName === val) {
// str = v.fieldValue;
// }
// });
// return str;
// },
// 过滤属性类型
filterItem(type, index) {
let arr = this.skinFieldList.filter((v) => {
......
base-manager-ui/admin/src/pages/basicset/surface/components/RightPreview.vue
View file @ 5e59d933
......@@ -24,7 +24,7 @@
>
<img :src="v.previewImagePath" />
<div class="name">
{{ v.name }}
{{ v.name }}-{{ filterItems(v.imageResolution, imageResolution) }}
</div>
</div>
</div>
......@@ -44,6 +44,7 @@
import { getSkinList } from "@/services/surface";
import { Empty } from "ant-design-vue";
import { mapMutations, mapState } from "vuex";
import { filterItems } from "@/utils";
export default {
props: {
classifyList: {
......@@ -56,6 +57,7 @@ export default {
},
data() {
return {
filterItems,
simpleImage: Empty.PRESENTED_IMAGE_SIMPLE,
categoryId: "", // 分类ID
previewList: [], // 皮肤列表
......@@ -63,7 +65,7 @@ export default {
};
},
computed: {
...mapState("site", ["curSkinIndex", "curProduct"]),
...mapState("site", ["curSkinIndex", "curProduct", "imageResolution"]),
},
watch: {
curProduct(newVal) {
......@@ -198,9 +200,10 @@ export default {
left: 0px;
bottom: 0px;
text-align: center;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
}
.active {
......
base-manager-ui/admin/src/pages/basicset/surface/defaultshow/DefaultShow.vue
View file @ 5e59d933
......@@ -4,22 +4,21 @@
<div
:id="componentsId"
class="across-skin"
v-if="imageResolution === '1'"
:style="{
background: filterItem('1', 0),
}"
></div>
<!-- 竖版 1080*1920 -->
<div
<!-- <div
class="vertical-skin"
:id="componentsId"
v-else-if="imageResolution === '2'"
v-else-if="resolution === '1080x1920'"
:style="{
background: filterItem('1', 0),
}"
></div>
></div> -->
<!-- 空数据显示 -->
<div class="empty flex aic jcc" v-else>
<!-- <div class="empty flex aic jcc" v-else>
<a-empty
:image="require('../../../../assets/img/original.png')"
:image-style="{
......@@ -28,11 +27,14 @@
>
<span slot="description"> <a href="#API">暂无皮肤模板</a> </span>
</a-empty>
</div>
</div> -->
</div>
</template>
<script>
import { unifyResolution } from "@/utils";
import { filterItems } from "@/utils";
import { mapGetters } from "vuex";
export default {
props: {
// imgItem: {
......@@ -51,13 +53,20 @@ export default {
},
imageResolution: {
required: true,
default: "1",
default: "",
},
componentsId: {
required: true,
type: String,
},
},
computed: {
...mapGetters("site", ["imageResolutions"]),
resolution() {
let data = filterItems(this.imageResolution, this.imageResolutions);
return unifyResolution(data);
},
},
data() {
return {
api: process.env.VUE_APP_API_IMG_URL,
......
base-manager-ui/admin/src/pages/basicset/surface/desSelfservice/DesSelfService.vue
View file @ 5e59d933
......@@ -3,7 +3,7 @@
<!-- 桌面自助服务终端 横板 -->
<div
:id="componentsId"
v-if="imageResolution === '1'"
v-if="resolution === '1920x1080'"
class="across-skin flex flexc aic"
:style="{
background: filterItem('1', 0),
......@@ -95,6 +95,9 @@
</template>
<script>
import { unifyResolution } from "@/utils";
import { filterItems } from "@/utils";
import { mapGetters } from "vuex";
export default {
props: {
skinFieldList: {
......@@ -106,13 +109,20 @@ export default {
},
imageResolution: {
required: true,
default: "1",
default: "",
},
componentsId: {
required: true,
type: String,
},
},
computed: {
...mapGetters("site", ["imageResolutions"]),
resolution() {
let data = filterItems(this.imageResolution, this.imageResolutions);
return unifyResolution(data);
},
},
data() {
return {
api: process.env.VUE_APP_API_IMG_URL,
......
base-manager-ui/admin/src/pages/basicset/surface/infoDisSkin/InfoDisSkin.vue
View file @ 5e59d933
......@@ -4,7 +4,7 @@
<div
class="vertical-skin flex flexc aic"
:id="componentsId"
v-if="imageResolution === '2'"
v-if="resolution === '1080x1920'"
:style="{
background: filterItem('1', 0),
}"
......@@ -51,15 +51,11 @@
</template>
<script>
import { unifyResolution } from "@/utils";
import { filterItems } from "@/utils";
import { mapGetters } from "vuex";
export default {
props: {
// imgItem: {
// type: Array,
// required: true,
// default: () => {
// return [];
// },
// },
skinFieldList: {
type: Array,
required: true,
......@@ -69,18 +65,26 @@ export default {
},
imageResolution: {
required: true,
default: "1",
default: "",
},
componentsId: {
required: true,
type: String,
},
},
data() {
return {
api: process.env.VUE_APP_API_IMG_URL,
};
},
computed: {
...mapGetters("site", ["imageResolutions"]),
resolution() {
let data = filterItems(this.imageResolution, this.imageResolutions);
return unifyResolution(data);
},
},
methods: {
// 过滤属性类型
filterItem(type, index) {
......
base-manager-ui/admin/src/pages/basicset/surface/informationskin/InformationSkin.vue
View file @ 5e59d933
......@@ -4,7 +4,7 @@
<div
:id="componentsId"
class="across-skin flex flexc"
v-if="imageResolution === '1'"
v-if="resolution === '1920x1080'"
>
<div
class="header"
......@@ -47,7 +47,7 @@
<div
:id="componentsId"
class="vertical-skin flex flexc"
v-else-if="imageResolution === '2'"
v-else-if="resolution === '1080x1920'"
>
<div
class="header"
......@@ -101,6 +101,9 @@
</template>
<script>
import { unifyResolution } from "@/utils";
import { filterItems } from "@/utils";
import { mapGetters } from "vuex";
export default {
props: {
skinFieldList: {
......@@ -112,7 +115,7 @@ export default {
},
imageResolution: {
required: true,
default: "1",
default: "",
},
componentsId: {
required: true,
......@@ -124,6 +127,13 @@ export default {
api: process.env.VUE_APP_API_IMG_URL,
};
},
computed: {
...mapGetters("site", ["imageResolutions"]),
resolution() {
let data = filterItems(this.imageResolution, this.imageResolutions);
return unifyResolution(data);
},
},
methods: {
// 过滤属性类型
filterItem(type, index) {
......
base-manager-ui/admin/src/pages/basicset/surface/modal/AddSurface.vue
View file @ 5e59d933
......@@ -244,7 +244,7 @@ export default {
formData: {
categoryId: undefined, // 所属种类
name: "", // 皮肤名称
imageResolution: "1", // 分辨率
imageResolution: undefined, // 分辨率
skinFieldList: [], // 字段属性列表
previewImagePath: "", // 预览图地址
},
......@@ -469,6 +469,7 @@ export default {
onAdd() {
Object.assign(this.formData, this.$options.data().formData);
this.formData.id && this.$delete(this.formData, "id");
this.formData.imageResolution = Object.keys(this.imageResolution)[0];
},
// 编辑
onEdit(row) {
......
base-manager-ui/admin/src/pages/basicset/surface/queuingSkin/LandscapeMode.vue
View file @ 5e59d933
......@@ -4,7 +4,7 @@
<div
:id="componentsId"
class="across-skin"
v-if="imageResolution === '1'"
v-if="resolution === '1920x1080'"
:style="{
background: filterItem('1', 0),
}"
......@@ -76,7 +76,7 @@
<div
class="vertical-skin"
:id="componentsId"
v-else-if="imageResolution === '2'"
v-else-if="resolution === '1080x1920'"
:style="{
background: filterItem('1', 0),
}"
......@@ -153,15 +153,11 @@
</template>
<script>
import { unifyResolution } from "@/utils";
import { filterItems } from "@/utils";
import { mapGetters } from "vuex";
export default {
props: {
// imgItem: {
// type: Array,
// required: true,
// default: () => {
// return [];
// },
// },
skinFieldList: {
type: Array,
required: true,
......@@ -171,7 +167,7 @@ export default {
},
imageResolution: {
required: true,
default: "1",
default: "",
},
componentsId: {
required: true,
......@@ -183,6 +179,13 @@ export default {
api: process.env.VUE_APP_API_IMG_URL,
};
},
computed: {
...mapGetters("site", ["imageResolutions"]),
resolution() {
let data = filterItems(this.imageResolution, this.imageResolutions);
return unifyResolution(data);
},
},
methods: {
// 过滤属性类型
filterItem(type, index) {
......
base-manager-ui/admin/src/pages/basicset/surface/sampleFormSkin/SampleFormSkin.vue
View file @ 5e59d933
......@@ -3,7 +3,7 @@
<!-- 样表机 横板 -->
<div
:id="componentsId"
v-if="imageResolution === '1'"
v-if="resolution === '1920x1080'"
class="sample_form_skin flex flexc aic"
:style="{
background: filterItem('1', 0),
......@@ -127,6 +127,9 @@
</template>
<script>
import { unifyResolution } from "@/utils";
import { filterItems } from "@/utils";
import { mapGetters } from "vuex";
export default {
props: {
skinFieldList: {
......@@ -138,7 +141,7 @@ export default {
},
imageResolution: {
required: true,
default: "1",
default: "",
},
componentsId: {
required: true,
......@@ -150,6 +153,13 @@ export default {
api: process.env.VUE_APP_API_IMG_URL,
};
},
computed: {
...mapGetters("site", ["imageResolutions"]),
resolution() {
let data = filterItems(this.imageResolution, this.imageResolutions);
return unifyResolution(data);
},
},
methods: {
// 过滤属性类型
filterItem(type, index) {
......
base-manager-ui/admin/src/pages/basicset/surface/selfservice/SelfService.vue
View file @ 5e59d933
......@@ -3,7 +3,7 @@
<!-- 自助服务终端 横板 -->
<div
:id="componentsId"
v-if="imageResolution === '1'"
v-if="resolution === '1920x1080'"
class="across-skin flex flexc aic"
:style="{
background: filterItem('1', 0),
......@@ -95,6 +95,9 @@
</template>
<script>
import { unifyResolution } from "@/utils";
import { filterItems } from "@/utils";
import { mapGetters } from "vuex";
export default {
props: {
skinFieldList: {
......@@ -106,7 +109,7 @@ export default {
},
imageResolution: {
required: true,
default: "1",
default: "",
},
componentsId: {
required: true,
......@@ -118,6 +121,13 @@ export default {
api: process.env.VUE_APP_API_IMG_URL,
};
},
computed: {
...mapGetters("site", ["imageResolutions"]),
resolution() {
let data = filterItems(this.imageResolution, this.imageResolutions);
return unifyResolution(data);
},
},
methods: {
// 过滤属性类型
filterItem(type, index) {
......
base-manager-ui/admin/src/pages/basicset/surface/signdeviceskin/SignDeviceSkin.vue
View file @ 5e59d933
......@@ -3,7 +3,7 @@
<!-- 导视机 横板 -->
<div
:id="componentsId"
v-if="imageResolution === '1'"
v-if="resolution === '1920x1080'"
class="across-skin flex flexc aic"
>
<!-- 头部 -->
......@@ -74,6 +74,9 @@
</template>
<script>
import { unifyResolution } from "@/utils";
import { filterItems } from "@/utils";
import { mapGetters } from "vuex";
export default {
props: {
skinFieldList: {
......@@ -85,7 +88,7 @@ export default {
},
imageResolution: {
required: true,
default: "1",
default: "",
},
componentsId: {
required: true,
......@@ -97,6 +100,13 @@ export default {
api: process.env.VUE_APP_API_IMG_URL,
};
},
computed: {
...mapGetters("site", ["imageResolutions"]),
resolution() {
let data = filterItems(this.imageResolution, this.imageResolutions);
return unifyResolution(data);
},
},
methods: {
// 过滤属性类型
filterItem(type, index) {
......
base-manager-ui/admin/src/pages/basicset/surface/windowskin/WindowSkin.vue
View file @ 5e59d933
......@@ -4,7 +4,7 @@
<div
:id="componentsId"
class="window-skin-across flex jcb aic"
v-if="imageResolution === '1'"
v-if="resolution === '1920x1080'"
:style="{
background: filterItem('1', 0),
}"
......@@ -71,6 +71,9 @@
</template>
<script>
import { unifyResolution } from "@/utils";
import { filterItems } from "@/utils";
import { mapGetters } from "vuex";
export default {
props: {
skinFieldList: {
......@@ -82,7 +85,7 @@ export default {
},
imageResolution: {
required: true,
default: "1",
default: "",
},
componentsId: {
required: true,
......@@ -94,6 +97,13 @@ export default {
api: process.env.VUE_APP_API_IMG_URL,
};
},
computed: {
...mapGetters("site", ["imageResolutions"]),
resolution() {
let data = filterItems(this.imageResolution, this.imageResolutions);
return unifyResolution(data);
},
},
methods: {
// 过滤属性类型
filterItem(type, index) {
......
base-manager-ui/admin/src/pages/basicset/surface/writeFormSkin/WriteFormSkin.vue
View file @ 5e59d933
<template>
<div class="skin-box">
<!-- 样表机 横板 -->
<!-- 填单机 横板 -->
<div
:id="componentsId"
v-if="imageResolution === '1'"
v-if="resolution === '1920x1080'"
class="sample_form_skin flex flexc aic"
:style="{
background: filterItem('1', 0),
......@@ -166,6 +166,9 @@
</template>
<script>
import { unifyResolution } from "@/utils";
import { filterItems } from "@/utils";
import { mapGetters } from "vuex";
export default {
props: {
skinFieldList: {
......@@ -177,7 +180,7 @@ export default {
},
imageResolution: {
required: true,
default: "1",
default: "",
},
componentsId: {
required: true,
......@@ -189,6 +192,13 @@ export default {
api: process.env.VUE_APP_API_IMG_URL,
};
},
computed: {
...mapGetters("site", ["imageResolutions"]),
resolution() {
let data = filterItems(this.imageResolution, this.imageResolutions);
return unifyResolution(data);
},
},
methods: {
// 过滤属性类型
filterItem(type, index) {
......
base-manager-ui/admin/src/store/modules/site.js
View file @ 5e59d933
......@@ -39,6 +39,9 @@ export default {
siteId(state) {
return state.siteId;
},
imageResolutions(state) {
return state.imageResolution;
},
},
mutations: {
SET_path(state, path) {
......
base-manager-ui/admin/src/utils/index.js
View file @ 5e59d933
......@@ -17,3 +17,7 @@ export const transverter = (obj) => {
};
});
};
// 统一分辨率格式
export const unifyResolution = (resolution) => {
return resolution.replace(/[xX*]/, "x");
};
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