前端页面增删改查
html页面
申请日期 部门 申请人
采购日期 物品名称 规格 数量 金额 申请部门 申请人 操作 {{ data.purchaseDate }}
{{ data.goodsNo }} {{ data.specifications }} {{ data.quantity }} {{ data.amount }} {{ data.departmentName }} {{ data.applyName }} 编辑 保存 删除 取消 共 {{ total }} 条
js部分代码
import { Component, OnInit } from "@angular/core";
import { Router, ActivatedRoute } from "@angular/router";
import { HttpReqService } from "../../../common/service/HttpUtils.Service";
import { JsUtilsService } from "../../../common/service/JsUtils.Service";
import { Utils } from "../../../common/utils/utils";
import { GlobalService } from "../../../common/service/GlobalService";
import { NzMessageService } from "ng-zorro-antd";
import {Validators} from "@angular/forms";
@Component({selector: "app-articlePurchaseRegistration",templateUrl: "./articlePurchaseRegistration.component.html",styleUrls: ["./articlePurchaseRegistration.component.css"],
})
export class ArticlePurchaseRegistrationComponent implements OnInit {departmentList = [];list = [];page = {total: 0,size: 10,index: 1,};i = 1;reqObj = {page: 1,size: 10,departmentId: "",applyName: "",beginTime: "",endTime: "",sortFlag:true,};editCache = {};goodsClassificationNodes;selectedDates = [];isTableLoading = false;emplList = []; //申请人列表constructor(private router: Router,private route: ActivatedRoute,private httpReq: HttpReqService,private jsUtil: JsUtilsService,private globalService: GlobalService,private message: NzMessageService) {}ngOnInit() {if (sessionStorage.getItem(this.router.url + "1") !== null) {this.reqObj = JSON.parse(sessionStorage.getItem(this.router.url + "1"));if (!Utils.isEmpty(this.reqObj.beginTime) &&!Utils.isEmpty(this.reqObj.endTime)) {this.selectedDates.push(new Date(this.reqObj.beginTime));this.selectedDates.push(new Date(this.reqObj.endTime));}}this.httpReq.post("department/listAll", null, {}, (data) => {if (data["status"] == 200) {this.departmentList = data["data"];}});this.updateList();}add(e?: MouseEvent): void {if (e) {e.preventDefault();}const id =this.list.length > 0? this.list[this.list.length - 1].id +1: 0;const jiatingchengyuan = {purchaseDate:'',//采购日期goodsNo:'',//物品名称specifications:'',// 规格quantity:'',// 数量amount:'',// 金额departmentId:'',// 部门IdapplyName:'',flag:false};// const index = this.interviewContactsList.push(jiatingchengyuan);this.list = [jiatingchengyuan,...this.list,];}//编辑startEdit(e): void {this.list[e].date=new Date(this.list[e].purchaseDate)this.list[e].flag=false}//保存saveEdit(e): void {this.list[e].flag=truethis.list[e].purchaseDate= this.jsUtil.dateFormat2( this.list[e].purchaseDate)this.httpReq.post("purchaseRegister/saveOrUpdateNew",null,this.list[e], (data) => {if (data["code"] == 0) {this.message.success("保存成功！");this.updateList();}});}//取消cancelEdit(e): void {this.list[e].flag=truethis.updateList();}onChange(result: Date[],e): void {this.list[e].purchaseDate= this.jsUtil.dateFormat2(result)console.log( '',this.list[e].purchaseDate)}onOk(result: Date): void {console.log('onOk', result);}//排序changeNum(){if(this.reqObj.sortFlag==true){this.reqObj.sortFlag=false}else if(this.reqObj.sortFlag==false){this.reqObj.sortFlag=true}this.updateList();}out(){// let obj = {// departmentId: this.reqObj.departmentId,// applyName: this.reqObj.applyName,// beginTime:this.reqObj.beginTime,// endTime: this.reqObj.endTime,// };this.httpReq.get("purchaseRegister/export",{},(res) => {if (res.code == 0) {}});}updateList(reset: boolean = false): void {if (reset) {this.page.index = 1;}this.reqObj.page = this.page.index - 1;this.reqObj.size = this.page.size;if (this.reqObj.departmentId == null) {this.reqObj.departmentId = "";}if (this.reqObj.applyName == null) {this.reqObj.applyName = "";}sessionStorage.setItem(this.router.url, JSON.stringify(this.reqObj));this.isTableLoading = true;this.httpReq.get("purchaseRegister/getPage", this.reqObj, (data) => {this.isTableLoading = false;if (data["code"] == 0) {this.list = data["data"]["content"];for (let i = 0; i < this.list.length; i++) {// this.list[i].purchaseDate=new Date(this.list[i].purchaseDate)this.list[i].flag=true}this.page.total = data["data"]["totalElements"];}});}onRangerPickerChange(dateArr: Date[]) {if (dateArr[0]) {this.reqObj.beginTime = this.jsUtil.dateFormat(dateArr[0]) + " 00:00:00";} else {this.reqObj.beginTime = "";}if (dateArr[1]) {this.reqObj.endTime = this.jsUtil.dateFormat(dateArr[1]) + " 23:59:59";} else {this.reqObj.endTime = "";}}delete(id) {this.globalService.delModal(() => {this.httpReq.post("purchaseRegister/del", null, { id: id }, (data) => {if (data["code"] == 0) {this.message.success("删除成功！");this.updateList();}});});}// 通过部门获得人员getEmploList(event) {// this.validateForm.get("departmentId").valuethis.httpReq.get("employees/getByDepartment", { id: event }, (data) => {if (data["status"] == 200 && data["code"] == 0) {this.emplList = data["data"];}});}
}
最后实现的效果
本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！