Skip to content

S
smart_gov_platform
Commit 4a167a50 authored by “yiyousong”'s avatar “yiyousong”
Browse files
Options

perf: 优化皮肤管理板块

parent cadb12e9
Show whitespace changes
Inline Side-by-side
Showing with 208 additions and 294 deletions
base-manager-ui/admin/src/pages/basicset/surface/AddSurfaceTemplate.vue
View file @ 4a167a50
......@@ -20,7 +20,7 @@
</a-space>
<div style="width: 300px">
<a-input-search
v-model="leftVal"
v-model="templateTable.searchForm.productName"
allowClear
placeholder="请输入设备名称进行搜索"
enter-button="搜索"
......@@ -31,52 +31,47 @@
<!-- 表格 -->
<div class="table-content">
<!-- 表格 -->
<a-table
bordered
<y-table
size="middle"
:columns="templateTable.columns"
:data="templateTable.data"
:pageSize.sync="templateTable.size"
:page.sync="templateTable.page"
:total="templateTable.total"
:loading="templateTable.loading"
:scroll="{ y: 550 }"
:loading="leftLoading"
:pagination="{
showTotal: (total) => `共 ${total} 条`,
current: leftCurrent,
total: leftTotal,
defaultPageSize: 10000,
}"
:columns="leftColumns"
:data-source="skinTemplate"
:rowKey="(record) => record.id"
:row-selection="{
onChange: onSelectChange,
selectedRowKeys: leftSelectedRowKeys,
showSizeChanger: false,
showQuickJumper: false,
}"
@changePagination="getTemplateList"
>
<template slot="num" slot-scope="text, record, index">
<span>
{{ (leftCurrent - 1) * leftSize + index + 1 }}
</span>
</template>
<span slot="index" slot-scope="{ index }">{{
(templateTable.page - 1) * templateTable.size + index + 1
}}</span>
<!-- 创建日期 -->
<template slot="createTime" slot-scope="text">
{{ text.createTime | dateFormat }}
<template slot="createTime" slot-scope="{ record }">
{{ record.createTime | dateFormat }}
</template>
<!-- 操作 -->
<template slot="action" slot-scope="text">
<template slot="action" slot-scope="{ record }">
<a-space size="middle">
<a
href="javascript:;"
class="primary"
@click="handleEdit(text)"
@click="handleEdit(record)"
>编辑</a
>
<a
href="javascript:;"
class="delete"
@click="handleDel(text.id)"
@click="handleDel(record.id)"
>删除</a
>
</a-space>
</template>
</a-table>
</y-table>
</div>
</a-card>
</div>
......@@ -93,14 +88,14 @@
</a-space>
</div>
<a-select
v-model="rightVal"
v-model="templateFieldTable.searchForm.templateId"
style="width: 220px"
default-value="all"
@change="handleChange"
>
<a-select-option value=""> 全部皮肤模板 </a-select-option>
<a-select-option
v-for="v in skinTemplate"
v-for="v in templateTable.data"
:key="v.id"
:value="v.id"
>
......@@ -111,68 +106,50 @@
<!-- 表格 -->
<div class="table-content">
<!-- 表格 -->
<a-table
bordered
:scroll="{ y: 550 }"
:pagination="{
showTotal: (total) => `共 ${total} 条`,
current: rightCurrent,
total: rightTotal,
pageSize: rightSize,
showSizeChanger: true,
showQuickJumper: true,
pageSizeOptions: pageSizeOptions,
onChange: changeRight,
onShowSizeChange: showSizeChangeRight,
}"
:loading="rightLoading"
<y-table
size="middle"
:rowKey="(record) => record.id"
:row-selection="{
selectedRowKeys: rightSelectedRowKeys,
onChange: onRightSelectChange,
}"
:columns="rightColumns"
:data-source="fieldList"
:columns="templateFieldTable.columns"
:data="templateFieldTable.data"
:pageSize.sync="templateFieldTable.size"
:page.sync="templateFieldTable.page"
:total="templateFieldTable.total"
:loading="templateFieldTable.loading"
:scroll="{ y: 550 }"
@changePagination="getFieldList"
>
<template slot="num" slot-scope="text, record, index">
<span>
{{ (rightCurrent - 1) * rightSize + index + 1 }}
</span>
</template>
<span slot="index" slot-scope="{ index }">{{
(templateFieldTable.page - 1) * templateFieldTable.size +
index +
1
}}</span>
<!-- 数据类型 -->
<template slot="fieldType" slot-scope="text">
{{ text.fieldType === "1" ? "颜色" : "图片" }}
<template slot="fieldType" slot-scope="{ record }">
{{ record.fieldType === "1" ? "颜色" : "图片" }}
</template>
<!-- 是否使用 -->
<template slot="enabled" slot-scope="text">
<span>
{{ text.enabled === 1 ? "是" : "否" }}
</span>
</template>
<!-- 排序 -->
<template slot="fieldOrderNo" slot-scope="text">
<template slot="enabled" slot-scope="{ record }">
<span>
{{ text.fieldOrderNo ? text.fieldOrderNo : "--" }}
{{ record.enabled === 1 ? "是" : "否" }}
</span>
</template>
<!-- 创建日期 -->
<template slot="createTime" slot-scope="text">
{{ text.createTime | dateFormat }}
<template slot="createTime" slot-scope="{ record }">
{{ record.createTime | dateFormat }}
</template>
<!-- 操作 -->
<template slot="action" slot-scope="text">
<template slot="action" slot-scope="{ record }">
<a-space size="middle">
<a class="primary" @click="handleEditRight(text)">编辑</a>
<a class="primary" @click="handleEditRight(record)">编辑</a>
<a
href="javascript:;"
class="delete"
@click="handleDelRight(text.id)"
@click="handleDelRight(record.id)"
>删除</a
>
</a-space>
</template>
</a-table>
</y-table>
</div>
</a-card>
</div>
......@@ -188,7 +165,7 @@
<!-- 新增模板属性弹窗 -->
<AddField
ref="AddField"
:tempLateList="skinTemplate"
:tempLateList="templateTable.data"
:titleField="titleField"
:visibleField.sync="visibleField"
@addField="addField"
......@@ -206,12 +183,33 @@ import {
} from "@/services/surface";
import AddTemplate from "./modal/AddTemplate.vue";
import AddField from "./modal/AddField.vue";
import { pageSizeOptions } from "@/config/pageConfig.js";
const leftColumns = [
import YTable from "@/components/YTable.vue";
export default {
components: {
AddTemplate,
AddField,
YTable,
},
data() {
return {
visibleTemplate: false,
visibleField: false,
titleTemplate: "",
titleField: "",
templateTable: {
loading: false,
page: 1,
size: 1000,
total: 0,
data: [],
searchForm: {
productName: "",
},
columns: [
{
title: "序号",
width: "6%",
scopedSlots: { customRender: "num" },
width: "80px",
scopedSlots: { customRender: "index" },
},
{
title: "设备名称",
......@@ -234,12 +232,22 @@ const leftColumns = [
customRender: "action",
},
},
];
const rightColumns = [
],
},
templateFieldTable: {
loading: false,
page: 1,
size: 10,
total: 0,
data: [],
searchForm: {
templateId: "",
},
columns: [
{
title: "序号",
width: "6%",
scopedSlots: { customRender: "num" },
width: "80px",
scopedSlots: { customRender: "index" },
},
{
title: "字段名称",
......@@ -287,34 +295,9 @@ const rightColumns = [
customRender: "action",
},
},
];
export default {
components: {
AddTemplate,
AddField,
],
},
data() {
return {
leftColumns,
rightColumns,
leftLoading: false,
rightLoading: false,
leftCurrent: 1,
leftSize: -1,
leftTotal: 0,
rightCurrent: 1,
rightSize: 10,
rightTotal: 0,
pageSizeOptions,
visibleTemplate: false,
visibleField: false,
titleTemplate: "",
titleField: "",
leftVal: "", // 左边搜索
rightVal: "", // 右边搜索
productList: [], // 设备列表
skinTemplate: [], // 皮肤模板列表
fieldList: [], // 属性列表
leftSelectedRowKeys: [],
rightSelectedRowKeys: [],
};
......@@ -333,42 +316,42 @@ export default {
},
// 获取模板列表
async getTemplateList(search = {}) {
this.leftLoading = true;
this.templateTable.loading = true;
let res = await getTemplateList({
page: this.leftCurrent,
size: this.leftSize,
productName: `%${this.leftVal}%`,
page: this.templateTable.page,
size: this.templateTable.size,
productName: `%${this.templateTable.searchForm.productName}%`,
...search,
});
let { pageInfo, data } = res.data.data;
if (!data.length && this.leftCurrent > 1) {
this.leftCurrent -= 1;
if (!data.length && this.templateTable.page > 1) {
this.templateTable.page -= 1;
this.getTemplateList();
}
this.leftTotal = pageInfo.totalResult;
this.skinTemplate = data.sort((a, b) => {
this.templateTable.total = pageInfo.totalResult;
this.templateTable.data = data.sort((a, b) => {
return b.createTime - a.createTime;
});
this.leftLoading = false;
this.templateTable.loading = false;
},
// 获取属性字段列表()
async getFieldList(search = {}) {
this.rightLoading = true;
this.templateFieldTable.loading = true;
let res = await getFieldList({
page: this.rightCurrent,
size: this.rightSize,
page: this.templateFieldTable.page,
size: this.templateFieldTable.size,
skinId: 0,
templateId: this.rightVal,
templateId: this.templateFieldTable.searchForm.templateId,
...search,
});
let { pageInfo, data } = res.data.data;
if (!data.length && this.rightCurrent > 1) {
this.rightCurrent -= 1;
if (!data.length && this.templateFieldTable.page > 1) {
this.templateFieldTable.page -= 1;
this.getFieldList();
}
this.fieldList = data;
this.rightTotal = pageInfo.totalResult;
this.rightLoading = false;
this.templateFieldTable.data = data;
this.templateFieldTable.total = pageInfo.totalResult;
this.templateFieldTable.loading = false;
},
// 新增模板
handleAddTemplate() {
......@@ -382,36 +365,16 @@ export default {
this.visibleField = true;
this.$refs.AddField.onAdd();
},
// 左边翻页
changeLeft(num) {
this.leftCurrent = num;
this.getTemplateList();
},
// 左边改变每页显示数量
showSizeChange(current, size) {
this.leftCurrent = current;
this.leftSize = size;
this.getTemplateList();
},
// 右边翻页
changeRight(num) {
this.rightCurrent = num;
this.getFieldList();
},
// 右边改变显示数量
showSizeChangeRight(current, size) {
this.rightCurrent = current;
this.rightSize = size;
this.getFieldList();
},
// 左边搜索
onSearchLift() {
this.leftCurrent = 1;
this.templateTable.page = 1;
this.leftSelectedRowKeys = [];
this.getTemplateList();
},
// 右边搜索
handleChange() {
this.rightCurrent = 1;
this.templateFieldTable.page = 1;
this.rightSelectedRowKeys = [];
this.getFieldList();
},
// 左边选择
......
base-manager-ui/admin/src/pages/basicset/surface/components/ShowBox.vue
View file @ 4a167a50
......@@ -60,6 +60,20 @@ import InfoDisSkin from "../infoDisSkin/InfoDisSkin.vue";
import DefaultShow from "../defaultshow/DefaultShow.vue";
import { mapState, mapMutations } from "vuex";
import { filterItems } from "@/utils";
const skinCompontens = {
pdj: "LandscapeMode",
ckp: "WindowSkin",
hjq: "CallOutSkin",
jzxsp: "CentralizeSkin",
dsj: "SignDevicekin",
pjq: "AppraiseSkin",
zzfwzd: "SelfService",
tdj: "WriteFormSkin",
ybj: "SampleFormSkin",
xxfbp: "InformationSkin",
zmszzfwzd: "DesSelfService",
xxgk: "InfoDisSkin",
};
export default {
components: {
LandscapeMode,
......@@ -79,6 +93,7 @@ export default {
props: {},
data() {
return {
skinCompontens,
filterItems,
skinInfo: {},
};
......@@ -88,47 +103,8 @@ export default {
...mapState("site", ["imageResolution", "curSkin", "curSkinIndex"]),
component() {
let str = "";
switch (this.curSkin.productCode) {
case "pdj":
str = "LandscapeMode";
break;
case "ckp":
str = "WindowSkin";
break;
case "hjq":
str = "CallOutSkin";
break;
case "jzxsp":
str = "CentralizeSkin";
break;
case "dsj":
str = "SignDevicekin";
break;
case "pjq":
str = "AppraiseSkin";
break;
case "zzfwzd":
str = "SelfService";
break;
case "tdj":
str = "WriteFormSkin";
break;
case "ybj":
str = "SampleFormSkin";
break;
case "xxfbp":
str = "InformationSkin";
break;
case "zmszzfwzd":
str = "DesSelfService";
break;
case "xxgk":
str = "InfoDisSkin";
break;
default:
str = "DefaultShow";
}
return str;
str = this.skinCompontens[this.curSkin.productCode];
return str || "DefaultShow";
},
},
......
base-manager-ui/admin/src/pages/basicset/surface/modal/AddSurface.vue
View file @ 4a167a50
......@@ -201,7 +201,20 @@ import { uploadFile, skinSave, getTemplateList } from "@/services/surface";
import html2canvas from "html2canvas";
import { Empty } from "ant-design-vue";
import { mapState } from "vuex";
const skinCompontens = {
pdj: "LandscapeMode",
ckp: "WindowSkin",
hjq: "CallOutSkin",
jzxsp: "CentralizeSkin",
dsj: "SignDevicekin",
pjq: "AppraiseSkin",
zzfwzd: "SelfService",
tdj: "WriteFormSkin",
ybj: "SampleFormSkin",
xxfbp: "InformationSkin",
zmszzfwzd: "DesSelfService",
xxgk: "InfoDisSkin",
};
export default {
components: {
LandscapeMode,
......@@ -234,6 +247,7 @@ export default {
},
data() {
return {
skinCompontens,
loading: false,
formLoading: false,
simpleImage: Empty.PRESENTED_IMAGE_SIMPLE,
......@@ -277,47 +291,8 @@ export default {
},
component() {
let str = "";
switch (this.curProduct.productCode) {
case "pdj":
str = "LandscapeMode";
break;
case "ckp":
str = "WindowSkin";
break;
case "hjq":
str = "CallOutSkin";
break;
case "jzxsp":
str = "CentralizeSkin";
break;
case "dsj":
str = "SignDevicekin";
break;
case "pjq":
str = "AppraiseSkin";
break;
case "zzfwzd":
str = "SelfService";
break;
case "tdj":
str = "WriteFormSkin";
break;
case "ybj":
str = "SampleFormSkin";
break;
case "xxfbp":
str = "InformationSkin";
break;
case "zmszzfwzd":
str = "DesSelfService";
break;
case "xxgk":
str = "InfoDisSkin";
break;
default:
str = "DefaultShow";
}
return str;
str = this.skinCompontens[this.curProduct.productCode];
return str || "DefaultShow";
},
...mapState("site", ["imageResolution", "curProduct"]),
},
......
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