|
|
@@ -0,0 +1,220 @@
|
|
|
+const $ = require('jquery');
|
|
|
+require("../css/quality.less");
|
|
|
+require('./../resource/jquery-ui/jquery-ui.min.js');
|
|
|
+require('./modal.js');
|
|
|
+const {
|
|
|
+ api
|
|
|
+} = require('./api.js')
|
|
|
+const {
|
|
|
+ post,
|
|
|
+ getCookie,
|
|
|
+ getUrlArgObjectNew,
|
|
|
+ emptyBox,
|
|
|
+ setDatePicker,
|
|
|
+ getPickerDate,
|
|
|
+ listenScroll
|
|
|
+} = require('./utils.js')
|
|
|
+const iconCalenBlue = require("./../images/icon_calen_blue.png")
|
|
|
+const iconCalenGrey = require("./../images/icon_calen_grey.png")
|
|
|
+const arrowLeft = require("./../images/arrow_left.png")
|
|
|
+const arrowRight = require("./../images/arrow_right.png")
|
|
|
+
|
|
|
+let size = 15,
|
|
|
+ operationName = ""
|
|
|
+
|
|
|
+$(function() {
|
|
|
+ listenScroll('.mukuai')
|
|
|
+ dateChange()
|
|
|
+
|
|
|
+ $(".abnormalClear").click(function() {
|
|
|
+ // window.location.reload()
|
|
|
+ operationName = ""
|
|
|
+ setDatePicker($("#datepicker"), $("#datepicker2"), 1)
|
|
|
+ $(".operationName ").val("")
|
|
|
+ getTabData(1)
|
|
|
+ })
|
|
|
+ setDatePicker($("#datepicker"), $("#datepicker2"), 1)
|
|
|
+ getTabData(1) //条目缺陷
|
|
|
+})
|
|
|
+$('.operationName').on("input", function(e) {
|
|
|
+ let val = $(this).val().trim()
|
|
|
+ operationName = val
|
|
|
+})
|
|
|
+
|
|
|
+$(".menu .page", parent.document).removeClass("active")
|
|
|
+$(parent.document).find(".menu .page[code=YH-RZGL-CZRZ]").addClass("active")
|
|
|
+//所有数据切换日期筛选
|
|
|
+function dateChange() {
|
|
|
+ $(".monthYear .mon").click(function() {
|
|
|
+ $(this).css({
|
|
|
+ backgroundColor: '#00A1FF',
|
|
|
+ color: '#fff'
|
|
|
+ }).siblings().css({
|
|
|
+ color: '#00A1FF',
|
|
|
+ backgroundColor: '#fff'
|
|
|
+ })
|
|
|
+ setDatePicker($("#datepicker"), $("#datepicker2"), 1)
|
|
|
+ getTabData(1)
|
|
|
+ })
|
|
|
+ $(".monthYear .year").click(function() {
|
|
|
+ $(this).css({
|
|
|
+ backgroundColor: '#00A1FF',
|
|
|
+ color: '#fff'
|
|
|
+ }).siblings().css({
|
|
|
+ color: '#00A1FF',
|
|
|
+ backgroundColor: '#fff'
|
|
|
+ })
|
|
|
+ setDatePicker($("#datepicker"), $("#datepicker2"), 2)
|
|
|
+ getTabData(1)
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+//获取表格数据
|
|
|
+function getTabData(activePage) {
|
|
|
+ const dateStatrt = getPickerDate($("#datepicker"), 1)
|
|
|
+ const dateEnd = getPickerDate($("#datepicker2"), 2)
|
|
|
+ const start = new Date(dateStatrt).getTime()
|
|
|
+ const end = new Date(dateEnd).getTime()
|
|
|
+ if (start > end) {
|
|
|
+ $.alerModal({
|
|
|
+ "message": '开始时间不能大于结束时间~',
|
|
|
+ type: "tip",
|
|
|
+ time: '1000',
|
|
|
+ isFather: true,
|
|
|
+ fatherWrapper: $("#mainBox", parent.document)
|
|
|
+ });
|
|
|
+ return
|
|
|
+ }
|
|
|
+ const param = {
|
|
|
+ operationName: operationName,
|
|
|
+ "startDate": dateStatrt,
|
|
|
+ "endDate": dateEnd,
|
|
|
+ size: size,
|
|
|
+ current: activePage,
|
|
|
+ }
|
|
|
+ $('.pagination').html("")
|
|
|
+ $('.tbody').html(emptyBox('努力加载中...', '', 1))
|
|
|
+ post(api.operationLogPage, param).then(res => {
|
|
|
+ if (res.data.code == '0') {
|
|
|
+ const data = res.data.data.records
|
|
|
+ const totalPage = res.data.data.pages
|
|
|
+ const totalNum = res.data.data.total
|
|
|
+ renderTab(data, activePage)
|
|
|
+ if (totalPage > 1) {
|
|
|
+ renderPagination(totalPage, Number(activePage), totalNum)
|
|
|
+ } else {
|
|
|
+ $('.pagination').html("")
|
|
|
+ }
|
|
|
+
|
|
|
+ } else {
|
|
|
+ $('.tbody').html(emptyBox())
|
|
|
+ }
|
|
|
+ }).catch((e) => {
|
|
|
+
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+$(".filter").on("click", function(e) {
|
|
|
+ getTabData(1)
|
|
|
+})
|
|
|
+
|
|
|
+
|
|
|
+function renderTab(data, activePage) {
|
|
|
+ let str = ``;
|
|
|
+ for (let i = 0; i < data.length; i++) {
|
|
|
+ const item = data[i]
|
|
|
+ if (item.operationRecord.length > 50) {
|
|
|
+ str += `
|
|
|
+ <tr data-id=${item.id} data-index=${i}>
|
|
|
+ <td class="textCenter">${(activePage - 1) * 15 + i + 1}</td>
|
|
|
+ <td data-model="${item.operationName}">${item.operationName}</td>
|
|
|
+ <td class="operationDate">${item.operationDate}</td>
|
|
|
+ <td class="operationIp">${item.operationIp}</td>
|
|
|
+ <td class="operationRecord1" title="${item.operationRecord}">${item.operationRecord.slice(0,50)+"..."}</td>
|
|
|
+ </tr>
|
|
|
+ `
|
|
|
+ } else {
|
|
|
+ str += `
|
|
|
+ <tr data-id=${item.id} data-index=${i}>
|
|
|
+ <td class="textCenter">${(activePage - 1) * 15 + i + 1}</td>
|
|
|
+ <td data-model="${item.operationName}">${item.operationName}</td>
|
|
|
+ <td class="operationDate">${item.operationDate}</td>
|
|
|
+ <td class="operationIp">${item.operationIp}</td>
|
|
|
+ <td class="operationRecord">${item.operationRecord}</td>
|
|
|
+ </tr>
|
|
|
+ `
|
|
|
+ }
|
|
|
+ }
|
|
|
+ $('.tbody').html(str ? str : emptyBox())
|
|
|
+}
|
|
|
+
|
|
|
+//分页渲染
|
|
|
+function renderPagination(totalPage, activePage, totalNum) {
|
|
|
+ let str =
|
|
|
+ `<span class="totalSum">共${totalPage}页/${totalNum}条数据</span><span class="prePage"><img class="arrowPage" src=${arrowLeft} /></span>`
|
|
|
+ if (totalPage <= 6) {
|
|
|
+ for (let i = 1; i <= totalPage; i++) {
|
|
|
+ str += `<span class="pageNum ${'page'+i}" data-page=${i}>${i}</span>`
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ if (activePage <= 3) { //选中页数小于4
|
|
|
+ for (let i = 1; i <= 4; i++) {
|
|
|
+ str += `<span class="pageNum ${'page'+i}" data-page=${i}>${i}</span>`
|
|
|
+ }
|
|
|
+ str += `<span class="more" >...</span>`
|
|
|
+ str += `<span class="pageNum ${'page'+totalPage}" data-page=${totalPage}>${totalPage}</span>`
|
|
|
+
|
|
|
+ } else if (activePage > totalPage - 3) {
|
|
|
+ str += `<span class="pageNum page1" data-page=1>1</span>`
|
|
|
+ str += `<span class="more" >...</span>`
|
|
|
+ str += `<span class="pageNum ${'page'+(totalPage-3)}" data-page=${totalPage -3}>${totalPage -3}</span>`
|
|
|
+ str += `<span class="pageNum ${'page'+(totalPage-2)}" data-page=${totalPage -2}>${totalPage -2}</span>`
|
|
|
+ str += `<span class="pageNum ${'page'+(totalPage-1)}" data-page=${totalPage -1}>${totalPage -1}</span>`
|
|
|
+ str += `<span class="pageNum ${'page'+totalPage}" data-page=${totalPage}>${totalPage}</span>`
|
|
|
+ } else {
|
|
|
+ str += `<span class="pageNum page1" data-page=1>1</span>`
|
|
|
+ str += `<span class="more" >...</span>`
|
|
|
+ str += `<span class="pageNum ${'page'+(activePage -1)}" data-page=${activePage -1}>${activePage -1}</span>`
|
|
|
+ str += `<span class="pageNum ${'page'+activePage}" data-page=${activePage}>${activePage}</span>`
|
|
|
+ str += `<span class="pageNum ${'page'+(activePage +1)}" data-page=${activePage +1}>${activePage +1}</span>`
|
|
|
+ str += `<span class="more" >...</span>`
|
|
|
+ str += `<span class="pageNum ${'page'+totalPage}" data-page=${totalPage}>${totalPage}</span>`
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+ str += `<span class="nextPage"><img class="arrowPage" src=${arrowRight} /></span>`
|
|
|
+ $('.pagination').html(str)
|
|
|
+ $('.page' + activePage).addClass('activePage')
|
|
|
+ $(".pageNum").on("click", function(e) {
|
|
|
+ const activePageNow = Number($(this).attr('data-page'))
|
|
|
+ getTabData(activePageNow)
|
|
|
+ })
|
|
|
+ $(".prePage").on("click", function(e) {
|
|
|
+ let activePageNow = Number($(".activePage").attr('data-page'))
|
|
|
+ if (activePageNow > 1) {
|
|
|
+ activePageNow--
|
|
|
+ getTabData(activePageNow)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ $(".nextPage").on("click", function(e) {
|
|
|
+ let activePageNow = Number($(".activePage").attr('data-page'))
|
|
|
+ if (activePageNow < totalPage) {
|
|
|
+ activePageNow++
|
|
|
+ getTabData(activePageNow)
|
|
|
+ }
|
|
|
+ })
|
|
|
+
|
|
|
+}
|
|
|
+
|
|
|
+$(function() {
|
|
|
+ $('.datapickerBox').append(`<img class="iconCalen" src=${iconCalenGrey} />`)
|
|
|
+ $('.iconCalen').on("mouseenter", function(e) {
|
|
|
+ $(this).attr("src", iconCalenBlue)
|
|
|
+ })
|
|
|
+ $('.iconCalen').on("mouseleave", function(e) {
|
|
|
+ $(this).attr("src", iconCalenGrey)
|
|
|
+ })
|
|
|
+ $('.iconCalen').on("click", function(e) {
|
|
|
+ $(this).parent().find("input").focus()
|
|
|
+ })
|
|
|
+});
|
mfmf