| | |
| | | return { background: "#152851", color: "#fff" }; |
| | | }; |
| | | // 表格表头样式 |
| | | const headerCellStyle = ({}) => { |
| | | const headerCellStyle = ({ }) => { |
| | | return { |
| | | background: "#152851", |
| | | color: "#fff", |
| | |
| | | // 搜索条件 |
| | | const formInline = reactive({ |
| | | perInCha: "", |
| | | type:'' |
| | | type: '' |
| | | }); |
| | | |
| | | // 提交查询 |
| | | const onSubmit = () => { |
| | | pages.page = 1 |
| | | pages.pageSize=13 |
| | | pages.total= 0 |
| | | pages.pageSize = 13 |
| | | pages.total = 0 |
| | | console.log("submit!"); |
| | | getLists(formInline); |
| | | }; |
| | |
| | | getLists(formInline); |
| | | } |
| | | // 重置条件 |
| | | const clearBtn = ()=>{ |
| | | const clearBtn = () => { |
| | | formInline.perInCha = '' |
| | | formInline.type = '' |
| | | pages.page = 1 |
| | | pages.pageSize=13 |
| | | pages.total= 0 |
| | | pages.pageSize = 13 |
| | | pages.total = 0 |
| | | getLists(formInline); |
| | | } |
| | | |
| | |
| | | .then((res) => { |
| | | const data = res.data.data; |
| | | data.records.forEach((element) => { |
| | | if (element.type==1) { |
| | | if (element.type == 1) { |
| | | element.ownership = "园区"; |
| | | } else { |
| | | element.ownership = "企业"; |
| | |
| | | <div> |
| | | <el-form :inline="true" :model="formInline" class="demo-form-inline"> |
| | | <el-form-item label="姓名"> |
| | | <el-input |
| | | v-model="formInline.perInCha" |
| | | placeholder="请输入姓名" |
| | | clearable |
| | | style="width: 120px" |
| | | /> |
| | | <el-input v-model="formInline.perInCha" placeholder="请输入姓名" clearable style="width: 120px" /> |
| | | </el-form-item> |
| | | <el-form-item label="归属"> |
| | | <el-select |
| | | v-model="formInline.type" |
| | | placeholder="请选择" |
| | | clearable |
| | | style="width: 120px" |
| | | > |
| | | <el-select v-model="formInline.type" placeholder="请选择" clearable style="width: 120px"> |
| | | <el-option label="园区" value="1" /> |
| | | <el-option label="企业" value="2" /> |
| | | </el-select> |
| | |
| | | <el-button type="" @click="clearBtn">重置</el-button> |
| | | </el-form-item> |
| | | </el-form> |
| | | <el-table |
| | | :data="tableData" |
| | | style="width: 100%" |
| | | :header-cell-style="headerCellStyle" |
| | | :cell-style="tableCellStyle" |
| | | v-loading="loading" |
| | | > |
| | | <el-table :data="tableData" style="width: 100%" :header-cell-style="headerCellStyle" :cell-style="tableCellStyle" |
| | | v-loading="loading"> |
| | | <el-table-column fixed prop="perInCha" label="责任人姓名" /> |
| | | <el-table-column prop="perInChaPho" label="联系电话" /> |
| | | <!-- <el-table-column prop="firmName" label="单位名称" /> --> |
| | | <el-table-column prop="ownership" label="归属" width="100" /> |
| | | </el-table> |
| | | <div class="el-page"> |
| | | <el-pagination |
| | | background |
| | | layout="prev, pager, next" |
| | | :page-size="pages.pageSize" |
| | | :total="pages.total" |
| | | @size-change="handleSizeChange" |
| | | @current-change="handleCurrentChange" |
| | | /> |
| | | <el-pagination background layout="prev, pager, next" :page-size="pages.pageSize" :total="pages.total" |
| | | @size-change="handleSizeChange" @current-change="handleCurrentChange" /> |
| | | </div> |
| | | </div> |
| | | </template> |
| | |
| | | </template> |
| | | |
| | | <style lang="scss" scoped> |
| | | ::v-deep .el-table__body-wrapper { |
| | | background-color: #152851; |
| | | } |
| | | |
| | | .el-form-item__label { |
| | | color: #fff !important; |
| | | } |
| | | |
| | | /* 当表格没有数据时,修改表格的背景颜色 */ |
| | | .el-table--empty .el-table__body { |
| | | background-color: #19284e !important; /* 你想要的背景颜色 */ |
| | | background-color: rgba(135, 158, 199, 0.3) !important; |
| | | /* 你想要的背景颜色 */ |
| | | } |
| | | |
| | | .el-page { |
| | |
| | | width: 100%; |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: center; |
| | | // margin-bottom:10px; |
| | | } |
| | | </style> |