Commit d02b9526 authored by “yiyousong”'s avatar “yiyousong”

feat: 添加背靠背皮肤设置和优化事项信息维护

parent ac114fad
#开发环境
NODE_ENV = "development"
VUE_APP_API_BASE_URL=http://192.168.0.250:11071
VUE_APP_API_IMG_URL=http://192.168.0.250:11071/
VUE_APP_API_BASE_URL=http://192.168.0.98:11071
VUE_APP_API_IMG_URL=http://192.168.0.98:11071/
# VUE_APP_API_BASE_URL=http://192.168.0.98:11078
# VUE_APP_API_IMG_URL=http://192.168.0.98:11078/
#VUE_APP_API_BASE_URL=http://10.12.185.213:11071
\ No newline at end of file
......@@ -90,7 +90,7 @@
</a-select>
<a-input-number
v-model="baseform.legalTimeLimitShow"
:disabled="isTimely !== '2'"
:disabled="isTimely != '2'"
placeholder="请输入工作日数"
:min="1"
style="width: 70%"
......@@ -111,7 +111,7 @@
</a-select>
<a-input-number
v-model="baseform.promiseTimeLimitShow"
:disabled="isPromise !== '2'"
:disabled="isPromise != '2'"
placeholder="请输入工作日数"
:min="1"
style="width: 70%"
......@@ -138,36 +138,6 @@
</a-form-model-item>
</a-col>
</a-row>
<a-row>
<a-col :span="8">
<a-form-model-item label="跳转地址" props="netApplyUrl">
<a-input
v-model="baseform.netApplyUrl"
placeholder="请输入跳转地址"
/>
</a-form-model-item>
</a-col>
<a-col :span="8">
<a-form-model-item label="办理流程图" props="tid">
<YUpload
accept=".png,.jpg,.jpeg,.svg"
:limit="1"
v-model="baseform.tid"
listType="picture-card"
></YUpload>
</a-form-model-item>
</a-col>
<a-col :span="8">
<a-form-model-item label="备注" props="remark">
<a-textarea
v-model="baseform.remark"
:auto-size="{ minRows: 5, maxRows: 5 }"
placeholder="请输入备注"
/>
</a-form-model-item>
</a-col>
</a-row>
<!-- 窗口办理 -->
<div class="flex jcb aic">
<div class="color_title">窗口办理</div>
......@@ -249,7 +219,7 @@
</a-select>
<a-select
v-model="baseform.jointInfoShow"
:disabled="isLinked !== '2'"
:disabled="isLinked != '2'"
placeholder="请选择联办机构"
style="width: 70%"
>
......@@ -349,21 +319,16 @@ import {
// addMatterToSite,
getMatterInfo,
} from "@/services/matter";
import YUpload from "@/components/YUpload.vue";
export default {
components: {
YUpload,
},
data() {
return {
siteId: local.getLocal("siteId"), // 站点id
loading: false,
labelCol: { span: 5 },
wrapperCol: { span: 19 },
isTimely: undefined,
isPromise: undefined,
isLinked: undefined,
isTimely: "2",
isPromise: "2",
isLinked: "1",
onlineTypeItem: [], // 网办类型选项
eventTypeShowItem: [], // 事项类型选项
jointInfoShowItem: [], // 连办机构选项
......@@ -394,8 +359,6 @@ export default {
operateSite: "", // 办理地点
cousultingShow: "", // 咨询方式
superviseShow: "", // 监督投诉方式
tid: "", //办理流程图
remark: "", //备注
},
deptData: [], // 部门列表
rules: {
......@@ -431,11 +394,11 @@ export default {
}
},
},
async created() {
await this.getDeptListData();
created() {
this.getDeptListData();
if (this.$route.query.edit == 1) {
let matterId = this.$route.query.matterId;
await this.getMatterInfo(matterId);
this.getMatterInfo(matterId);
}
if (!this.baseform.matterNo) {
this.baseform.matterNo = this.$nanoid();
......@@ -461,23 +424,20 @@ export default {
async getMatterInfo(id) {
let res = await getMatterInfo({ id });
if (res.data.code === 1) {
this.baseform = { ...res.data.data };
this.baseform.promiseTimeLimitShow == ""
? (this.isPromise = "1")
: this.baseform.promiseTimeLimitShow == 0 ||
this.baseform.promiseTimeLimitShow == "即办"
? (this.isPromise = "1")
: (this.isPromise = "2");
this.baseform.legalTimeLimitShow == ""
? (this.isTimely = "1")
: this.baseform.legalTimeLimitShow == 0 ||
this.baseform.legalTimeLimitShow == "即办"
? (this.isTimely = "1")
: (this.isTimely = "2");
this.baseform = res.data.data;
this.curDpt = {
key: this.baseform.deptCode,
label: this.baseform.deptName,
};
if (this.baseform.legalTimeLimitShow) {
this.isTimely == "2";
}
if (this.baseform.promiseTimeLimitShow) {
this.isPromise == "2";
}
if (this.baseform.jointInfoShow) {
this.isLinked == "2";
}
}
},
// 切换部门
......
......@@ -148,7 +148,7 @@
</a-select>
<a-input-number
v-model="baseform.legalTimeLimitShow"
:disabled="isTimely !== '2'"
:disabled="isTimely != '2'"
placeholder="请输入工作日数"
:min="1"
style="width: 70%"
......@@ -172,7 +172,7 @@
</a-select>
<a-input-number
v-model="baseform.promiseTimeLimitShow"
:disabled="isPromise !== '2'"
:disabled="isPromise != '2'"
placeholder="请输入工作日数"
:min="1"
style="width: 70%"
......@@ -272,35 +272,6 @@
</a-form-model-item>
</a-col>
</a-row>
<a-row>
<a-col :span="8">
<a-form-model-item label="跳转地址" props="netApplyUrl">
<a-input
v-model="baseform.netApplyUrl"
placeholder="请输入跳转地址"
/>
</a-form-model-item>
</a-col>
<a-col :span="8">
<a-form-model-item label="办理流程图" props="tid">
<YUpload
accept=".png,.jpg,.jpeg,.svg"
:limit="1"
v-model="baseform.tid"
listType="picture-card"
></YUpload>
</a-form-model-item>
</a-col>
<a-col :span="8">
<a-form-model-item label="备注" props="remark">
<a-textarea
v-model="baseform.remark"
:auto-size="{ minRows: 5, maxRows: 5 }"
placeholder="请输入备注"
/>
</a-form-model-item>
</a-col>
</a-row>
<!-- 窗口办理 -->
<div class="color_title mt">窗口办理</div>
<a-row>
......@@ -642,7 +613,7 @@
</a-select>
<a-select
v-model="baseform.jointInfoShow"
:disabled="isLinked !== '2'"
:disabled="isLinked != '2'"
placeholder="请选择联办机构"
style="width: 70%"
>
......@@ -687,7 +658,7 @@
placeholder="请输入数字"
style="width: 70%"
:min="1"
:disabled="isCount !== '2'"
:disabled="isCount != '2'"
></a-input-number>
</a-input-group>
</a-form-model-item>
......@@ -834,8 +805,6 @@
</template>
<script>
import YUpload from "@/components/YUpload.vue";
import {
saveAddMatter,
// addMatterToSite
......@@ -844,16 +813,13 @@ import { getDeptList } from "@/services/dept";
import local from "@/utils/local";
import { mapGetters } from "vuex";
export default {
components: {
YUpload,
},
data() {
return {
loading: false,
isTimely: undefined, // 是否及时办理
isPromise: undefined, // 承诺是否及时办理
isLinked: undefined, // 是否有联办机构
isCount: undefined, // 是否有数量限制
isTimely: "2", // 是否及时办理
isPromise: "2", // 承诺是否及时办理
isLinked: "1", // 是否有联办机构
isCount: "2", // 是否有数量限制
deptData: [], // 部门选项数据
siteId: local.getLocal("siteId"), // 站点id
baseform: {
......@@ -915,9 +881,7 @@ export default {
operateTime: "", // 办理时间
operateSite: "", // 办理地点
cousultingShow: "", // 咨询方式
superviseShow: "", // 监督投诉方式,
tid: "", //办理流程图
remark: "", //备注
superviseShow: "", // 监督投诉方式
},
// 基础信息校验
baseformRules: {
......@@ -936,8 +900,9 @@ export default {
},
};
},
async created() {
await this.getDeptListData();
created() {
this.mergeForm();
this.getDeptListData();
},
computed: {
...mapGetters("site", ["matterDict"]),
......@@ -978,26 +943,18 @@ export default {
};
local.setLocal("matter", obj);
}
this.baseform.promiseTimeLimitShow == ""
? (this.isPromise = "1")
: this.baseform.promiseTimeLimitShow == 0 ||
this.baseform.promiseTimeLimitShow == "即办"
? (this.isPromise = "1")
: (this.isPromise = "2");
this.baseform.legalTimeLimitShow == ""
? (this.isTimely = "1")
: this.baseform.legalTimeLimitShow == 0 ||
this.baseform.legalTimeLimitShow == "即办"
? (this.isTimely = "1")
: (this.isTimely = "2");
if (!this.baseform.deptCode && this.baseform.deptCode == "") {
let arr = [];
arr = this.deptData.filter((v) => v.name == this.baseform.deptName);
arr && arr.length > 0
? (this.baseform.deptCode = arr[0].deptNumber)
: "";
if (this.baseform.legalTimeLimitShow) {
this.isTimely == "2";
}
if (this.baseform.promiseTimeLimitShow) {
this.isPromise == "2";
}
if (this.baseform.jointInfoShow) {
this.isLinked == "2";
}
if (this.baseform.numberLimit) {
this.isCount == "2";
}
this.$forceUpdate(this.baseform);
}
},
// 获取部门列表
......@@ -1006,9 +963,6 @@ export default {
let { code, data } = res.data;
if (code === 1) {
this.deptData = data.data;
await this.mergeForm();
} else {
await this.mergeForm();
}
},
......
<template>
<div class="skin-box">
<!-- 背靠背 1920*1080 -->
<div
:id="componentsId"
class="across-skin"
v-if="resolution === '1920x1080'"
:style="{
background: filterItem('1', 0),
}"
>
<div class="surface-preview-main">
<div class="skin-header">
<h1 class="skin-header-title" :style="{ color: filterItem('2', 0) }">
背靠背评价交互系统
</h1>
</div>
<div class="skin-content">
<div class="skin-content-left">
<div class="flex left-top">
<div class="border"></div>
<div class="border"></div>
</div>
<div class="border left-bottom"></div>
</div>
<div class="skin-content-right border"></div>
</div>
</div>
</div>
<!-- 空数据显示 -->
<div class="empty flex aic jcc" v-else>
<a-empty
:image="require('../../../../assets/img/original.png')"
:image-style="{
height: '80px',
}"
>
<span slot="description"> <a href="#API">暂无皮肤模板</a> </span>
</a-empty>
</div>
</div>
</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,
default: () => {
return [];
},
},
imageResolution: {
required: true,
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) {
let arr = this.skinFieldList.filter((v) => {
return v.remark == type;
});
if (arr.length) {
return this.filterValueType(arr[index]);
} else {
return "";
}
},
// 过滤属性值类型
filterValueType(info = {}) {
let value = "";
if (info.fieldType !== "" && info.fieldType == "1" && info.fieldValue) {
value = info.fieldValue;
} else if (
info.fieldType !== "" &&
info.fieldType == "2" &&
info.fieldValue
) {
value = `url(${this.api + info.fieldValue})`;
}
return value;
},
// 过滤导航
filterNav(type) {
let arr = [];
arr = this.skinFieldList.filter((v) => {
return v.remark == type;
});
return arr;
},
},
};
</script>
<style lang="less" scoped>
.border {
border: 1px dashed #ececec;
}
.across-skin {
width: 1000px;
height: 562.5px;
color: #fff;
background-image: linear-gradient(#26c5ff, #2c66ff);
background-repeat: no-repeat !important;
background-position: center !important;
background-size: 100% 100% !important;
h1 {
color: #fff;
margin: 0px;
}
p {
display: flex;
flex-wrap: wrap;
margin: 0px;
}
.surface-preview-main {
width: 96%;
margin-left: 2%;
height: 100%;
display: flex;
flex-direction: column;
.skin-header {
display: flex;
height: 100px;
margin-bottom: 40px;
justify-content: center;
align-items: center;
.skin-header-title {
font-size: 22px;
font-weight: 600;
letter-spacing: 2px;
}
}
.skin-content {
flex: 1;
display: flex;
justify-content: flex-end;
width: 96%;
margin-left: 2%;
padding-bottom: 20px;
gap: 10px;
.skin-content-left {
flex: 1;
height: 100%;
display: flex;
flex-direction: column;
gap: 10px;
.left-top {
height: 60px;
display: flex;
gap: 10px;
div {
flex: 1;
height: 100%;
}
}
.left-bottom {
flex: 1;
}
}
.skin-content-right {
width: 30%;
height: 100%;
}
}
}
}
</style>
......@@ -57,6 +57,7 @@ import SelfService from "../selfservice/SelfService.vue";
import DesSelfService from "../desSelfservice/DesSelfService.vue";
import SignDevicekin from "../signdeviceskin/SignDeviceSkin.vue";
import InfoDisSkin from "../infoDisSkin/InfoDisSkin.vue";
import BkbSkin from "../bkbSkin/BkbSkin.vue";
import DefaultShow from "../defaultshow/DefaultShow.vue";
import { mapState, mapMutations } from "vuex";
import { filterItems } from "@/utils";
......@@ -73,6 +74,7 @@ const skinCompontens = {
xxfbp: "InformationSkin",
zmszzfwzd: "DesSelfService",
xxgk: "InfoDisSkin",
bkb: "BkbSkin",
};
export default {
components: {
......@@ -88,6 +90,7 @@ export default {
DesSelfService,
SignDevicekin,
InfoDisSkin,
BkbSkin,
DefaultShow,
},
props: {},
......
......@@ -196,6 +196,7 @@ import SelfService from "../selfservice/SelfService.vue";
import DesSelfService from "../desSelfservice/DesSelfService.vue";
import SignDevicekin from "../signdeviceskin/SignDeviceSkin.vue";
import InfoDisSkin from "../infoDisSkin/InfoDisSkin.vue";
import BkbSkin from "../bkbSkin/BkbSkin.vue";
import DefaultShow from "../defaultshow/DefaultShow.vue";
import { uploadFile, skinSave, getTemplateList } from "@/services/surface";
import html2canvas from "html2canvas";
......@@ -214,6 +215,7 @@ const skinCompontens = {
xxfbp: "InformationSkin",
zmszzfwzd: "DesSelfService",
xxgk: "InfoDisSkin",
bkb: "BkbSkin",
};
export default {
components: {
......@@ -229,6 +231,7 @@ export default {
DesSelfService,
SignDevicekin,
InfoDisSkin,
BkbSkin,
DefaultShow,
},
props: {
......
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