Skip to content

seeta-device / deviceManage

Go to a project
Commit a5163c49 by 温丽香
Options

各页面的表格滚动条修改

1 parent 2a92a55f
Pipeline #3383 passed
in 59 seconds
Inline Side-by-side
Showing with 182 additions and 46 deletions
src/components/seeta-ui/seeta-table/index.vue
......@@ -143,7 +143,7 @@ export default class seetaTableIndex extends Vue {
// 是否分页
@Prop({ type: Boolean, default: true }) pagination
// 自动高度，仅适用于父级容器有明确高度的情况
@Prop({ type: Boolean, default: false }) autoHeight
@Prop({ type: Boolean, default: true }) autoHeight
// 最大高度，当autoHeight为false时生效
@Prop({ type: [Number, String], default: '100%' }) maxHeight
// 是否自动刷新
......@@ -228,7 +228,7 @@ export default class seetaTableIndex extends Vue {
// 计算列表高度
getTableHeight() {
this.$nextTick(() => {
this.tableHeight = this.refTableBox.getBoundingClientRect().height - 66
this.tableHeight = this.pagination ? this.refTableBox.getBoundingClientRect().height - 66 : this.refTableBox.getBoundingClientRect().height - 25
// console.log(this.tableHeight)
})
}
......@@ -474,5 +474,5 @@ export default class seetaTableIndex extends Vue {
.any-slot
// display: inline-block
vertical-align: middle
over-flow: hidden
overflow: hidden
</style>
src/views/Account/index.vue
......@@ -146,9 +146,28 @@ export default {
},
],
tokenList: [
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' }
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
],
total: 34
total: 20
}
},
watch: {
......
src/views/Apply/index.vue
......@@ -67,7 +67,23 @@ export default {
],
tokenList: [
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 2, name: 'aa', type: 'aa', desc: 'aaaa' }
{ number: 2, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 2, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 2, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 2, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 2, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 2, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 2, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 2, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 2, name: 'aa', type: 'aa', desc: 'aaaa' },
],
total: 34
}
......
src/views/DataList/edit.vue
......@@ -36,11 +36,10 @@
style="width: 100%">
<el-table-column label="序号" width="100px">
<template slot-scope="scope">
<!-- <input type="text" v-model="" @blur="handleBlur"> -->
<span style="margin-left: 12px">{{scope.row.field}}</span>
</template>
</el-table-column>
<el-table-column v-for="(column, index) in tableData[0].columns" :key="index" :label="`列${index + 1}`">
<el-table-column v-for="(column, index) in tableData[0].columns" :key="index" :label="`列${index + 1}`" :width="index + 1 === columnIndex ? '220px' : ''">
<template slot-scope="scope">
<!-- <div class="column-box"> -->
<div style="display: flex">
......@@ -52,7 +51,7 @@
:value="item.value">
</el-option>
</pack-select>
<input type="text" v-model="scope.row.columns[index].value" @blur="handleBlur" placeholder="请输入">
<input type="text" v-model="scope.row.columns[index].value" @blur="handleBlur" placeholder="请输入" class="cell-value">
<!-- <el-select v-model="scope.row.columns[index].type" placeholder="请选择">
<el-option
v-for="item in typeOptions"
......@@ -111,6 +110,10 @@ export default {
columns: [
{ type: 'base64', value: '122' },
{ type: 'string', value: '122' },
{ type: 'base64', value: '122' },
{ type: 'string', value: '122' },
{ type: 'base64', value: '122' },
{ type: 'string', value: '122' },
{ type: 'base64', value: '122' }
]
}, {
......@@ -118,6 +121,10 @@ export default {
columns: [
{ type: 'base64', value: '122' },
{ type: 'string', value: '122' },
{ type: 'base64', value: '122' },
{ type: 'string', value: '122' },
{ type: 'base64', value: '122' },
{ type: 'string', value: '122' },
{ type: 'base64', value: '122' }
]
}, {
......@@ -125,19 +132,28 @@ export default {
columns: [
{ type: 'base64', value: '122' },
{ type: 'string', value: '122' },
{ type: 'base64', value: '122' },
{ type: 'string', value: '122' },
{ type: 'base64', value: '122' },
{ type: 'string', value: '122' },
{ type: 'base64', value: '122' }
]
}, {
field: '4',
columns: [
{ type: 'base64', value: '上海市普陀' },
{ type: 'string', value: '上海市普陀' },
{ type: 'base64', value: '上海市普陀' }
{ type: 'base64', value: '上海市普陀上海市普陀' },
{ type: 'string', value: '上海市普陀上海市普陀' },
{ type: 'base64', value: '122' },
{ type: 'base64', value: '122' },
{ type: 'string', value: '122' },
{ type: 'string', value: '122' },
{ type: 'base64', value: '上海市普陀上海市普陀' }
]
}],
total: 34,
agoCell: null,
flexHeight: 0
flexHeight: 0,
columnIndex: 0
}
},
created() {
......@@ -168,9 +184,13 @@ export default {
this.tableData.push({
field: '5',
columns: [
{ type: 'base64', value: '上海市普陀' },
{ type: 'string', value: '上海市普陀' },
{ type: 'base64', value: '上海市普陀' }
{ type: 'base64', value: '' },
{ type: 'string', value: '' },
{ type: 'base64', value: '' },
{ type: 'base64', value: '' },
{ type: 'string', value: '' },
{ type: 'string', value: '' },
{ type: 'base64', value: '' }
]
})
},
......@@ -198,6 +218,7 @@ export default {
},
clearCell(cell) {
if (!cell) return
this.columnIndex = 0
const select = cell.getElementsByClassName('el-select')
const input = cell.getElementsByTagName('input')
select && select[0] && select[0].classList.add('none-display')
......@@ -215,6 +236,7 @@ export default {
if (this.agoCell !== cell) {
this.clearCell(this.agoCell)
}
this.columnIndex = Number(column.label.substring(1))
cell.getElementsByClassName('el-select')[0].classList.remove('none-display')
if (cell.getElementsByTagName('input')[0] && cell.getElementsByTagName('input')[1]) {
cell.getElementsByTagName('input')[0].classList.add('write')
......@@ -369,8 +391,7 @@ export default {
color:#999999
.pagination
text-align: center
margin-top: 24px
margin-bottom: 10px
margin: 20px 0
.el-pagination
white-space: nowrap
padding: 2px 5px
......@@ -389,6 +410,15 @@ export default {
color: #C0C4CC
.none-display
display: none
.cell-value
white-space: nowrap
overflow: hidden
text-overflow: ellipsis
&::placeholder
font-size: 14px
font-family: PingFangSC-Regular, PingFang SC
font-weight: 400
color:#999999!important
.buttons
position: absolute
bottom: 0
......
src/views/DataList/index.vue
......@@ -103,7 +103,24 @@ export default {
},
],
tokenList: [
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' }
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
],
total: 34
}
......
src/views/ParamsModel/add.vue
......@@ -315,7 +315,7 @@ export default {
.add-btn
height: 32px
line-height: 28px
margin-top: 20px
margin-top: 30px
border: 2px dashed #D7DAE0
border-radius: 2px
border-radius: 2px
......
src/views/ParamsModel/detail.vue
......@@ -4,38 +4,23 @@
<span class="title">{{'参数模板 / 详情'}}</span>
</div>
<div class="page-content">
<st-form
<st-form class="flex-form"
ref="form"
label-width="100px"
:model="form">
<st-form-item
style="margin-bottom:20px"
:label="'模板名称'+':'"
prop="name">
<st-form-item :label="'模板名称'+':'">
<span>{{form.name}}</span>
</st-form-item>
<st-form-item
style="margin-bottom:20px"
:label="'模板类型'+':'"
prop="name">
<st-form-item :label="'模板类型'+':'">
<span>{{form.name}}</span>
</st-form-item>
<st-form-item
style="margin-bottom:20px"
:label="'基础模板'+':'"
prop="name">
<st-form-item :label="'基础模板'+':'">
<span>{{form.name}}</span>
</st-form-item>
<st-form-item
style="margin-bottom:20px"
:label="'描述'+':'"
prop="description">
<st-form-item :label="'描述'+':'">
<span>{{form.name}}</span>
</st-form-item>
<st-form-item
style="margin-bottom:20px"
:label="'参数'+':'"
prop="description">
<st-form-item :label="'参数'+':'" class="flex1">
<st-table
ref="vTable"
:options="definitions"
......@@ -86,12 +71,43 @@ export default {
field: 'teat',
type: 'string',
value: '上海市普陀区金沙江路'
}, {
field: 'name',
type: 'number',
value: '122'
}, {
field: 'database',
type: 'table',
value: 'fein_fe'
}, {
field: 'image',
type: 'blob',
value: '24字节'
}, {
field: 'teat',
type: 'string',
value: '上海市普陀区金沙江路'
}, {
field: 'name',
type: 'number',
value: '122'
}, {
field: 'database',
type: 'table',
value: 'fein_fe'
}, {
field: 'image',
type: 'blob',
value: '24字节'
}, {
field: 'teat',
type: 'string',
value: '上海市普陀区金沙江路'
}],
total: 0
}
},
mounted() {
// this.getData()
},
methods: {
}
......@@ -99,4 +115,15 @@ export default {
</script>
<style lang="sass" scoped>
.page-content
::v-deep.el-form-item
margin-bottom: 20px
.flex-form
display: flex
flex-direction: column
height: 100%
.flex1
flex: 1
::v-deep.el-form-item__content
height: 100%!important
</style>
src/views/ParamsModel/edit.vue
......@@ -315,7 +315,7 @@ export default {
.add-btn
height: 32px
line-height: 28px
margin-top: 20px
margin-top: 30px
border: 2px dashed #D7DAE0
border-radius: 2px
border-radius: 2px
......
src/views/ParamsModel/index.vue
......@@ -19,7 +19,7 @@
ref="vTable"
:options="definitions"
:data="{
list: tokenList,
list: oneList,
total: total,
}"
highlight-current-row
......@@ -49,7 +49,7 @@
ref="vTable"
:options="definitions"
:data="{
list: tokenList,
list: twoList,
total: total,
}">
<div slot="operate" slot-scope="row">
......@@ -95,7 +95,26 @@ export default {
slotName: 'operate'
},
],
tokenList: [
oneList: [
{ number: 1, name: 'aa', type: 'aa', desc: 'aaasdfasdfasdaa' },
{ number: 1, name: 'aa', type: 'aa', desc: '描述描述描述描述描述描述' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaasdfasdfasdaa' },
{ number: 1, name: 'aa', type: 'aa', desc: '描述描述描述描述描述描述' },
],
twoList: [
{ number: 1, name: 'aa', type: 'aa', desc: 'aaasdfasdfasdaa' },
{ number: 1, name: 'aa', type: 'aa', desc: '描述描述描述描述描述描述' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaasdfasdfasdaa' },
{ number: 1, name: 'aa', type: 'aa', desc: '描述描述描述描述描述描述' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaasdfasdfasdaa' },
{ number: 1, name: 'aa', type: 'aa', desc: '描述描述描述描述描述描述' },
{ number: 1, name: 'aa', type: 'aa', desc: 'aaaa' },
......@@ -138,6 +157,14 @@ export default {
.level
width: calc(50% - 10px)
padding: 14px 20px
.table-list
height: calc(100% - 60px)
.list-content
height: 100%
.table-box
height: 100%
::v-deep.el-table
max-height: 100%!important
.content-header
display: flex
justify-content: space-between
......
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!