<template>
|
<el-container style="padding: 0px">
|
<el-main style=" margin: 0px; padding: 5px;" class="guihuabox">
|
<div style="margin:5px">
|
<el-select size="small" placeholder="请选择" style="width: 320px" v-model="currentServiceType.text">
|
<el-option v-for="item in serviceTypes" :key="item.id" :label="item.text" :value="item.id"
|
@change="serviceTypeSelectedChange">
|
</el-option>
|
</el-select>
|
</div>
|
<el-table :data="tabledata" border size="mini"
|
style="width: 100%;background-color: transparent;margin-top:10px" rowKey="gid">
|
<el-table-column prop="xzq" header-align="center" align="center" label="行政区划">
|
</el-table-column>
|
<el-table-column prop="ydmj" header-align="center" align="center" label="用地面积">
|
</el-table-column>
|
<el-table-column prop="ssgm" header-align="center" align="center" label="设施规模">
|
</el-table-column>
|
<el-table-column header-align="center" align="center" width="60" label="详情"><template
|
slot-scope="scope">
|
<el-button type="text" @click="showData(scope.row, scope.$index)" size="small">查看</el-button>
|
</template>
|
</el-table-column>
|
</el-table>
|
</el-main>
|
</el-container>
|
</template>
|
<script>
|
export default {
|
data() {
|
return {
|
tabledata: [{ xmmc: "", cjdw: "", mxs: "" }
|
, { xmmc: "", cjdw: "", mxs: "" }
|
, { xmmc: "", cjdw: "", mxs: "" }
|
, { xmmc: "", cjdw: "", mxs: "" }
|
, { xmmc: "", cjdw: "", mxs: "" }
|
],
|
currentServiceType: { text: "" },
|
serviceTypes: [
|
{ id: "1", text: "总体规划", },
|
{ id: "2", text: "专项规划", },
|
{ id: "3", text: "城镇开发", },
|
{ id: "4", text: "永久基本农田", }
|
], //列表的数据分页
|
}
|
},
|
methods: {
|
showData(row, index) {
|
|
},
|
serviceTypeSelectedChange(val) {
|
|
}
|
}
|
}
|
</script>
|
<style lang="less" scoped>
|
.guihuabox {
|
/deep/ .el-input__inner {
|
background-color: transparent;
|
background-image: none;
|
border-radius: 0px;
|
border: 1px solid #5c6d96;
|
color: #ffffff;
|
}
|
|
|
|
.el-table /deep/ tr {
|
background-color: transparent;
|
color: rgba(240, 250, 254, 0.65);
|
}
|
|
.el-table /deep/ tr th {
|
background-color: rgba(99, 99, 99, 1);
|
color: rgba(240, 250, 254, 0.85);
|
}
|
|
.el-table /deep/ tr:hover>td {
|
background-color: rgba(0, 166, 226, 0.4) !important;
|
}
|
}
|
</style>
|
