From d33eacc1f85ac3a736b33ba4713a19aae466d711 Mon Sep 17 00:00:00 2001
From: loulijun2021 <1694218219@qq.com>
Date: 星期五, 05 八月 2022 16:42:53 +0800
Subject: [PATCH] 1.做适应平板显示的内容大小
---
src/views/zzmx/gylx.vue | 67 +++++++++++++++++++++++++--------
1 files changed, 50 insertions(+), 17 deletions(-)
diff --git a/src/views/zzmx/gylx.vue b/src/views/zzmx/gylx.vue
index 8535de9..7c61802 100644
--- a/src/views/zzmx/gylx.vue
+++ b/src/views/zzmx/gylx.vue
@@ -5,12 +5,12 @@
<el-form
ref="form"
:model="form"
- label-width="80px"
+ label-width="100px"
inline
style="display: flex;justify-content: space-between"
>
<div class="elForm">
- <el-form-item label="宸ヨ壓缂栫爜" style=" display: flex;">
+ <el-form-item label="宸ヨ壓璺嚎缂栫爜" style=" display: flex;">
<el-input v-model="form.routecode" placeholder="璇疯緭鍏�" style="width: 200px" />
</el-form-item>
<el-form-item label="宸ヨ壓鍚嶇О" style=" display: flex;">
@@ -32,7 +32,7 @@
<el-divider />
<div style="margin-left: 10px;display: flex">
<el-button type="primary" icon="el-icon-circle-plus-outline" @click="add('add')">鏂板</el-button>
- <el-button type="primary" icon="el-icon-upload2" @click="upload">瀵煎叆</el-button>
+ <!-- <el-button type="primary" icon="el-icon-upload2" @click="upload">瀵煎叆</el-button>-->
</div>
<el-divider />
<div class="elTableDiv">
@@ -90,13 +90,15 @@
prop="lm_date"
label="鍒涘缓鏃堕棿"
sortable="custom"
+ width="160"
/>
<el-table-column
label="鎿嶄綔"
+ width="120"
>
<template slot-scope="{row}">
<div class="operationClass">
- <!-- <el-button type="text" @click="edit('edit',row)">淇敼</el-button>-->
+ <!-- <el-button type="text" @click="edit('edit',row)">缂栬緫</el-button>-->
<el-button type="text" @click="edit('edit',row)">棰勮</el-button>
<el-button type="text" @click="del(row)">鍒犻櫎</el-button>
</div>
@@ -120,15 +122,15 @@
<el-dialog
:title="operation==='add'?'鏂板':'棰勮'"
:visible.sync="dialogVisible"
- width="70%"
+ width="1000px"
:close-on-click-modal="false"
- top="15vh"
+ :top="isIpad?'5vh':'15vh'"
@closed="handleClose"
@close="handleClose"
>
- <el-form ref="dialogForm" style="height: 500px" :rules="dialogFormRules" :model="dialogForm" label-width="80px">
+ <el-form ref="dialogForm" style="height: 500px" :rules="dialogFormRules" :model="dialogForm" label-width="110px">
<div style="display: flex">
- <el-form-item label="宸ヨ壓缂栫爜" prop="code" style="margin-right: 20px">
+ <el-form-item label="宸ヨ壓璺嚎缂栫爜" prop="code" style="margin-right: 20px">
<el-input v-model="dialogForm.code" :disabled="operation!=='add'" style="width: 220px" />
</el-form-item>
<el-form-item label="宸ヨ壓鍚嶇О" prop="name">
@@ -139,6 +141,7 @@
<el-form-item prop="enable" label="浣跨敤鐘舵��" style="margin-right: 20px">
<el-select
v-model="dialogForm.enable"
+ filterable
:disabled="operation==='edit'"
:popper-append-to-body="false"
style="width: 220px"
@@ -256,11 +259,11 @@
<script>
import Pagination from '@/components/Pagination'
-import { AddUpdateRoute, DeleteRoute, RouteSearch, RouteSelect, StepSelect, ViewRoute } from '@/api/zzmx'
+import { AddUpdateRoute, DeleteRoute, RouteSearch, StepSelect, ViewRoute } from '@/api/zzmx'
const SER_HZ = /^[\u4e00-\u9fa5]+$/
export default {
- name: 'Zzjg',
+ name: 'GYLX',
components: {
Pagination
},
@@ -277,6 +280,7 @@
}
}
return {
+ isIpad: false,
mainHeight: 0,
tableHeight: 0,
form: {
@@ -300,7 +304,7 @@
id: '',
code: '',
name: '',
- enable: '',
+ enable: 'Y',
description: '',
Data: []
},
@@ -313,7 +317,7 @@
selectedName: '', // 閫変腑鐨勫悕绉�
autocompleteValue: '', // 鍙悳绱㈣緭鍏ユ涓殑鍊�
routeArr: [], // 宸ヨ壓璁剧疆涓嬫媺鎵�鏈夊��
- addDisabled: false, // 娣诲姞鎸夐挳鏄惁鍙偣鍑�
+ addDisabled: true, // 娣诲姞鎸夐挳鏄惁鍙偣鍑�
editDisabled: true, // 淇敼鎸夐挳鏄惁鍙偣鍑�
mouseFocusPosition: 0, // 榧犳爣鑱氱劍鐨勪綅缃�
operation: '',
@@ -387,6 +391,20 @@
})
if (!flag) {
return this.$message.info('杈撳叆妗嗗唴瀹逛笌涓嬫媺閫夐」鍐呭涓嶅尮閰嶏紒')
+ }
+
+ // 3.杈撳叆妗嗗唴瀹逛笌宸查�夊唴瀹圭浉鍚屾椂涓嶈兘淇濆瓨
+ let flag2 = false
+ this.dynamicTags.forEach(item => {
+ if (item.stepname === this.autocompleteValue.trim()) {
+ flag2 = true
+ }
+ })
+ if (tag.stepname === this.autocompleteValue.trim()) {
+ flag2 = false
+ }
+ if (flag2) {
+ return this.$message.info('姝ゅ伐搴忓凡閫夛紝璇烽�夋嫨鍏跺畠宸ュ簭锛�')
}
// 灏嗗�兼浛鎹㈠埌鍘焧ag浣嶇疆涓�
@@ -583,12 +601,13 @@
handleClose() {
this.dialogForm.code = ''
this.dialogForm.name = ''
- this.dialogForm.enable = ''
+ this.dialogForm.enable = 'Y'
this.dialogForm.description = ''
this.dialogForm.Data = []
this.dynamicTags = [
{ editDisabled: true, stepcode: 'Step01', seq: 1, stepname: ' ', effect: 'light' }
]
+ this.addDisabled = true
this.$refs.dialogForm.clearValidate()
},
// 瀵硅瘽妗嗗彇娑�
@@ -605,6 +624,13 @@
this.dynamicTags.forEach(item => {
Data.push({ seq: item.seq, stepcode: item.stepcode, stepname: item.stepname })
})
+
+ Data.forEach(item => {
+ if (item.stepname === this.routeArr.find(it => it.stepname === item.stepname).stepname) {
+ item.stepcode = this.routeArr.find(it => it.stepname === item.stepname).stepcode
+ }
+ })
+ console.log(Data, 32)
this.$refs.dialogForm.validate(valid => {
if (valid) {
const data = {
@@ -631,7 +657,11 @@
getHeight() {
this.$nextTick(() => {
this.mainHeight = window.innerHeight - 250
- this.tableHeight = this.mainHeight - 100
+ this.tableHeight = this.mainHeight - 50
+ if (window.innerHeight < 769) {
+ this.tableHeight = this.tableHeight - 50
+ }
+ this.isIpad = window.innerHeight < 769 && window.innerWidth < 1367
})
}
}
@@ -682,8 +712,11 @@
color: #606266;
}
+//::v-deep .el-dialog__body {
+// padding: 20px 100px !important;
+//}
::v-deep .el-dialog__body {
- padding: 20px 100px !important;
+ padding: 20px 60px !important;
}
::v-deep .el-radio__input.is-checked .el-radio__inner {
@@ -806,8 +839,8 @@
position: absolute;
margin-left: -7px;
z-index: 2;
- width: 15px;
- height: 15px !important;
+ width: 16px;
+ height: 16px !important;
font-size: 12px;
text-align: center;
line-height: 15px;
--
Gitblit v1.9.3