From 86e5ff7028168bf18b5d3846022ebeac09aa4d4f Mon Sep 17 00:00:00 2001
From: 小小儁爺 <1694218219@qq.com>
Date: 星期四, 05 九月 2024 17:11:19 +0800
Subject: [PATCH] 1.处理页面表格错位问题 引入activated() 事件
---
src/views/systemSetting/processSetting.vue | 456 ++++++++++++++++++++++++++++----------------------------
1 files changed, 228 insertions(+), 228 deletions(-)
diff --git a/src/views/systemSetting/processSetting.vue b/src/views/systemSetting/processSetting.vue
index 3f62e1e..105d0f9 100644
--- a/src/views/systemSetting/processSetting.vue
+++ b/src/views/systemSetting/processSetting.vue
@@ -1,228 +1,228 @@
-<template>
- <div>
- <div class="body" style="padding-top: 10px;" :style="{height:mainHeight+'px'}">
- <el-card class="box-card" :style="{height:(mainHeight-20)+'px'}">
- <div slot="header" style="display: flex;justify-content: flex-end">
- <!-- <span>娴佺▼璁剧疆</span>-->
- <el-button type="primary" @click="save">淇濆瓨</el-button>
- </div>
- <div class="main">
- <div class="block">
- <div class="block-title">宸ヨ壓绠＄悊</div>
- <div class="block-content">
- <div class="font">
- <div>宸ヨ壓璺嚎:</div>
- <el-tooltip class="item" effect="dark" content="宸ュ崟鏄惁鍚敤宸ヨ壓璺嚎鐢熶骇" placement="top">
- <i class="el-icon-question" />
- </el-tooltip>
- <el-switch
- v-model="route"
- style="margin-left: 10px;"
- />
- </div>
-
- <div class="font">
- <div>鎸夊簭鐢熶骇:</div>
- <el-tooltip class="item" effect="dark" content="宸ュ簭鏄惁鏈夊簭鐢熶骇" placement="top">
- <i class="el-icon-question" />
- </el-tooltip>
- <el-switch
- v-model="isOrder"
- style="margin-left: 10px;"
- />
- </div>
-
- </div>
- </div>
- <div class="block">
- <div class="block-title">SOP绠＄悊</div>
- <div class="block-content">
- <div class="font">
- <div>璁惧SOP:</div>
- <el-tooltip class="item" effect="dark" content="鏄惁鍚敤璁惧SOP绠＄悊" placement="top">
- <i class="el-icon-question" />
- </el-tooltip>
- <el-switch
- v-model="device"
- style="margin-left: 10px;"
- />
- </div>
- <div class="font">
- <div>宸ヨ壓SOP:</div>
- <el-tooltip class="item" effect="dark" content="鏄惁鍚敤宸ヨ壓SOP绠＄悊" placement="top">
- <i class="el-icon-question" />
- </el-tooltip>
- <el-switch
- v-model="tech"
- style="margin-left: 10px;"
- />
- </div>
- <div class="font">
- <div>鍗曟嵁SOP:</div>
- <el-tooltip class="item" effect="dark" content="鏄惁鍚敤鍗曟嵁SOP绠＄悊" placement="top">
- <i class="el-icon-question" />
- </el-tooltip>
- <el-switch
- v-model="workOrder"
- style="margin-left: 10px;"
- />
- </div>
-
- </div>
- </div>
- <div class="block">
- <div class="block-title">娴佽浆鏍囩鎵撳嵃</div>
- <div class="block-content">
- <div class="font">
- <div>閫愰亾鎵撳嵃:</div>
- <el-tooltip class="item" effect="dark" content="鏄惁閫愰亾鎵撳嵃" placement="top">
- <i class="el-icon-question" />
- </el-tooltip>
- <el-switch
- v-model="every"
- style="margin-left: 10px;"
- @change="everyChange"
- />
- </div>
- <div class="font">
- <div>鏈亾鎵撳嵃:</div>
- <el-tooltip class="item" effect="dark" content="鏄惁鏈亾鎵撳嵃" placement="top">
- <i class="el-icon-question" />
- </el-tooltip>
- <el-switch
- v-model="last"
- style="margin-left: 10px;"
- :disabled="every"
- />
- </div>
- </div>
- </div>
-
- </div>
- </el-card>
-
- </div>
- </div>
-</template>
-
-<script>
-import { SaveSystemProcConfig } from '@/api/systemSetting'
-import { logout } from '@/api/user'
-
-export default {
- name: 'ProcessSetting',
- data() {
- return {
- mainHeight: 0,
- route: false, // 宸ヨ壓璺嚎
-
- isOrder: true, // 鏄惁鎸夊簭鐢熶骇
- device: true, // 璁惧
- tech: true, // 宸ヨ壓
- workOrder: true, // 宸ュ崟
- every: false, // 鏄惁閫愰亾鎵撳嵃
- last: false // 鏄惁鏈亾鎵撳嵃
- }
- },
- created() {
- },
- mounted() {
- window.addEventListener('resize', this.getHeight)
- this.getHeight()
- this.init()
- },
- methods: {
- init() {
- const mesSetting = JSON.parse(localStorage.getItem('mesSetting'))
- if (mesSetting) {
- this.route = mesSetting.route
-
- this.isOrder = mesSetting.isOrder
- this.device = mesSetting.device
- this.tech = mesSetting.tech
- this.workOrder = mesSetting.workOrder
- this.every = mesSetting.every
- this.last = mesSetting.last
- }
- },
- save() {
- this.$confirm('鏄惁纭淇濆瓨?淇濆瓨鎴愬姛涔嬪悗鑷姩璺宠浆鐧诲綍椤甸噸鏂扮櫥褰�', '鎻愮ず', {
- confirmButtonText: '纭畾',
- cancelButtonText: '鍙栨秷',
- type: 'warning'
- }).then(() => {
- const data = {
- route: this.route, // 宸ヨ壓璺嚎
-
- isOrder: this.isOrder, // 鏄惁鎸夊簭鐢熶骇
- device: this.device, // 璁惧
- tech: this.tech, // 宸ヨ壓
- workOrder: this.workOrder, // 宸ュ崟
- every: this.every, // 鏄惁閫愰亾鎵撳嵃
- last: this.last // 鏄惁鏈亾鎵撳嵃
- }
- SaveSystemProcConfig({ mesSetting: data }).then(res => {
- if (res.code === '200') {
- localStorage.setItem('mesSetting', JSON.stringify(data))
- this.$notify.success('淇濆瓨鎴愬姛锛�')
-
- setTimeout(() => {
- logout().then(res => {
- localStorage.removeItem('token')
- this.$router.push({ path: this.redirect || '/' })
- })
- }, 2000)
- }
- })
- }).catch(() => {
- this.$notify.info('宸插彇娑堜繚瀛橈紒')
- })
- },
- everyChange(val) {
- if (val) {
- this.last = true
- }
- },
-
- // 鑾峰彇椤甸潰楂樺害
- getHeight() {
- this.$nextTick(() => {
- this.mainHeight = window.innerHeight - 85
- })
- }
- }
-}
-</script>
-
-<style scoped>
-.main {
- display: flex;
- flex-direction: column;
-}
-
-.block {
- height: 100px;
-}
-
-.block-title {
-
-}
-
-.block-content {
- padding: 20px;
- display: flex;
- align-items: center;
-}
-
-.font {
- color: #606266;
- font-size: 14px;
- display: flex;
- align-items: center;
- width: 200px;
-}
-
-.el-icon-question {
- cursor: pointer;
-}
-</style>
+<template>
+ <div>
+ <div class="body" style="padding-top: 10px;" :style="{height:mainHeight+'px'}">
+ <el-card class="box-card" :style="{height:(mainHeight-20)+'px'}">
+ <div slot="header" style="display: flex;justify-content: flex-end">
+ <!-- <span>娴佺▼璁剧疆</span>-->
+ <el-button type="primary" @click="save">淇濆瓨</el-button>
+ </div>
+ <div class="main">
+ <div class="block">
+ <div class="block-title">宸ヨ壓绠＄悊</div>
+ <div class="block-content">
+ <div class="font">
+ <div>宸ヨ壓璺嚎:</div>
+ <el-tooltip class="item" effect="dark" content="宸ュ崟鏄惁鍚敤宸ヨ壓璺嚎鐢熶骇" placement="top">
+ <i class="el-icon-question" />
+ </el-tooltip>
+ <el-switch
+ v-model="route"
+ style="margin-left: 10px;"
+ />
+ </div>
+
+ <div class="font">
+ <div>鎸夊簭鐢熶骇:</div>
+ <el-tooltip class="item" effect="dark" content="宸ュ簭鏄惁鏈夊簭鐢熶骇" placement="top">
+ <i class="el-icon-question" />
+ </el-tooltip>
+ <el-switch
+ v-model="isOrder"
+ style="margin-left: 10px;"
+ />
+ </div>
+
+ </div>
+ </div>
+ <div class="block">
+ <div class="block-title">SOP绠＄悊</div>
+ <div class="block-content">
+ <div class="font">
+ <div>璁惧SOP:</div>
+ <el-tooltip class="item" effect="dark" content="鏄惁鍚敤璁惧SOP绠＄悊" placement="top">
+ <i class="el-icon-question" />
+ </el-tooltip>
+ <el-switch
+ v-model="device"
+ style="margin-left: 10px;"
+ />
+ </div>
+ <div class="font">
+ <div>宸ヨ壓SOP:</div>
+ <el-tooltip class="item" effect="dark" content="鏄惁鍚敤宸ヨ壓SOP绠＄悊" placement="top">
+ <i class="el-icon-question" />
+ </el-tooltip>
+ <el-switch
+ v-model="tech"
+ style="margin-left: 10px;"
+ />
+ </div>
+ <div class="font">
+ <div>鍗曟嵁SOP:</div>
+ <el-tooltip class="item" effect="dark" content="鏄惁鍚敤鍗曟嵁SOP绠＄悊" placement="top">
+ <i class="el-icon-question" />
+ </el-tooltip>
+ <el-switch
+ v-model="workOrder"
+ style="margin-left: 10px;"
+ />
+ </div>
+
+ </div>
+ </div>
+ <div class="block">
+ <div class="block-title">娴佽浆鏍囩鎵撳嵃</div>
+ <div class="block-content">
+ <div class="font">
+ <div>閫愰亾鎵撳嵃:</div>
+ <el-tooltip class="item" effect="dark" content="鏄惁閫愰亾鎵撳嵃" placement="top">
+ <i class="el-icon-question" />
+ </el-tooltip>
+ <el-switch
+ v-model="every"
+ style="margin-left: 10px;"
+ @change="everyChange"
+ />
+ </div>
+ <div class="font">
+ <div>鏈亾鎵撳嵃:</div>
+ <el-tooltip class="item" effect="dark" content="鏄惁鏈亾鎵撳嵃" placement="top">
+ <i class="el-icon-question" />
+ </el-tooltip>
+ <el-switch
+ v-model="last"
+ style="margin-left: 10px;"
+ :disabled="every"
+ />
+ </div>
+ </div>
+ </div>
+
+ </div>
+ </el-card>
+
+ </div>
+ </div>
+</template>
+
+<script>
+import { SaveSystemProcConfig } from '@/api/systemSetting'
+import { logout } from '@/api/user'
+
+export default {
+ name: 'ProcessSetting',
+ data() {
+ return {
+ mainHeight: 0,
+ route: false, // 宸ヨ壓璺嚎
+
+ isOrder: true, // 鏄惁鎸夊簭鐢熶骇
+ device: true, // 璁惧
+ tech: true, // 宸ヨ壓
+ workOrder: true, // 宸ュ崟
+ every: false, // 鏄惁閫愰亾鎵撳嵃
+ last: false // 鏄惁鏈亾鎵撳嵃
+ }
+ },
+ activated() {
window.addEventListener('resize', this.getHeight)
this.getHeight()
},
created() {
+ },
+ mounted() {
+ window.addEventListener('resize', this.getHeight)
+ this.getHeight()
+ this.init()
+ },
+ methods: {
+ init() {
+ const mesSetting = JSON.parse(localStorage.getItem('mesSetting'))
+ if (mesSetting) {
+ this.route = mesSetting.route
+
+ this.isOrder = mesSetting.isOrder
+ this.device = mesSetting.device
+ this.tech = mesSetting.tech
+ this.workOrder = mesSetting.workOrder
+ this.every = mesSetting.every
+ this.last = mesSetting.last
+ }
+ },
+ save() {
+ this.$confirm('鏄惁纭淇濆瓨?淇濆瓨鎴愬姛涔嬪悗鑷姩璺宠浆鐧诲綍椤甸噸鏂扮櫥褰�', '鎻愮ず', {
+ confirmButtonText: '纭畾',
+ cancelButtonText: '鍙栨秷',
+ type: 'warning'
+ }).then(() => {
+ const data = {
+ route: this.route, // 宸ヨ壓璺嚎
+
+ isOrder: this.isOrder, // 鏄惁鎸夊簭鐢熶骇
+ device: this.device, // 璁惧
+ tech: this.tech, // 宸ヨ壓
+ workOrder: this.workOrder, // 宸ュ崟
+ every: this.every, // 鏄惁閫愰亾鎵撳嵃
+ last: this.last // 鏄惁鏈亾鎵撳嵃
+ }
+ SaveSystemProcConfig({ mesSetting: data }).then(res => {
+ if (res.code === '200') {
+ localStorage.setItem('mesSetting', JSON.stringify(data))
+ this.$notify.success('淇濆瓨鎴愬姛锛�')
+
+ setTimeout(() => {
+ logout().then(res => {
+ localStorage.removeItem('token')
+ this.$router.push({ path: this.redirect || '/' })
+ })
+ }, 2000)
+ }
+ })
+ }).catch(() => {
+ this.$notify.info('宸插彇娑堜繚瀛橈紒')
+ })
+ },
+ everyChange(val) {
+ if (val) {
+ this.last = true
+ }
+ },
+
+ // 鑾峰彇椤甸潰楂樺害
+ getHeight() {
+ this.$nextTick(() => {
+ this.mainHeight = window.innerHeight - 85
+ })
+ }
+ }
+}
+</script>
+
+<style scoped>
+.main {
+ display: flex;
+ flex-direction: column;
+}
+
+.block {
+ height: 100px;
+}
+
+.block-title {
+
+}
+
+.block-content {
+ padding: 20px;
+ display: flex;
+ align-items: center;
+}
+
+.font {
+ color: #606266;
+ font-size: 14px;
+ display: flex;
+ align-items: center;
+ width: 200px;
+}
+
+.el-icon-question {
+ cursor: pointer;
+}
+</style>
--
Gitblit v1.9.3