Browse Source

公共样式修改、输入框修改

pull/52/head
zq 2 weeks ago
parent
commit
cd77104988
  1. 12
      src/components/GuipSelect.vue
  2. 108
      src/components/GuipTextarea.vue
  3. 43
      src/style/theme/common.scss
  4. 7078
      src/style/theme/index.css
  5. 10
      src/views/agent/siteList.vue

12
src/components/GuipSelect.vue

@ -80,6 +80,18 @@ export default {
if (this.placeholder) { if (this.placeholder) {
this.placeholder1 = this.placeholder this.placeholder1 = this.placeholder
} }
this.$nextTick(() => {
let els = document.querySelectorAll('.el-input');
els.forEach(item => {
item.onmouseover = function () {
item.classList.add("hoverclass")
}
item.onmouseout = function () {
item.classList.remove("hoverclass")
}
})
})
}, },
methods: { methods: {
// value // value

108
src/components/GuipTextarea.vue

@ -1,26 +1,90 @@
<template> <template>
<el-input <el-form-item :label="label" :prop="prop" :rules="rules" :class="[{ 'column': column }]" :required="required">
type="textarea" <p v-if="desc" class="desc_right">{{ desc }}</p>
v-bind="$attrs" <el-input
:style="{...styleObject}" type="textarea"
:rows="rows" v-bind="$attrs"
:placeholder="placeholder" v-model="innerValue"
v-model="textarea"> :style="{ width: width, height: height }"
</el-input> :rows="rows"
</template> @input="handleInput"
@change="handleChange"
<script> ></el-input>
// autosize </el-form-item>
export default { </template>
name: 'GuipTextarea',
props:['styleObject','rows','placeholder'],
data() {
return {
textarea: ''
}
},
mounted(){
<script>
export default {
name: 'MyTextarea',
inheritAttrs: false,
props: {
// v-model
value: {
type: [String, Number],
default: ''
},
// '100px' '100%'
width: {
type: String,
default: '100%'
},
desc: {
type: String,
default: ''
},
// '100px' '100%'
height: {
type: String,
default: 'auto'
},
//
rows: {
type: Number,
default: 4
},
//
label: {
type: String,
default: ''
},
column: {
type: String,
default: ''
},
// prop
prop: {
type: String,
default: ''
},
//
rules: {
type: [Object, Array],
default: () => []
},
required:{
type: Boolean,
default: false
}
},
data() {
return {
innerValue: this.value
}
},
watch: {
value(newVal) {
if (newVal !== this.innerValue) {
this.innerValue = newVal
}
}
},
methods: {
handleInput(value) {
this.$emit('input', value)
},
handleChange(value) {
this.$emit('change', value)
} }
} }
</script> }
</script>

43
src/style/theme/common.scss

@ -13,6 +13,32 @@ body {
padding: 0; padding: 0;
} }
} }
.short-width {
width: calc((100% - 12px) / 2);
}
.pagePadding{
padding: 12px;
box-sizing: border-box;
}
.pageTitle{
font-family: Microsoft YaHei UI;
font-size: 16px;
font-weight: bold;
line-height: normal;
letter-spacing: 0.08em;
color: #1E2226;
text-align: left;
// padding: 24px 0;
}
.littleTitle{
font-family: Microsoft YaHei UI;
font-size: 14px;
font-weight: bold;
line-height: normal;
letter-spacing: 0.08em;
color: #1E2226;
text-align: left;
}
/* 隐藏全局滚动条 */ /* 隐藏全局滚动条 */
::-webkit-scrollbar { ::-webkit-scrollbar {
display: none; display: none;
@ -87,10 +113,13 @@ body {
flex-direction: column; flex-direction: column;
} }
.mb24{ .mb24{
margin-bottom: 24px; margin-bottom: 24px !important;
} }
.mb12{ .mb12{
margin-bottom: 12px; margin-bottom: 12px !important;
}
.mt24{
margin-top: 24px;
} }
.mt12{ .mt12{
margin-top: 12px; margin-top: 12px;
@ -604,7 +633,7 @@ body {
.el-textarea__inner { .el-textarea__inner {
padding: 10px 12px; padding: 10px 12px;
border-radius: 2px; border-radius: 2px;
height: 100%; height: 100% !important;
} }
.el-textarea__inner:hover { .el-textarea__inner:hover {
@ -786,6 +815,9 @@ body {
.tableHeaderSelect .el-input__inner{ .tableHeaderSelect .el-input__inner{
font-size: 13px !important; font-size: 13px !important;
} }
.el-link{
font-size: 13px !important;
}
} }
@ -801,6 +833,9 @@ body {
.tableHeaderSelect .el-input__inner{ .tableHeaderSelect .el-input__inner{
font-size: 12px !important; font-size: 12px !important;
} }
.el-link{
font-size: 13px !important;
}
} }
@media screen and (min-width: 1440px) { @media screen and (min-width: 1440px) {
@ -908,7 +943,7 @@ body {
// dialog--start // dialog--start
.el-dialog { .el-dialog {
min-height: 214px; min-height: 214px;
max-height: 550px; // max-height: 550px;
border-radius: 4px; border-radius: 4px;
background: #FFFFFF; background: #FFFFFF;
box-shadow: 0px 4px 16px 0px rgba(0, 0, 0, 0.16); box-shadow: 0px 4px 16px 0px rgba(0, 0, 0, 0.16);

7078
src/style/theme/index.css

File diff suppressed because it is too large

10
src/views/agent/siteList.vue

@ -140,7 +140,7 @@ export default {
// url // url
serviceListUrl: '/ui', serviceListUrl: '/ui',
// url // url
siteSettingUrl: '/ui', siteSettingUrl: '/siteSetting/siteBaseSetting',
// url // url
addNewSiteUrl: '/ui', addNewSiteUrl: '/ui',
popoverFlag:false, popoverFlag:false,
@ -250,7 +250,7 @@ export default {
}).then(response => { }).then(response => {
if (response.status) { if (response.status) {
// //
this.$message.success(response.info); this.$Message.success(response.info);
// //
this.siteGroups.forEach((item) => { this.siteGroups.forEach((item) => {
@ -263,7 +263,7 @@ export default {
this.$set(this.siteList, row) this.$set(this.siteList, row)
this.currentIcon = require('@/assets/site/drop_icon.svg'); this.currentIcon = require('@/assets/site/drop_icon.svg');
} else { } else {
this.$message.error(response.info); this.$Message.error(response.info);
} }
}).catch(error => { }).catch(error => {
console.error(error, 'error') console.error(error, 'error')
@ -312,13 +312,13 @@ export default {
}).then(response => { }).then(response => {
this.$nextTick(() => { this.$nextTick(() => {
if (response.status) { if (response.status) {
this.$message.success(response.info); this.$Message.success(response.info);
// //
this.getSiteGroups() this.getSiteGroups()
// //
this.groupname = '' this.groupname = ''
} else { } else {
this.$message.error(response.info); this.$Message.error(response.info);
} }
}) })
}).catch(error => { }).catch(error => {

Loading…
Cancel
Save