master
刘翔宇-旅管家
4 years ago
parent
4780771d0d
commit
a71f3cf903
@ -1,17 +0,0 @@
|
||||
import request from '@/utils/request'
|
||||
|
||||
export function getCounts() {
|
||||
return request({
|
||||
url: '/api/admin/get-counts',
|
||||
method: 'get'
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
export function getChartsData(params) {
|
||||
return request({
|
||||
url: '/api/admin/get-charts-data',
|
||||
method: 'get',
|
||||
params: params
|
||||
})
|
||||
}
|
||||
@ -1,47 +0,0 @@
|
||||
import request from '@/utils/request'
|
||||
|
||||
|
||||
|
||||
export function listTool(params) {
|
||||
return request({
|
||||
url: '/api/admin/tool',
|
||||
method: 'get',
|
||||
params: params
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
export function save(data) {
|
||||
return request({
|
||||
url: '/api/admin/tool/save',
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
export function del(data) {
|
||||
return request({
|
||||
url: '/api/admin/tool/delete',
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
export function doimport(data) {
|
||||
return request({
|
||||
url: '/api/admin/tool/do-import',
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
|
||||
export function previewimport(params) {
|
||||
return request({
|
||||
url: '/api/admin/tool/preview-import',
|
||||
method: 'get',
|
||||
params: params
|
||||
})
|
||||
}
|
||||
@ -1,21 +0,0 @@
|
||||
import request from '@/utils/request'
|
||||
|
||||
|
||||
|
||||
export function listrecord(params) {
|
||||
return request({
|
||||
url: '/api/admin/record',
|
||||
method: 'get',
|
||||
params: params
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
|
||||
export function listClientTools(params) {
|
||||
return request({
|
||||
url: '/api/admin/record/get-client-tools/' + params.client_id,
|
||||
method: 'get',
|
||||
params: params
|
||||
})
|
||||
}
|
||||
@ -1,21 +0,0 @@
|
||||
import request from '@/utils/request'
|
||||
|
||||
|
||||
|
||||
export function listnoReturn(params) {
|
||||
return request({
|
||||
url: '/api/admin/exception/no-return',
|
||||
method: 'get',
|
||||
params: params
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
|
||||
export function listMaintain(params) {
|
||||
return request({
|
||||
url: '/api/admin/exception/maintain',
|
||||
method: 'get',
|
||||
params: params
|
||||
})
|
||||
}
|
||||
@ -1,77 +0,0 @@
|
||||
import request from '@/utils/request'
|
||||
|
||||
|
||||
//工具箱数据同步
|
||||
export function syncData(id) {
|
||||
return request({
|
||||
url: '/api/admin/client/sync-data/' + id,
|
||||
method: 'get'
|
||||
})
|
||||
}
|
||||
|
||||
//工具箱数据库结构比对
|
||||
export function checkStructure(id) {
|
||||
return request({
|
||||
url: '/api/admin/client/check-structure/' + id,
|
||||
method: 'get'
|
||||
})
|
||||
}
|
||||
|
||||
//工具箱数据库连接测试
|
||||
export function testConnection(id) {
|
||||
return request({
|
||||
url: '/api/admin/client/test-connection/' + id,
|
||||
method: 'get'
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
export function listToolbox(params) {
|
||||
return request({
|
||||
url: '/api/admin/client',
|
||||
method: 'get',
|
||||
params: params
|
||||
})
|
||||
}
|
||||
export function listToolboxtool(params, id) {
|
||||
return request({
|
||||
url: '/api/admin/client/get-tools/' + id,
|
||||
method: 'get',
|
||||
params: params
|
||||
})
|
||||
}
|
||||
|
||||
export function save(data) {
|
||||
return request({
|
||||
url: '/api/admin/client/save',
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
export function del(data) {
|
||||
return request({
|
||||
url: '/api/admin/client/delete',
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
export function doimport(data) {
|
||||
return request({
|
||||
url: '/api/admin/client/do-import',
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
|
||||
export function previewimport(params) {
|
||||
return request({
|
||||
url: '/api/admin/client/preview-import',
|
||||
method: 'get',
|
||||
params: params
|
||||
})
|
||||
}
|
||||
@ -1,21 +0,0 @@
|
||||
import request from '@/utils/request'
|
||||
|
||||
|
||||
|
||||
export function listclientTouch(params) {
|
||||
return request({
|
||||
url: '/api/admin/client-touch',
|
||||
method: 'get',
|
||||
params: params
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
|
||||
export function listTouchTypes(params) {
|
||||
return request({
|
||||
url: '/api/admin/client-touch/get-types',
|
||||
method: 'get',
|
||||
params: params
|
||||
})
|
||||
}
|
||||
@ -1,55 +0,0 @@
|
||||
import request from '@/utils/request'
|
||||
|
||||
|
||||
|
||||
export function listUser(params) {
|
||||
return request({
|
||||
url: '/api/admin/user',
|
||||
method: 'get',
|
||||
params: params
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
export function save(data) {
|
||||
return request({
|
||||
url: '/api/admin/user/save',
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
export function setPermission(data, id) {
|
||||
return request({
|
||||
url: '/api/admin/user/' + id + '/set-permissions',
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
export function doimport(data) {
|
||||
return request({
|
||||
url: '/api/admin/user/do-import',
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
export function del(data) {
|
||||
return request({
|
||||
url: '/api/admin/user/delete',
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
export function previewimport(params) {
|
||||
return request({
|
||||
url: '/api/admin/user/preview-import',
|
||||
method: 'get',
|
||||
params: params
|
||||
})
|
||||
}
|
||||
@ -1,205 +0,0 @@
|
||||
<template>
|
||||
<div class="container">
|
||||
<!-- 查询配置 -->
|
||||
<div style="padding: 0px 20px">
|
||||
<div ref="lxHeader">
|
||||
<LxHeader icon="md-apps" text="工具操作日志" style="margin-bottom: 10px; border: 0px; margin-top: 15px">
|
||||
<div slot="content">
|
||||
|
||||
</div>
|
||||
<slot>
|
||||
<div class="searchFields">
|
||||
<el-autocomplete class="inline-input" v-model="searchFields.client" :fetch-suggestions="querySearch"
|
||||
placeholder="所在工具箱" :trigger-on-focus="true" @select="handleSelectSClient" @blur="handleSelectSClient">
|
||||
</el-autocomplete>
|
||||
<Select v-model="searchFields.type" style="width:150px;margin-left:10px;" placeholder="操作类型">
|
||||
<Option v-for="item in options" :value="item" :key="item">{{ item }}</Option>
|
||||
</Select>
|
||||
<DatePicker type="datetimerange" v-model="searchFields.daterange" format="yyyy-MM-dd" placeholder="选择时间范围"
|
||||
style="width: 300px;margin-left:10px;" @on-ok="handleDaterange"></DatePicker>
|
||||
<Input style="width: 200px; margin-left: 10px" v-model.number="searchFields.Name" placeholder="关键词搜索" />
|
||||
<Button type="primary" @click="load" style="margin-left: 10px">查询</Button>
|
||||
<Button icon="md-cloud-download" style="margin-left: 10px" type="primary">导出</Button>
|
||||
</div>
|
||||
</slot>
|
||||
</LxHeader>
|
||||
</div>
|
||||
|
||||
<div ref="lxTable" class="table-tree">
|
||||
<el-table :data="tableData" class="v-table" :height="tableHeight" style="width: 100%">
|
||||
|
||||
<el-table-column type="index" width="50" align="center"></el-table-column>
|
||||
<el-table-column :prop="column.field" :align="column.align" v-for="(column,index) in columns"
|
||||
:label="column.title" :width="column.width">
|
||||
<template slot-scope="scope">
|
||||
<div v-if="column.type == 'img'">
|
||||
<img v-for="(file, vIndex) in getFilePath( scope.row[column.field], column)" :key="vIndex"
|
||||
@click="viewImg(scope.row, column, file.path)" class="table-img" :src="file.path" />
|
||||
</div>
|
||||
<div v-else-if="column.type=='format'">
|
||||
<div v-if="column.field=='client'">
|
||||
{{scope.row[column.field]?scope.row[column.field].name:""}}
|
||||
</div>
|
||||
</div>
|
||||
<div v-else>{{scope.row[column.field]}}</div>
|
||||
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<div class="pagination">
|
||||
<el-pagination @current-change="handleCurrentChange" :current-page="paginations.page"
|
||||
:page-size="paginations.page_size" background layout="prev, pager, next" :total="paginations.total">
|
||||
</el-pagination>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import {
|
||||
listToolbox
|
||||
} from "../../api/toolbox/list.js"
|
||||
import {
|
||||
listrecord,
|
||||
listClientTools
|
||||
} from "../../api/tool/log.js"
|
||||
import LxHeader from "@/components/LxHeader/index.vue";
|
||||
export default {
|
||||
components: {
|
||||
LxHeader
|
||||
},
|
||||
created() {
|
||||
this.initLoad();
|
||||
this.load();
|
||||
},
|
||||
mounted() {},
|
||||
data() {
|
||||
return {
|
||||
options: [],
|
||||
tableHeight: 0,
|
||||
//查询条件字段
|
||||
searchFields: {
|
||||
client_id: "",
|
||||
keyword: "",
|
||||
client: "",
|
||||
toolpn: "",
|
||||
date_range: "",
|
||||
daterange: ""
|
||||
},
|
||||
paginations: {
|
||||
page: 1,
|
||||
page_size: 15,
|
||||
total: 10
|
||||
},
|
||||
tableData: [],
|
||||
columns: [{
|
||||
field: "client",
|
||||
title: "工具箱",
|
||||
type: "format"
|
||||
},
|
||||
{
|
||||
field: "toolpn",
|
||||
title: "工具编号",
|
||||
type: "string",
|
||||
width: 120
|
||||
},
|
||||
{
|
||||
field: "toolname",
|
||||
title: "工具名称",
|
||||
type: "string",
|
||||
width: 200
|
||||
},
|
||||
{
|
||||
field: "tooltype",
|
||||
title: "工具型号",
|
||||
type: "string",
|
||||
width: 120
|
||||
},
|
||||
{
|
||||
field: "loginname",
|
||||
title: "操作人员",
|
||||
type: "string",
|
||||
width: 100,
|
||||
},
|
||||
{
|
||||
field: "createtime",
|
||||
title: "操作时间",
|
||||
type: "string",
|
||||
width: 180,
|
||||
algin: "center"
|
||||
},
|
||||
{
|
||||
field: "operationtype",
|
||||
title: "操作类型",
|
||||
type: "string",
|
||||
width: 120,
|
||||
algin: "center"
|
||||
}
|
||||
],
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
handleDaterange() {
|
||||
console.log(this.formatdate(this.searchFields.daterange[0]))
|
||||
this.searchFields.date_range = this.formatdate(this.searchFields.daterange[0]) + "~" + this.formatdate(this
|
||||
.searchFields.daterange[1]);
|
||||
},
|
||||
formatdate(date) {
|
||||
return this.$moment(date).format("YYYY-MM-DD")
|
||||
},
|
||||
initLoad() {
|
||||
var that = this;
|
||||
var clientHeight = document.documentElement.clientHeight
|
||||
var lxHeader_height = 96.5; //查询 头部
|
||||
var paginationHeight = 37; //分页的高度
|
||||
var topHeight = 50; //页面 头部
|
||||
let tableHeight = clientHeight - lxHeader_height - topHeight - paginationHeight;
|
||||
that.tableHeight = tableHeight;
|
||||
},
|
||||
load() {
|
||||
listrecord({
|
||||
page: this.paginations.page,
|
||||
page_size: this.paginations.pageSize,
|
||||
client_id: this.searchFields.client_id,
|
||||
type: this.searchFields.type,
|
||||
date_range: this.searchFields.date_range,
|
||||
}).then(res => {
|
||||
var data = res.data;
|
||||
this.tableData = data;
|
||||
this.paginations.total = res.total;
|
||||
}).catch(error => {
|
||||
//reject(error)
|
||||
})
|
||||
},
|
||||
loadClientTools() {
|
||||
listClientTools({
|
||||
client_id: this.searchFields.client_id
|
||||
}).then(res => {
|
||||
this.options = res;
|
||||
}).catch(error => {
|
||||
//reject(error)
|
||||
})
|
||||
},
|
||||
querySearch(queryString, cb) {
|
||||
listToolbox().then(response => {
|
||||
var data = response.data;
|
||||
for (var m of data) {
|
||||
m.value = m.name;
|
||||
}
|
||||
cb(data)
|
||||
}).catch(error => {
|
||||
//reject(error)
|
||||
})
|
||||
},
|
||||
handleCurrentChange(page) {
|
||||
this.paginations.page = page;
|
||||
this.load();
|
||||
},
|
||||
handleSelectSClient(item) {
|
||||
this.searchFields.client_id = item.id;
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
@ -1,227 +0,0 @@
|
||||
<template>
|
||||
<div class="container">
|
||||
<!-- 查询配置 -->
|
||||
<div style="padding: 0px 20px">
|
||||
<div ref="lxHeader">
|
||||
<LxHeader icon="md-apps" text="工具箱异常管理" style="margin-bottom: 10px; border: 0px; margin-top: 15px">
|
||||
<div slot="content">
|
||||
|
||||
</div>
|
||||
<slot>
|
||||
<el-tabs v-model="activeName" @tab-click="handleClick">
|
||||
<el-tab-pane label="超时未归还异常" name="first"></el-tab-pane>
|
||||
<el-tab-pane label="过期未校准异常" name="second"></el-tab-pane>
|
||||
</el-tabs>
|
||||
|
||||
<div class="searchFields">
|
||||
|
||||
<el-autocomplete class="inline-input" v-model="searchFields.client" :fetch-suggestions="querySearch"
|
||||
placeholder="所在工具箱" :trigger-on-focus="true" @select="handleSelectSClient" @blur="handleSelectSClient">
|
||||
</el-autocomplete>
|
||||
<Select v-model="searchFields.tool_id" style="width:150px;margin-left: 10px" placeholder="请先选择工具">
|
||||
|
||||
</Select>
|
||||
<DatePicker type="datetimerange" v-model="searchFields.daterange" placeholder="选择时间范围"
|
||||
style="width: 300px;margin-left:10px;"></DatePicker>
|
||||
<Input style="width: 200px; margin-left: 10px" v-model.number="searchFields.Name" placeholder="关键词搜索" />
|
||||
<Button type="primary" @click="load" style="margin-left: 10px">查询</Button>
|
||||
<Button icon="md-cloud-download" style="margin-left: 10px" type="primary">导出</Button>
|
||||
</div>
|
||||
</slot>
|
||||
</LxHeader>
|
||||
</div>
|
||||
<div ref="lxTable" class="table-tree">
|
||||
<el-table :data="tableData" class="v-table" :height="tableHeight" style="width: 100%">
|
||||
<el-table-column type="index" width="50" align="center"></el-table-column>
|
||||
<el-table-column :prop="column.field" :align="column.align" v-for="(column,index) in columns"
|
||||
:label="column.title" :width="column.width">
|
||||
<template slot-scope="scope">
|
||||
<div v-if="column.type == 'img'">
|
||||
<img v-for="(file, vIndex) in getFilePath( scope.row[column.field], column)" :key="vIndex"
|
||||
@click="viewImg(scope.row, column, file.path)" class="table-img" :src="file.path" />
|
||||
</div>
|
||||
<div v-else-if="column.type=='format'">
|
||||
|
||||
<div v-if="column.field=='client'">
|
||||
{{scope.row[column.field]?scope.row[column.field].name:""}}
|
||||
</div>
|
||||
<div v-else-if="column.field=='toolpn'||column.field=='toolname'||column.field=='tooltype'">
|
||||
{{scope.row.tool[0]?scope.row.tool[0][column.field]:""}}
|
||||
</div>
|
||||
</div>
|
||||
<div v-else>{{scope.row[column.field]}}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<div class="pagination">
|
||||
<el-pagination @current-change="handleCurrentChange" :current-page="paginations.page"
|
||||
:page-size="paginations.page_size" background layout="prev, pager, next" :total="paginations.total">
|
||||
</el-pagination>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import LxHeader from "@/components/LxHeader/index.vue";
|
||||
import {
|
||||
listMaintain,
|
||||
listnoReturn
|
||||
} from "../../api/toolbox/exception.js"
|
||||
|
||||
import {
|
||||
listToolbox
|
||||
} from "../../api/toolbox/list.js"
|
||||
export default {
|
||||
components: {
|
||||
LxHeader
|
||||
},
|
||||
created() {
|
||||
this.initLoad();
|
||||
this.load();
|
||||
},
|
||||
mounted() {},
|
||||
data() {
|
||||
return {
|
||||
activeName: "first",
|
||||
tableHeight: 0,
|
||||
//查询条件字段
|
||||
searchFields: {
|
||||
keyword: "",
|
||||
client: "",
|
||||
client_id: "",
|
||||
tool_id: "",
|
||||
date_range: "",
|
||||
daterange: null
|
||||
},
|
||||
paginations: {
|
||||
page: 1,
|
||||
page_size: 15,
|
||||
total: 10
|
||||
},
|
||||
tableData: [],
|
||||
columns: [{
|
||||
field: "client",
|
||||
title: "工具箱",
|
||||
type: "format"
|
||||
},
|
||||
{
|
||||
field: "toolpn",
|
||||
title: "工具编号",
|
||||
type: "format",
|
||||
width: 120
|
||||
},
|
||||
{
|
||||
field: "toolname",
|
||||
title: "工具名称",
|
||||
type: "format",
|
||||
width: 100
|
||||
},
|
||||
{
|
||||
field: "tooltype",
|
||||
title: "工具型号",
|
||||
type: "format",
|
||||
width: 120
|
||||
},
|
||||
{
|
||||
field: "TransactionType",
|
||||
title: "责任人",
|
||||
type: "int",
|
||||
width: 80
|
||||
},
|
||||
{
|
||||
field: "TransactionType",
|
||||
title: "校准截止时间",
|
||||
type: "int",
|
||||
width: 180
|
||||
},
|
||||
{
|
||||
field: "TransactionType",
|
||||
title: "短信通知",
|
||||
type: "int",
|
||||
width: 80
|
||||
},
|
||||
{
|
||||
field: "TransactionType",
|
||||
title: "微信通知",
|
||||
type: "int",
|
||||
width: 80
|
||||
},
|
||||
],
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
load() {
|
||||
if (this.activeName == "first") {
|
||||
this.loadMaintain();
|
||||
} else {
|
||||
this.loadnoReturn();
|
||||
}
|
||||
},
|
||||
handleClick(v) {
|
||||
this.load();
|
||||
},
|
||||
handleCurrentChange(page) {
|
||||
this.paginations.page = page;
|
||||
if (this.activeName == "first") {
|
||||
this.loadMaintain();
|
||||
} else {
|
||||
this.loadnoReturn();
|
||||
}
|
||||
},
|
||||
querySearch(queryString, cb) {
|
||||
listToolbox().then(response => {
|
||||
var data = response.data;
|
||||
for (var m of data) {
|
||||
m.value = m.name;
|
||||
}
|
||||
cb(data)
|
||||
}).catch(error => {
|
||||
//reject(error)
|
||||
})
|
||||
},
|
||||
handleSelectSClient(item) {
|
||||
this.searchFields.client_id = item.id;
|
||||
},
|
||||
initLoad() {
|
||||
var that = this;
|
||||
var clientHeight = document.documentElement.clientHeight
|
||||
var lxHeader_height = 96.5; //查询 头部
|
||||
var paginationHeight = 37; //分页的高度
|
||||
var topHeight = 50; //页面 头部
|
||||
let tableHeight = clientHeight - lxHeader_height - topHeight - paginationHeight - 61;
|
||||
that.tableHeight = tableHeight;
|
||||
},
|
||||
loadMaintain() {
|
||||
listMaintain({
|
||||
client_id: this.searchFields.client_id,
|
||||
tool_id: this.searchFields.tool_id,
|
||||
page: this.paginations.page,
|
||||
page_size: this.paginations.page_size,
|
||||
keyword: this.searchFields.keyword,
|
||||
date_range: this.searchFields.date_range
|
||||
}).then((res) => {
|
||||
this.tableData = res.data;
|
||||
this.paginations.total = res.total;
|
||||
}).catch((error) => {
|
||||
|
||||
})
|
||||
},
|
||||
loadnoReturn() {
|
||||
listnoReturn({
|
||||
client_id: this.searchFields.client_id,
|
||||
tool_id: this.searchFields.tool_id,
|
||||
page: this.paginations.page,
|
||||
page_size: this.paginations.page_size,
|
||||
keyword: this.searchFields.keyword,
|
||||
date_range: this.searchFields.date_range
|
||||
}).then((res) => {
|
||||
this.tableData = res.data;
|
||||
this.paginations.total = res.total;
|
||||
}).catch((error) => {
|
||||
|
||||
})
|
||||
}
|
||||
},
|
||||
};
|
||||
</script>
|
||||
@ -1,189 +0,0 @@
|
||||
<template>
|
||||
<div class="container">
|
||||
<!-- 查询配置 -->
|
||||
<div style="padding: 0px 20px">
|
||||
<div ref="lxHeader">
|
||||
<LxHeader icon="md-apps" text="工具箱操作日志" style="margin-bottom: 10px; border: 0px; margin-top: 15px">
|
||||
<div slot="content">
|
||||
|
||||
</div>
|
||||
<slot>
|
||||
<div class="searchFields">
|
||||
<el-autocomplete class="inline-input" v-model="searchFields.client" :fetch-suggestions="querySearch"
|
||||
placeholder="所在工具箱" :trigger-on-focus="true" @select="handleSelectSClient" @blur="handleSelectSClient">
|
||||
</el-autocomplete>
|
||||
<Select v-model="searchFields.type" style="width:150px;margin-left:10px;" placeholder="操作类型">
|
||||
<Option v-for="item in options" :value="item" :key="item">{{ item }}</Option>
|
||||
</Select>
|
||||
<DatePicker type="datetimerange" v-model="searchFields.daterange" format="yyyy-MM-dd" placeholder="选择时间范围"
|
||||
style="width: 300px;margin-left:10px;" @on-ok="handleDaterange"></DatePicker>
|
||||
<Input style="width: 200px; margin-left: 10px" v-model.number="searchFields.Name" placeholder="关键词搜索" />
|
||||
<Button type="primary" @click="load" style="margin-left: 10px">查询</Button>
|
||||
<Button icon="md-cloud-download" style="margin-left: 10px" type="primary">导出</Button>
|
||||
</div>
|
||||
</slot>
|
||||
</LxHeader>
|
||||
</div>
|
||||
|
||||
<div ref="lxTable" class="table-tree">
|
||||
<el-table :data="tableData" class="v-table" :height="tableHeight" style="width: 100%">
|
||||
|
||||
<el-table-column type="index" width="50" align="center"></el-table-column>
|
||||
<el-table-column :prop="column.field" :align="column.align" v-for="(column,index) in columns"
|
||||
:label="column.title" :width="column.width">
|
||||
<template slot-scope="scope">
|
||||
<div v-if="column.type == 'img'">
|
||||
<img v-for="(file, vIndex) in getFilePath( scope.row[column.field], column)" :key="vIndex"
|
||||
@click="viewImg(scope.row, column, file.path)" class="table-img" :src="file.path" />
|
||||
</div>
|
||||
<div v-else-if="column.type=='format'">
|
||||
|
||||
<div v-if="column.field=='client'">
|
||||
{{scope.row[column.field]?scope.row[column.field].name:""}}
|
||||
</div>
|
||||
</div>
|
||||
<div v-else>{{scope.row[column.field]}}</div>
|
||||
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<div class="pagination">
|
||||
<el-pagination @current-change="handleCurrentChange" :current-page="paginations.page"
|
||||
:page-size="paginations.page_size" background layout="prev, pager, next" :total="paginations.total">
|
||||
</el-pagination>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import {
|
||||
listToolbox
|
||||
} from "../../api/toolbox/list.js"
|
||||
import {
|
||||
listTouchTypes,
|
||||
listclientTouch
|
||||
} from "../../api/toolbox/log.js"
|
||||
import LxHeader from "@/components/LxHeader/index.vue";
|
||||
export default {
|
||||
components: {
|
||||
LxHeader
|
||||
},
|
||||
created() {
|
||||
this.initLoad();
|
||||
this.load();
|
||||
this.loadTouchTypes();
|
||||
},
|
||||
mounted() {},
|
||||
data() {
|
||||
return {
|
||||
options: [],
|
||||
tableHeight: 0,
|
||||
//查询条件字段
|
||||
searchFields: {
|
||||
client_id: "",
|
||||
keyword: "",
|
||||
client: "",
|
||||
type: "",
|
||||
date_range: "",
|
||||
daterange: ""
|
||||
},
|
||||
paginations: {
|
||||
page: 1,
|
||||
page_size: 15,
|
||||
total: 10
|
||||
},
|
||||
tableData: [],
|
||||
columns: [{
|
||||
field: "client",
|
||||
title: "工具箱",
|
||||
type: "format"
|
||||
},
|
||||
{
|
||||
field: "ip",
|
||||
title: "IP",
|
||||
type: "string",
|
||||
width: 90,
|
||||
require: true
|
||||
},
|
||||
{
|
||||
field: "PhoneNo",
|
||||
title: "操作时间",
|
||||
type: "string",
|
||||
link: true,
|
||||
width: 100,
|
||||
require: true,
|
||||
},
|
||||
{
|
||||
field: "Quantity",
|
||||
title: "操作类型",
|
||||
type: "int",
|
||||
width: 80,
|
||||
require: true,
|
||||
}
|
||||
],
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
handleDaterange() {
|
||||
console.log(this.formatdate(this.searchFields.daterange[0]))
|
||||
this.searchFields.date_range = this.formatdate(this.searchFields.daterange[0]) + "~" + this.formatdate(this
|
||||
.searchFields.daterange[1]);
|
||||
},
|
||||
formatdate(date) {
|
||||
return this.$moment(date).format("YYYY-MM-DD")
|
||||
},
|
||||
initLoad() {
|
||||
var that = this;
|
||||
var clientHeight = document.documentElement.clientHeight
|
||||
var lxHeader_height = 96.5; //查询 头部
|
||||
var paginationHeight = 37; //分页的高度
|
||||
var topHeight = 50; //页面 头部
|
||||
let tableHeight = clientHeight - lxHeader_height - topHeight - paginationHeight;
|
||||
that.tableHeight = tableHeight;
|
||||
},
|
||||
load() {
|
||||
listclientTouch({
|
||||
page: this.paginations.page,
|
||||
page_size: this.paginations.pageSize,
|
||||
client_id: this.searchFields.client_id,
|
||||
type: this.searchFields.type,
|
||||
date_range: this.searchFields.date_range,
|
||||
}).then(res => {
|
||||
var data = res.data;
|
||||
this.tableData = data;
|
||||
this.paginations.total = res.total;
|
||||
}).catch(error => {
|
||||
//reject(error)
|
||||
})
|
||||
},
|
||||
loadTouchTypes() {
|
||||
listTouchTypes().then(res => {
|
||||
this.options = res;
|
||||
}).catch(error => {
|
||||
//reject(error)
|
||||
})
|
||||
},
|
||||
querySearch(queryString, cb) {
|
||||
listToolbox().then(response => {
|
||||
var data = response.data;
|
||||
for (var m of data) {
|
||||
m.value = m.name;
|
||||
}
|
||||
cb(data)
|
||||
}).catch(error => {
|
||||
//reject(error)
|
||||
})
|
||||
},
|
||||
handleCurrentChange(page) {
|
||||
this.paginations.page = page;
|
||||
this.load();
|
||||
},
|
||||
handleSelectSClient(item) {
|
||||
this.searchFields.client_id = item.id;
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
@ -1,260 +0,0 @@
|
||||
<template>
|
||||
<div class="container">
|
||||
<!-- 查询配置 -->
|
||||
<div style="padding: 0px 20px">
|
||||
<div ref="lxHeader">
|
||||
<LxHeader icon="md-apps" text="工具信息看板" style="margin-bottom: 10px; border: 0px; margin-top: 15px">
|
||||
<div slot="content">
|
||||
|
||||
</div>
|
||||
</LxHeader>
|
||||
</div>
|
||||
|
||||
|
||||
<div ref="toolbox">
|
||||
<Card style="margin-bottom: 20px;">
|
||||
<div style="overflow: auto;">
|
||||
<el-scrollbar style="flex: 1">
|
||||
<div style="display: flex;">
|
||||
<div style="flex:0 0 auto;padding: 10px; margin: 2px 10px;" v-for="(item,index) in toolBoxList"
|
||||
@click="tabChange(index)">
|
||||
<el-badge class="item">
|
||||
<div style="width: 60px;height: 60px;display: flex;align-items: center;">
|
||||
<img :src="item.icon_on" v-if="item.active" style="width: 60px;height: 60px;" />
|
||||
<img :src="item.icon" v-else style="width: 50px;height: 50px;" />
|
||||
</div>
|
||||
</el-badge>
|
||||
<div style="text-align: center;">{{item.name}}</div>
|
||||
<div style="text-align: center;">
|
||||
{{item.layer_amount+"*"+(item.layer_tool_amount?0:item.layer_tool_amount)}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-scrollbar>
|
||||
</div>
|
||||
</Card>
|
||||
|
||||
<Card>
|
||||
<p slot="title" style="text-align: center;">{{currentName}}</p>
|
||||
<div style="overflow: auto;" :style="{height:height+'px'}">
|
||||
<el-scrollbar style="flex: 1">
|
||||
<div v-for="(item,index) in toolList" style="display: flex;align-items: center;margin-bottom: 20px;">
|
||||
<div class="div_layer_no" style="flex:0 0 auto">{{index+1}}</div>
|
||||
<div class="div_layer">
|
||||
<el-scrollbar>
|
||||
<div class="div_layer_box">
|
||||
<div v-for="(citem,cindex) in item.tools">
|
||||
<div class="div_box" v-if="citem!='undefined'&&citem!=undefined" style="position: relative;">
|
||||
|
||||
<div class="div_box_img">
|
||||
<img :src="citem.icon" @click="viewImg(citem.icon)" style="width: 120px;height: 100px;" />
|
||||
</div>
|
||||
<div class="div_box_name">
|
||||
{{citem.name}}
|
||||
</div>
|
||||
<div :class="[citem.status?'triangle-topright-green':'triangle-topright-red']"
|
||||
style="position: absolute;right: 0;top: 0;">
|
||||
|
||||
</div>
|
||||
<span class="triangle-topright-txt">在</span>
|
||||
</div>
|
||||
<div class="div_box"
|
||||
style="width: 132px;height: 115.5px;border:1px solid #122583;position: relative;"
|
||||
v-else-if="cindex!=0">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</el-scrollbar>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</el-scrollbar>
|
||||
</div>
|
||||
|
||||
</Card>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import LxHeader from "@/components/LxHeader/index.vue";
|
||||
import {
|
||||
listToolbox,
|
||||
listToolboxtool
|
||||
} from "../../api/toolbox/list.js"
|
||||
|
||||
export default {
|
||||
components: {
|
||||
LxHeader
|
||||
},
|
||||
created() {
|
||||
this.initLoad();
|
||||
this.loadbox();
|
||||
},
|
||||
mounted() {
|
||||
var w = this.$refs.toolbox.offsetWidth - 32;
|
||||
var sw = 100;
|
||||
//this.pagination.page_size = parseInt(w / sw);
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
toolList: [],
|
||||
toolBoxList: [],
|
||||
toolBoxCurrent: 0,
|
||||
height: 0,
|
||||
pagination: {
|
||||
page: 1,
|
||||
page_size: 9999,
|
||||
total: 0
|
||||
},
|
||||
currentName: ""
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
loadbox() {
|
||||
listToolbox({
|
||||
page: this.pagination.page,
|
||||
page_size: this.pagination.page_size
|
||||
}).then(res => {
|
||||
var i = 0;
|
||||
for (var mod of res.data) {
|
||||
mod.icon = require("@/assets/toolbox.png");
|
||||
mod.icon_on = require("@/assets/toolbox_on.png");
|
||||
|
||||
mod.active = i == 0;
|
||||
i++;
|
||||
}
|
||||
this.toolBoxList = res.data;
|
||||
this.pagination.total = res.total;
|
||||
this.loadboxtool(this.toolBoxList[this.toolBoxCurrent].id)
|
||||
}).catch(error => {
|
||||
|
||||
})
|
||||
},
|
||||
viewImg(url) {
|
||||
this.base.previewImg(url);
|
||||
},
|
||||
loadboxtool(id) {
|
||||
var currentBox = this.toolBoxList[this.toolBoxCurrent];
|
||||
let layers = currentBox.layers;
|
||||
this.currentName = currentBox.name + currentBox.layers.length + '层 每层' + currentBox.layer_tool_amount
|
||||
listToolboxtool({
|
||||
page: 1,
|
||||
page_size: 100
|
||||
}, id).then(res => {
|
||||
for (var layer of layers) {
|
||||
layer.tools = new Array(currentBox.layer_tool_amount + 1);
|
||||
for (var i = 1; i <= currentBox.layer_tool_amount; i++) {
|
||||
var mod = res.data.filter((item, index) => {
|
||||
return item.position == i && item.layerid == layer.id
|
||||
});
|
||||
if (mod.length != 0) {
|
||||
mod[0].icon = (mod[0].toolimage.indexOf("base64,") == -1 ? "data:image/png;base64," : "") +
|
||||
mod[0].toolimage;
|
||||
layer.tools[i] = mod[0];
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
this.toolList = layers;
|
||||
}).catch(error => {
|
||||
|
||||
})
|
||||
},
|
||||
tabChange(index) {
|
||||
for (var mod of this.toolBoxList) {
|
||||
mod.active = false;
|
||||
}
|
||||
this.toolBoxList[index].active = true;
|
||||
let id = this.toolBoxList[index].id;
|
||||
this.toolBoxCurrent = index;
|
||||
this.loadboxtool(id);
|
||||
},
|
||||
initLoad() {
|
||||
var that = this;
|
||||
var clientHeight = document.documentElement.clientHeight
|
||||
var lxHeader_height = 240; //查询 头部
|
||||
var card_Height = 109; //分页的高度
|
||||
var topHeight = 50; //页面 头部
|
||||
let height = clientHeight - lxHeader_height - topHeight - card_Height;
|
||||
|
||||
that.height = height;
|
||||
}
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style scoped="scoped">
|
||||
.recommendPage .swiper-container {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 200px;
|
||||
background: pink;
|
||||
}
|
||||
|
||||
.recommendPage .swiper-container .swiper-slide {
|
||||
width: 100%;
|
||||
line-height: 200px;
|
||||
background: yellowgreen;
|
||||
color: #000;
|
||||
font-size: 16px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 轮播图 */
|
||||
|
||||
.div_layer {
|
||||
overflow-x: auto;
|
||||
overflow-y: hidden;
|
||||
}
|
||||
|
||||
.div_layer_box {
|
||||
display: inline-flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.div_box {
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.div_box_img {
|
||||
padding: 4px 5px;
|
||||
border: 1px solid #263445;
|
||||
}
|
||||
|
||||
.div_layer_no {
|
||||
border: #000000 2px solid;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
border-radius: 40px;
|
||||
line-height: 40px;
|
||||
text-align: center;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.triangle-topright-red {
|
||||
width: 0;
|
||||
height: 0;
|
||||
border-top: 30px solid #ff4949;
|
||||
border-left: 30px solid transparent;
|
||||
color: #13ce66;
|
||||
}
|
||||
|
||||
.triangle-topright-green {
|
||||
width: 0;
|
||||
height: 0;
|
||||
border-top: 30px solid #13ce66;
|
||||
border-left: 30px solid transparent;
|
||||
color: #13ce66;
|
||||
}
|
||||
|
||||
.triangle-topright-txt {
|
||||
position: absolute;
|
||||
font-size: 10px;
|
||||
right: 1px;
|
||||
top: 1px;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in new issue