拍照时间页面优化

master
fanluyan 2 years ago
parent 51b1fdeead
commit 5d4fc79767

@ -274,3 +274,37 @@
background-color: #f08200;
}
}
.el-table {
.el-table td.el-table__cell,
.el-table th.el-table__cell.is-leaf {
border-bottom: 1px solid #ebeef5;
}
.el-table__header-wrapper,
.el-table__fixed-header-wrapper {
border-top: 1px solid #ebeef5;
}
th.el-table__cell {
background: #f8f8f8;
}
.el-button--text {
padding: 0px;
}
.el-button + .el-button,
.el-checkbox.is-bordered + .el-checkbox.is-bordered {
margin-left: 16px;
}
.deleteText {
color: #f56c6c;
}
}
.el-table::before,
.el-table__fixed-right::before,
.el-table__fixed::before {
height: 0px !important;
}
.pageNation {
margin-top: 8px;
display: flex;
justify-content: flex-end;
}

@ -5,148 +5,27 @@
:visible.sync="deviceDialog"
width="420px"
>
<el-form
label-position="left"
label-width="92px"
ref="formdeviceInfo"
:rules="rules"
:model="deviceForm"
>
<el-form-item label="单位:" prop="bsManufacturer">
<el-input
v-model="deviceForm.bsManufacturer"
autocomplete="off"
></el-input>
</el-form-item>
<el-form-item label="DY等级" prop="dyLevel">
<el-input
v-model.number="deviceForm.dyLevel"
autocomplete="off"
></el-input>
</el-form-item>
<el-form-item label="线路名称:" prop="name">
<el-input v-model="deviceForm.name" autocomplete="off"></el-input>
</el-form-item>
</el-form>
<p>内容</p>
<div slot="footer" class="dialog-footer">
<el-button @click="closeDialog(0)"> </el-button>
<el-button @click="closeDialog()"> </el-button>
<el-button type="primary" @click="submitForm()"> </el-button>
</div>
</el-dialog>
</template>
<script>
//import { adddeviceJoggle, updatedeviceJoggle } from "@/utils/api/index";
export default {
props: {
deviceDialog: {
type: Boolean,
},
deviceDialogTitle: {
type: String,
default: "新增",
},
formItem: {
type: Object,
default: function () {
return {};
},
},
},
props: {},
data() {
return {
deviceForm: {},
rules: {
bsManufacturer: [
{ required: true, message: "请输入公司名称", trigger: "blur" },
],
dyLevel: [
{ required: true, message: "请选择DY等级", trigger: "blur" },
{ type: "number", message: "DY等级数字值" },
],
name: [
{
required: true,
message: "请输入线路名称",
trigger: "blur",
},
],
},
//
formArr: [],
};
return {};
},
methods: {
//
submitForm() {
this.$refs.formdeviceInfo.validate((valid) => {
if (valid) {
let formObj = {
bsManufacturer: this.deviceForm.bsManufacturer,
dyLevel: this.deviceForm.dyLevel,
name: this.deviceForm.name,
};
this.formArr.push(formObj);
console.log(this.formArr);
//
if (this.deviceDialogTitle == "新增") {
adddeviceJoggle({ list: this.formArr })
.then((res) => {
console.log(res);
this.$emit("deviceDialogClose", 1); //
this.$message.success("添加成功");
})
.catch((err) => {
console.log(err); //
this.$message.error("添加失败");
});
} else if (this.deviceDialogTitle == "修改") {
let changeformObj = {
bsManufacturer: this.deviceForm.bsManufacturer,
dyLevel: this.deviceForm.dyLevel,
name: this.deviceForm.name,
id: this.deviceForm.id,
};
updatedeviceJoggle(changeformObj)
.then((res) => {
console.log(res);
this.$emit("deviceDialogClose", 1); //
this.$message.success("修改成功");
})
.catch((err) => {
console.log(err); //
this.$message.error("修改失败");
});
}
} else {
console.log("error submit!!");
return false;
}
});
},
submitForm() {},
//
closeDialog(flag) {
this.$refs.formdeviceInfo.resetFields();
this.$emit("deviceDialogClose", flag);
},
},
mounted() {
console.log("打印传过来的对象", this.formItem);
console.log("打印传过来的对象", this.formItem.bsIdentifier);
this.deviceForm = JSON.parse(JSON.stringify(this.formItem));
},
watch: {
formItem: {
handler(newVal, oldVal) {
//
this.$nextTick(() => {
this.deviceForm = JSON.parse(JSON.stringify(this.formItem));
});
},
immediate: true,
deep: true,
},
closeDialog(flag) {},
},
mounted() {},
watch: {},
};
</script>

@ -1,116 +1,95 @@
<template>
<div class="deviceInformation">
<div class="deviceBtnGroup">
<el-button type="primary" @click="handleAdddevice()"></el-button>
<el-button type="primary" @click="handleResive()"></el-button>
<!-- <el-button type="primary">批量添加</el-button> -->
<el-button type="primary" @click="handleDelete()"></el-button>
<!-- <el-button type="primary">查询</el-button> -->
</div>
<!-- <div class="searchForm">
<el-form :indevice="true" :model="formIndevice" class="demo-form-indevice">
<el-form-item label="单位:">
<el-select v-model="formIndevice.region" placeholder="活动区域">
<el-option label="区域一" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
</el-select>
</el-form-item>
<el-form-item label="DY等级:">
<el-select v-model="formIndevice.region" placeholder="活动区域">
<el-option label="区域一" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
</el-select>
</el-form-item>
<el-form-item label="XL名称:">
<el-input v-model="formIndevice.user" placeholder="审批人"></el-input>
</el-form-item>
<el-form-item label="是否为采集">
<el-select v-model="formIndevice.region" placeholder="活动区域">
<el-option label="区域一" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
</el-select>
</el-form-item>
<el-form-item label="PMS编号:">
<el-input v-model="formIndevice.user" placeholder="审批人"></el-input>
</el-form-item>
</el-form>
</div> -->
<div class="deviceTable">
<el-table
ref="multipleTable"
:data="deviceTableData"
tooltip-effect="dark"
style="width: 100%"
height="calc(100% - 40px)"
border
@selection-change="handleSelectionChange"
@row-click="handleRowClick"
>
<el-table-column type="index" width="55"> </el-table-column>
<el-table-column type="selection" width="55"> </el-table-column>
<el-table-column label="单位" show-overflow-tooltip>
<template slot-scope="scope">{{ scope.row.name }}</template>
</el-table-column>
<el-table-column label="时间表类型" show-overflow-tooltip>
<template>时间表类型</template>
</el-table-column>
<el-table-column
prop="startTime"
label="开始时间"
show-overflow-tooltip
<div class="deviceBox">
<div class="deviceBtnGroup">
<el-button type="primary" icon="el-icon-plus" @click="handleAdddevice()"
>新增</el-button
>
</div>
<div class="deviceTable">
<el-table
ref="multipleTable"
:data="deviceTableData"
tooltip-effect="dark"
style="width: 100%"
height="calc(100% - 40px)"
@selection-change="handleSelectionChange"
@row-click="handleRowClick"
>
</el-table-column>
<el-table-column prop="endTime" label="结束时间" show-overflow-tooltip>
</el-table-column>
<el-table-column prop="span" label="间隔(分)" show-overflow-tooltip>
</el-table-column>
<el-table-column prop="remark" label="备注" show-overflow-tooltip>
</el-table-column>
<el-table-column fixed="right" label="操作" width="200">
<template slot-scope="scope">
<el-button @click="handleClick(scope.row)" type="text"
>修改</el-button
>
<el-button type="text">删除</el-button>
</template>
</el-table-column>
</el-table>
<!-- <el-table-column type="index" width="55"> </el-table-column>
<el-table-column type="selection" width="55"> </el-table-column> -->
<el-table-column label="单位" show-overflow-tooltip>
<template slot-scope="scope">{{ scope.row.name }}</template>
</el-table-column>
<el-table-column label="时间表类型" show-overflow-tooltip>
<template>时间表类型</template>
</el-table-column>
<el-table-column
prop="startTime"
label="开始时间"
show-overflow-tooltip
>
</el-table-column>
<el-table-column
prop="endTime"
label="结束时间"
show-overflow-tooltip
>
</el-table-column>
<el-table-column prop="span" label="间隔(分)" show-overflow-tooltip>
</el-table-column>
<el-table-column prop="remark" label="备注" show-overflow-tooltip>
</el-table-column>
<el-table-column fixed="right" label="操作" width="200">
<template slot-scope="scope">
<el-button
@click.native.stop="handleResive(scope.row)"
type="text"
>修改</el-button
>
<el-button
type="text"
class="deleteText"
@click.native.stop="handleDelete(scope.row)"
>删除</el-button
>
</template>
</el-table-column>
</el-table>
<div class="pageNation">
<el-pagination
@current-change="handleCurrentChange"
:current-page="page"
:page-size="pageSize"
layout=" prev, pager, next, jumper,total"
:total="total"
background
>
</el-pagination>
</div>
</div>
</div>
<!-- 新增线路 -->
<adddeviceDialog
:deviceDialog="deviceDialog"
:deviceDialogTitle="deviceDialogTitle"
:formItem="formdeviceInfo"
@deviceDialogClose="deviceDialogClose"
></adddeviceDialog>
</div>
</template>
<script>
import {
getScheduleRulelListJoggle,
// deletedeviceJoggle,
} from "@/utils/api/index";
import adddeviceDialog from "./components/adddeviceDialog.vue";
import { getScheduleRulelListJoggle } from "@/utils/api/index";
export default {
components: {
adddeviceDialog,
},
components: {},
data() {
return {
formIndevice: {
user: "",
region: "",
},
deviceDialogTitle: "", //
deviceDialog: false,
formdeviceInfo: {}, //
deviceTableData: [],
multipleSelection: [], //
//multipleSelection: [], //
//
deleteArr: [],
page: 1, //
pageSize: 20, //
total: 0, //
};
},
methods: {
@ -128,7 +107,6 @@ export default {
//
handleRowClick(row, column, event) {
this.$refs.multipleTable.toggleRowSelection(row);
// console.log(column, row, event);
},
//
handleSelectionChange(val) {
@ -142,68 +120,15 @@ export default {
},
//handleResive 线
handleResive() {
if (this.multipleSelection.length !== 1) {
this.$message({
showClose: true,
message: "请选择要操作的记录最多只能选择一条!",
type: "warning",
});
} else {
console.log(this.multipleSelection);
this.deviceDialogTitle = "修改";
this.formdeviceInfo = Object.assign({}, this.multipleSelection[0]);
this.deviceDialog = true;
}
},
//
deviceDialogClose(flag) {
if (flag) {
//
this.deviceList();
}
this.deviceDialog = false;
},
handleResive(data) {},
//
handleDelete() {
if (this.multipleSelection.length == 0) {
this.$message({
showClose: true,
message: "请选择要操作的记录!",
type: "warning",
});
} else {
console.log(this.multipleSelection);
for (let i in this.multipleSelection) {
console.log(i);
this.deleteArr.push({
id: this.multipleSelection[i].id,
});
}
console.log(this.deleteArr);
this.$confirm("确定要删除记录吗,同时删除关联关系?", "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
})
.then(() => {
//
deletedeviceJoggle({ list: this.deleteArr }).then((res) => {
console.log(res);
this.deviceList(); //
});
this.$message({
type: "success",
message: "删除成功!",
});
})
.catch(() => {
this.$message({
type: "info",
message: "已取消删除",
});
});
}
handleDelete() {},
//
handleCurrentChange(val) {
console.log(`当前页: ${val}`);
this.page = val;
//this.getTableList();
},
},
created() {
@ -214,19 +139,22 @@ export default {
<style lang="less">
.deviceInformation {
width: 100%;
height: 100%;
width: calc(100% - 16px);
height: calc(100% - 32px);
padding: 16px 8px;
background: @color-white;
.deviceBtnGroup {
padding: 16px 8px;
.deviceBox {
border: 1px solid #dddddd;
height: calc(100% - 32px);
padding: 16px;
border-radius: 4px;
}
.searchForm {
padding: 0px 8px;
.el-form {
.el-form-item {
margin-bottom: 0px;
}
}
.deviceBtnGroup {
display: flex;
justify-content: flex-end;
}
.deviceTable {
padding: 16px 8px 0 8px;
height: calc(100% - 80px);

@ -1,78 +1,79 @@
<template>
<div class="lineInformation">
<div class="lineBtnGroup">
<el-button type="primary" @click="handleAddLine()"></el-button>
<el-button type="primary" @click="handleResive()"></el-button>
<!-- <el-button type="primary">批量添加</el-button> -->
<el-button type="primary" @click="handleDelete()"></el-button>
<div class="lineBox">
<div class="lineBtnGroup">
<el-button type="primary" icon="el-icon-plus" @click="handleAddLine()"
>新增</el-button
>
<!-- <el-button type="primary">查询</el-button> -->
</div>
<!-- <div class="searchForm">
<el-form :inline="true" :model="formInline" class="demo-form-inline">
<el-form-item label="单位:">
<el-select v-model="formInline.region" placeholder="活动区域">
<el-option label="区域一" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
</el-select>
</el-form-item>
<el-form-item label="DY等级:">
<el-select v-model="formInline.region" placeholder="活动区域">
<el-option label="区域一" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
</el-select>
</el-form-item>
<el-form-item label="XL名称:">
<el-input v-model="formInline.user" placeholder="审批人"></el-input>
</el-form-item>
<el-form-item label="是否为采集">
<el-select v-model="formInline.region" placeholder="活动区域">
<el-option label="区域一" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
</el-select>
</el-form-item>
<el-form-item label="PMS编号:">
<el-input v-model="formInline.user" placeholder="审批人"></el-input>
</el-form-item>
</el-form>
</div> -->
<div class="lineTable">
<el-table
ref="multipleTable"
:data="lineTableData"
tooltip-effect="dark"
style="width: 100%"
height="calc(100% - 40px)"
border
@selection-change="handleSelectionChange"
@row-click="handleRowClick"
:header-cell-style="{ background: '#F5F7FA' }"
>
<el-table-column type="index" width="55"> </el-table-column>
<el-table-column type="selection" width="55"> </el-table-column>
<el-table-column label="单位" show-overflow-tooltip>
<template slot-scope="scope">{{ scope.row.bsManufacturer }}</template>
</el-table-column>
<el-table-column prop="id" label="线路id" show-overflow-tooltip>
</el-table-column>
<el-table-column
prop="name"
label="XL名称"
min-width="95"
show-overflow-tooltip
<!-- <el-button type="primary" @click="handleResive()"></el-button>
<el-button type="primary" @click="handleDelete()"></el-button> -->
</div>
<div class="lineTable">
<el-table
ref="multipleTable"
:data="lineTableData"
tooltip-effect="dark"
style="width: 100%"
height="calc(100% - 40px)"
@selection-change="handleSelectionChange"
@row-click="handleRowClick"
>
</el-table-column>
<el-table-column prop="dyLevel" label="DY等级" show-overflow-tooltip>
</el-table-column>
<el-table-column fixed="right" label="操作" width="200">
<template slot-scope="scope">
<el-button @click="handleClick(scope.row)" type="text"
>修改</el-button
>
<el-button type="text">删除</el-button>
</template>
</el-table-column>
</el-table>
<!-- <el-table-column type="selection" width="55"> </el-table-column> -->
<el-table-column label="单位" show-overflow-tooltip>
<template slot-scope="scope">{{
scope.row.bsManufacturer
}}</template>
</el-table-column>
<el-table-column
prop="id"
label="线路id"
show-overflow-tooltip
min-width="120"
>
</el-table-column>
<el-table-column
prop="name"
label="XL名称"
min-width="120"
show-overflow-tooltip
>
</el-table-column>
<el-table-column
prop="dyLevel"
label="DY等级"
show-overflow-tooltip
min-width="120"
>
</el-table-column>
<el-table-column fixed="right" label="操作" width="200">
<template slot-scope="scope">
<el-button
@click.native.stop="handleResive(scope.row)"
type="text"
>修改</el-button
>
<el-button
type="text"
class="deleteText"
@click.native.stop="handleDelete(scope.row)"
>删除</el-button
>
</template>
</el-table-column>
</el-table>
<div class="pageNation">
<el-pagination
@current-change="handleCurrentChange"
:current-page="page"
:page-size="pageSize"
layout=" prev, pager, next, jumper,total"
:total="total"
background
>
</el-pagination>
</div>
</div>
</div>
<!-- 新增线路 -->
<add-lineDialog
@ -93,17 +94,16 @@ export default {
},
data() {
return {
formInline: {
user: "",
region: "",
},
lineDialogTitle: "", //
lineDialog: false,
formLineInfo: {}, //
lineTableData: [],
multipleSelection: [], //
//multipleSelection: [], //
//
deleteArr: [],
page: 1, //
pageSize: 20, //
total: 0, //
};
},
methods: {
@ -135,19 +135,11 @@ export default {
},
//handleResive 线
handleResive() {
if (this.multipleSelection.length !== 1) {
this.$message({
showClose: true,
message: "请选择要操作的记录最多只能选择一条!",
type: "warning",
});
} else {
console.log(this.multipleSelection);
this.lineDialogTitle = "修改";
this.formLineInfo = Object.assign({}, this.multipleSelection[0]);
this.lineDialog = true;
}
handleResive(data) {
console.log(data);
this.lineDialogTitle = "修改";
this.formLineInfo = Object.assign({}, data);
this.lineDialog = true;
},
//
lineDialogClose(flag) {
@ -156,47 +148,43 @@ export default {
this.lineList();
}
this.lineDialog = false;
this.formLineInfo = {};
},
//
handleDelete() {
if (this.multipleSelection.length == 0) {
this.$message({
showClose: true,
message: "请选择要操作的记录!",
type: "warning",
});
} else {
console.log(this.multipleSelection);
for (let i in this.multipleSelection) {
console.log(i);
this.deleteArr.push({
id: this.multipleSelection[i].id,
handleDelete(data) {
console.log(data);
this.deleteArr.push({
id: data.id,
});
console.log(this.deleteArr);
this.$confirm("确定要删除记录吗,同时删除关联关系?", "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
})
.then(() => {
//
deleteLineJoggle({ list: this.deleteArr }).then((res) => {
console.log(res);
this.lineList(); //
});
this.$message({
type: "success",
message: "删除成功!",
});
}
console.log(this.deleteArr);
this.$confirm("确定要删除记录吗,同时删除关联关系?", "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
})
.then(() => {
//
deleteLineJoggle({ list: this.deleteArr }).then((res) => {
console.log(res);
this.lineList(); //
});
this.$message({
type: "success",
message: "删除成功!",
});
})
.catch(() => {
this.$message({
type: "info",
message: "已取消删除",
});
.catch(() => {
this.$message({
type: "info",
message: "已取消删除",
});
}
});
},
//
handleCurrentChange(val) {
console.log(`当前页: ${val}`);
this.page = val;
//this.getTableList();
},
},
created() {
@ -206,24 +194,24 @@ export default {
</script>
<style lang="less">
.lineInformation {
width: 100%;
height: 100%;
width: calc(100% - 16px);
height: calc(100% - 32px);
padding: 16px 8px;
background: @color-white;
.lineBtnGroup {
padding: 16px 8px;
.lineBox {
border: 1px solid #dddddd;
height: calc(100% - 32px);
padding: 16px;
border-radius: 4px;
}
.searchForm {
padding: 0px 8px;
.el-form {
.el-form-item {
margin-bottom: 0px;
}
}
.lineBtnGroup {
display: flex;
justify-content: flex-end;
}
.lineTable {
padding: 16px 8px 0 8px;
height: calc(100% - 80px);
//background: #fcc;
margin-top: 16px;
height: calc(100% - 48px);
}
}
</style>

Loading…
Cancel
Save