|
|
@@ -0,0 +1,287 @@
|
|
|
+<template>
|
|
|
+ <div style="">
|
|
|
+ <div style="display: flex; justify-content: space-between; margin-bottom: 10px">
|
|
|
+ <div style="display: flex">
|
|
|
+ <el-input v-model.trim="query.nameOrNumb" clearable placeholder="请输入工人名称或手机号"
|
|
|
+ style="margin: 0 10px; width: 200px" />
|
|
|
+ <el-button type="primary" class="search" @click="searchData">搜索</el-button>
|
|
|
+ <el-button type="primary" class="search" @click="reset" style="margin-left: 5px">重置</el-button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!--表格-->
|
|
|
+ <el-table :data="tableData" border ref="multipleTable" :height="tableH" stripe
|
|
|
+ :header-cell-style="{
|
|
|
+ background: '#e5e8ed',
|
|
|
+ color: '#666',
|
|
|
+ textAlign: 'center',
|
|
|
+ }"
|
|
|
+ highlight-current-row
|
|
|
+ @current-change="selectOne"
|
|
|
+ :cell-style="tableStyle"
|
|
|
+ style="cursor: default">
|
|
|
+
|
|
|
+ <el-table-column prop="name" label="姓名" :show-overflow-tooltip="true" />
|
|
|
+ <el-table-column prop="phoneNum" :show-overflow-tooltip="true" label="联系电话" />
|
|
|
+ </el-table>
|
|
|
+ <div class="block">
|
|
|
+ <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="sorts.page"
|
|
|
+ :page-sizes="[10, 20, 30, 40, 50]" :page-size="sorts.limit" layout="prev, pager,next,jumper,total,sizes"
|
|
|
+ :total="total">
|
|
|
+ </el-pagination>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+<script>
|
|
|
+import Repair from "@/api/repair";
|
|
|
+export default {
|
|
|
+ name: "workerDialog",
|
|
|
+ created() {
|
|
|
+ this.getData();
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ imgUrl: process.env.VUE_APP_IMG_URL,
|
|
|
+ tableStyle: {
|
|
|
+ textAlign: "center",
|
|
|
+ },
|
|
|
+ tableH: "calc(70vh - 230px)",
|
|
|
+ // 搜索参数
|
|
|
+ query: {
|
|
|
+ nameOrNumb: "",
|
|
|
+ },
|
|
|
+ // 列表数据
|
|
|
+ tableData: [],
|
|
|
+ // 总数
|
|
|
+ total: 0,
|
|
|
+ // 分页
|
|
|
+ sorts: {
|
|
|
+ page: 1,
|
|
|
+ limit: 10,
|
|
|
+ },
|
|
|
+ tableDataOne: {}
|
|
|
+ };
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ // 列表排序
|
|
|
+ compare(property) {
|
|
|
+ return function (a, b) {
|
|
|
+ var value1 = a[property];
|
|
|
+ var value2 = b[property];
|
|
|
+ return value1 - value2;
|
|
|
+ };
|
|
|
+ },
|
|
|
+ selectOne(currentRow, oldCurrentRow){
|
|
|
+ this.tableDataOne = currentRow
|
|
|
+ },
|
|
|
+ //切换列表条数
|
|
|
+ handleSizeChange(pageSize) {
|
|
|
+ this.sorts.limit = pageSize;
|
|
|
+ this.sorts.page = 1;
|
|
|
+ this.getData();
|
|
|
+ },
|
|
|
+ //切换页码
|
|
|
+ handleCurrentChange(currentPage) {
|
|
|
+ this.$refs.multipleTable.bodyWrapper.scrollTop = 0;
|
|
|
+ this.sorts.page = currentPage;
|
|
|
+ this.getData();
|
|
|
+ },
|
|
|
+
|
|
|
+ // 获取列表数据
|
|
|
+ getData() {
|
|
|
+ let params = {
|
|
|
+ role : 2,
|
|
|
+ phoneNum:this.query.nameOrNumb,
|
|
|
+ page:this.sorts.page-1,
|
|
|
+ size:this.sorts.limit
|
|
|
+ }
|
|
|
+ Repair
|
|
|
+ .queryByPage({
|
|
|
+ params
|
|
|
+ })
|
|
|
+ .then((r) => {
|
|
|
+ console.log(r);
|
|
|
+ this.total = r.data.totalElements
|
|
|
+ this.tableData = r.data.content
|
|
|
+ });
|
|
|
+ },
|
|
|
+ // 搜索
|
|
|
+ searchData() {
|
|
|
+ this.sorts.page = 1;
|
|
|
+ this.getData();
|
|
|
+ },
|
|
|
+ // 清空输入框
|
|
|
+ reset() {
|
|
|
+ this.query.nameOrNumb = "";
|
|
|
+ this.sorts.page = 1;
|
|
|
+ this.getData();
|
|
|
+ },
|
|
|
+ },
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style>
|
|
|
+/* 全局取消按钮 */
|
|
|
+.btn-custom-cancel {
|
|
|
+ margin-left: 10px !important;
|
|
|
+ float: right;
|
|
|
+}
|
|
|
+</style>
|
|
|
+
|
|
|
+<style scoped lang="less">
|
|
|
+/* 禁用后的勾选*/
|
|
|
+/deep/ .el-checkbox__input.is-disabled.is-checked .el-checkbox__inner::after {
|
|
|
+ border-color: #def5cb;
|
|
|
+}
|
|
|
+
|
|
|
+/deep/ .el-checkbox__input.is-disabled.is-checked .el-checkbox__inner {
|
|
|
+ background-color: #157de9;
|
|
|
+ border-color: #dcdfe6;
|
|
|
+}
|
|
|
+
|
|
|
+/deep/ .el-dialog__body {
|
|
|
+ padding: 0 0 30px 20px;
|
|
|
+ color: #606266;
|
|
|
+ font-size: 14px;
|
|
|
+ word-break: break-all;
|
|
|
+}
|
|
|
+
|
|
|
+/deep/ .el-dialog {
|
|
|
+ margin: 0 auto 0;
|
|
|
+}
|
|
|
+
|
|
|
+/deep/ .el-form-item__label {
|
|
|
+ padding: 0;
|
|
|
+}
|
|
|
+
|
|
|
+.yxnaContent {
|
|
|
+ padding: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.addTitle {
|
|
|
+ font-size: 18px;
|
|
|
+ font-weight: bold;
|
|
|
+ margin-bottom: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.add {
|
|
|
+ width: 66px;
|
|
|
+ height: 38px;
|
|
|
+ margin-left: 0;
|
|
|
+}
|
|
|
+
|
|
|
+/deep/ .el-col-12 {
|
|
|
+ width: 50%;
|
|
|
+ text-align: left;
|
|
|
+}
|
|
|
+
|
|
|
+.search {
|
|
|
+ width: 66px;
|
|
|
+ height: 38px;
|
|
|
+ margin-left: 0;
|
|
|
+}
|
|
|
+
|
|
|
+/deep/ .el-form-item__label {
|
|
|
+ // height: 40px;
|
|
|
+ // width: 110px;
|
|
|
+ // background-color: #fafafa;
|
|
|
+ text-align: center;
|
|
|
+ // border: 1px solid #dcdfe6;
|
|
|
+ // border-radius: 2px 0 0 2px;
|
|
|
+}
|
|
|
+
|
|
|
+/deep/ .el-button.is-disabled {
|
|
|
+ color: #c0c4cc !important;
|
|
|
+}
|
|
|
+
|
|
|
+/deep/.el-button--primary.is-disabled {
|
|
|
+ color: #fff !important;
|
|
|
+}
|
|
|
+
|
|
|
+/deep/ .el-input__inner {
|
|
|
+ border-radius: 2px 0 0 2px;
|
|
|
+}
|
|
|
+
|
|
|
+.el-select>.el-input {
|
|
|
+ width: 200px;
|
|
|
+}
|
|
|
+
|
|
|
+/deep/ .el-textarea__inner {
|
|
|
+ height: 100px;
|
|
|
+}
|
|
|
+
|
|
|
+/deep/ .el-dialog__title {
|
|
|
+ font-size: 14px;
|
|
|
+}
|
|
|
+
|
|
|
+/deep/ .el-pagination__total {
|
|
|
+ margin-left: 10px !important;
|
|
|
+}
|
|
|
+
|
|
|
+.el-pagination {
|
|
|
+ margin: 0;
|
|
|
+ margin-top: 10px;
|
|
|
+ /* position: fixed;
|
|
|
+ left: 13rem; */
|
|
|
+}
|
|
|
+
|
|
|
+/deep/ .el-table--scrollable-x .el-table__body-wrapper {
|
|
|
+ z-index: 2;
|
|
|
+}
|
|
|
+
|
|
|
+.imgBox {
|
|
|
+ width: 100%;
|
|
|
+ /*height: 55vh;*/
|
|
|
+ height: 100%;
|
|
|
+}
|
|
|
+
|
|
|
+.but {
|
|
|
+ width: 36px;
|
|
|
+ height: 22px;
|
|
|
+ padding: 0;
|
|
|
+ font-size: 12px;
|
|
|
+}
|
|
|
+
|
|
|
+.el-checkbox {
|
|
|
+ margin: 0;
|
|
|
+ margin-right: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+/deep/ .bewrite>.el-form-item__label {
|
|
|
+ width: 100%;
|
|
|
+ text-align: left;
|
|
|
+ padding-left: 21px;
|
|
|
+}
|
|
|
+
|
|
|
+/deep/ .el-form--inline .el-form-item {
|
|
|
+ margin-right: 0px;
|
|
|
+}
|
|
|
+
|
|
|
+/deep/ [data-v-2cde7735] .el-form-item__label {
|
|
|
+ border: 1px solid #dcdfe6;
|
|
|
+ /*border-right: transparent;*/
|
|
|
+}
|
|
|
+
|
|
|
+/* 空白框*/
|
|
|
+/deep/ .formTempBox {
|
|
|
+ height: 38px;
|
|
|
+ border: 1px solid #dcdfe6;
|
|
|
+ width: 100%;
|
|
|
+ border-left: transparent;
|
|
|
+ background-color: #fafafa;
|
|
|
+}
|
|
|
+
|
|
|
+/deep/ .el-select__tags .el-select__tags-text {
|
|
|
+ font-size: 14px;
|
|
|
+}
|
|
|
+
|
|
|
+/deep/ .input-star>.el-form-item__label:before {
|
|
|
+ content: "*";
|
|
|
+ color: #f56c6c;
|
|
|
+ margin-right: 4px;
|
|
|
+}
|
|
|
+
|
|
|
+// 去除上传组件动画过渡效果
|
|
|
+/deep/ .el-upload-list__item {
|
|
|
+ transition: none !important;
|
|
|
+}
|
|
|
+</style>
|
