// 设置
localStorage.setItem("typeName", this.titleList[this.titleIndex].typeName)
// 取值
this.typeName = localStorage.getItem("typeName")
// 返回清除页面
this.$store.dispatch('tagsView/delView', this.$route)
this.$router.go(-1)
多选(在物业项目 dashboard/index)
<el-dialog
title="房屋缴费"
:visible.sync="payVisible"
width="72%"
:before-close="payVisibleClose"
>
<div style="margin-top: -40px" />
<div>
<el-divider />
<div class="center">
<div>
<div style="display: flex;">
<div style="margin-right:20px;font-size: 18px;font-weight: bold;">房租缴费: </div>
<div>
<el-table
v-loading="loading"
:data="listToPay1"
border
fit
:header-cell-style="{background:'#FAFAFA'}"
class="nowrap-list-table"
tooltip-effect="dark"
@selection-change="handleSelectionChange1"
row-key="id"
>
<el-table-column
type="selection"
:reserve-selection="true"
>
</el-table-column>
<af-table-column
:resizable="false"
prop="orderNum"
label="订单号"
/>
<el-table-column
:resizable="false"
prop="amount"
label="费用"
width="100"
/>
<af-table-column
:resizable="false"
prop="createTime"
label="创建时间"
/>
<af-table-column
:resizable="false"
prop="period"
label="周期"
/>
<el-table-column
:resizable="false"
prop="status"
label="状态"
width="100"
>
<template slot-scope="scope">
<el-tag :type="scope.row.status == '0' ? 'danger' : scope.row.status == '1' ? 'success' : scope.row.status == '2' ? 'warning' : 'info'">
<span v-if="scope.row.status === 0">待缴费</span>
<span v-if="scope.row.status === 1">已缴费</span>
<span v-if="scope.row.status === 2">缴费中</span>
<span v-if="scope.row.status === 3">缴费失败</span>
</el-tag>
</template>
</el-table-column>
</el-table>
</div>
</div>
<div>
<div class="block" >
<el-pagination
small
:hide-on-single-page="true"
background
:current-page="current1"
:page-sizes="[3]"
:page-size="pageSize1"
layout="total, sizes, prev, pager, next, jumper"
:total="total1"
style="padding: 30px 0; text-align: right;"
@size-change="handleSizeChange1"
@current-change="handleCurrentChange1"
/>
</div>
</div>
</div>
</div>
</div>
<div class="primarys">
<span class="price">¥ {{ amounts1+amounts2+amounts3 }}</span>
<el-button type="primary" size="medium" @click="payment(ids1,ids2,ids3)">支付</el-button>
</div>
</el-dialog>
data() {
ids1: [], // 房租id
amounts1: 0, // 房租金额
}
methods: {
// 方法
handleSelectionChange1(val) {
this.ids1 = []
this.amounts1 = 0
console.log(val)
val.forEach((item, index) => {
if (item.id != null) {
this.ids1.push(item.id)
this.amounts1 += item.amount
}
})
}
}
下拉模糊匹配后端数据(物业项目 gatekeeper/employee/index)
<el-form-item label="用户" prop="realName">
<el-autocomplete
v-model="saveData.realName"
:fetch-suggestions="querySearchAsync"
placeholder="请输入员工姓名"
clearable
style="width: 200px;margin-right: 9px"
:trigger-on-focus="false"
@select="handleSelect"
/>
</el-form-item>
methods: {
querySearchAsync(queryString, cb) {
employeeAPI.getTzUserName(queryString)
.then(response => {
const KnowledgeList = []
response.data.forEach(item => {
KnowledgeList.push({ 'value': item.realName, 'content': item.userId })
})
cb(KnowledgeList)
})
},
handleSelect(item) {
this.saveData.userId = item.content
console.log(this.saveData.userId)
},
万能居中
.center{
height: 100%;
display: flex;
justify-content: center;
font-size: 18px;
font-weight: bold;
margin-top: 10px;
}
mybatis-puls条件构造器
// 修改
orderService.update(order, new LambdaQueryWrapper<Order>().eq(Order::getOrderNumber, order.getOrderNumber()));
// 查询
tzTeacherServise.list(new QueryWrapper<TzTeacher>().lambda().eq(TzTeacher::getStudentId,tzTeacher.getStudentId()))
@GetMapping("/tzFloorPage")
public ResponseEntity<Result> getTzFloorPage(@RequestParam(name = "Name", required = false) @ApiParam("小区楼名称") String Name,
@RequestParam(required = false, defaultValue = "1") int pageIndex,
@RequestParam(required = false, defaultValue = "10") int pageSize
){
LambdaQueryWrapper<TzFloor> queryLambda = new QueryWrapper<TzFloor>().lambda();
queryLambda.orderByDesc(TzFloor::getCreateTime); // 排序
queryLambda.eq(StrUtil.isNotBlank(Name),TzFloor::getName, Name); // 条件
queryLambda.eq(isDefault != null,TzCommunity::getIsDefault, isDefault);
return ResponseEntity.ok(ResultUtil.success(tzFloorService.page(new Page<>(pageIndex, pageSize), queryLambda)));
}
java后端事务
@Transactional(rollbackFor = Exception.class)
// 前端使用filter过滤数据
const aa = res.data.list.filter(item => {return item.typeId === 2})
const bb = res.data.listTwo.filter(item => {return item.typeId === 3})