<template>
|
<basic-container>
|
<avue-crud v-show="!detailVisible" :option="option"
|
:table-loading="loading"
|
:data="data"
|
:page.sync="page"
|
:permission="permissionList"
|
:before-open="beforeOpen"
|
v-model="form"
|
ref="crud"
|
:upload-before="uploadBefore"
|
@row-update="rowUpdate"
|
@row-save="rowSave"
|
@row-del="rowDel"
|
@row-dblclick="rowClick"
|
@search-change="searchChange"
|
@search-reset="searchReset"
|
@selection-change="selectionChange"
|
@current-change="currentChange"
|
@size-change="sizeChange"
|
@refresh-change="refreshChange"
|
@on-load="onLoad">
|
<template slot="menuLeft">
|
<el-button type="danger"
|
size="small"
|
icon="el-icon-delete"
|
plain
|
v-if="permission.repairsorder_delete"
|
@click="handleDelete">删 除
|
</el-button>
|
</template>
|
<template slot-scope="{type,size,row,index}" slot="menu">
|
<el-button icon="el-icon-view" :size="size" :type="type" @click="rowClick(row)">查 看</el-button>
|
<el-button icon="el-icon-check" :size="size" :type="type" :disabled="!(row.state == 0)" @click="handleSendorder(row)">派 单</el-button>
|
<el-button icon="el-icon-edit" :size="size" :type="type" :disabled="row.state >= 1" @click="$refs.crud.rowEdit(row,index)">编 辑</el-button>
|
<el-button icon="el-icon-delete" :size="size" :type="type" :disabled="row.state >= 1" @click="$refs.crud.rowDel(row,index)">删 除</el-button>
|
</template>
|
</avue-crud>
|
|
<!-- 弹窗, 派单 -->
|
<sendorder v-if="sendorderVisible" ref="sendorder" @refreshOnLoad="refreshChange"></sendorder>
|
<repairsorder-detail v-if="detailVisible" ref="detailVisible" :detailInfo="detailInfo" @isDetail="isDetail"></repairsorder-detail>
|
</basic-container>
|
</template>
|
|
<script>
|
import {getList, add, update, remove} from "@/api/repairsorder/repairsorder";
|
import option from "@/const/repairsorder/repairsorder";
|
import {mapGetters} from "vuex";
|
import sendorder from "./sendorder.vue"
|
import RepairsorderDetail from "@/views/repairsorder/repairsorderDetail";
|
|
export default {
|
components: {
|
RepairsorderDetail,
|
sendorder
|
},
|
data() {
|
return {
|
form: {state:0},
|
query: {},
|
loading: true,
|
page: {
|
pageSize: 10,
|
currentPage: 1,
|
total: 0
|
},
|
selectionList: [],
|
option: option,
|
data: [],
|
sendorderVisible: false,
|
detailVisible:false,
|
detailInfo:{},
|
};
|
},
|
watch: {
|
//latitude longitude formattedAddress
|
"form.avueMapAddress":{
|
handler (newObj) {
|
if (newObj) {
|
this.form.location = newObj.formattedAddress
|
this.form.latitude = newObj.latitude
|
this.form.longitude = newObj.longitude
|
}
|
}
|
}
|
},
|
computed: {
|
...mapGetters(["permission"]),
|
permissionList() {
|
return {
|
addBtn: this.vaildData(this.permission.repairsorder_add, false),
|
viewBtn: this.vaildData(this.permission.repairsorder_view, false),
|
delBtn: this.vaildData(this.permission.repairsorder_delete, false),
|
editBtn: this.vaildData(this.permission.repairsorder_edit, false)
|
};
|
},
|
ids() {
|
let ids = [];
|
this.selectionList.forEach(ele => {
|
ids.push(ele.id);
|
});
|
return ids.join(",");
|
}
|
},
|
methods: {
|
rowSave(row, done, loading) {
|
if (!row.picUrls){
|
row.picUrls = null
|
}
|
add(row).then(() => {
|
this.onLoad(this.page);
|
this.$message({
|
type: "success",
|
message: "操作成功!"
|
});
|
done();
|
}, error => {
|
loading();
|
window.console.log(error);
|
});
|
},
|
rowUpdate(row, index, done, loading) {
|
update(row).then(() => {
|
this.onLoad(this.page);
|
this.$message({
|
type: "success",
|
message: "操作成功!"
|
});
|
done();
|
}, error => {
|
loading();
|
console.log(error);
|
});
|
},
|
rowDel(row) {
|
this.$confirm("确定将选择数据删除?", {
|
confirmButtonText: "确定",
|
cancelButtonText: "取消",
|
type: "warning"
|
})
|
.then(() => {
|
return remove(row.id);
|
})
|
.then(() => {
|
this.onLoad(this.page);
|
this.$message({
|
type: "success",
|
message: "操作成功!"
|
});
|
});
|
},
|
handleDelete() {
|
if (this.selectionList.length === 0) {
|
this.$message.warning("请选择至少一条数据");
|
return;
|
}
|
this.$confirm("确定将选择数据删除?", {
|
confirmButtonText: "确定",
|
cancelButtonText: "取消",
|
type: "warning"
|
})
|
.then(() => {
|
return remove(this.ids);
|
})
|
.then(() => {
|
this.onLoad(this.page);
|
this.$message({
|
type: "success",
|
message: "操作成功!"
|
});
|
this.$refs.crud.toggleSelection();
|
});
|
},
|
beforeOpen(done, type) {
|
if (["edit", "view"].includes(type)) {
|
this.form.avueMapAddress = {
|
"formattedAddress": this.form.location,
|
"longitude": this.form.longitude,
|
"latitude": this.form.latitude
|
}
|
}
|
done();
|
},
|
searchReset() {
|
this.query = {};
|
this.onLoad(this.page);
|
},
|
searchChange(params, done) {
|
this.query = params;
|
if (this.query.daterange){
|
this.query.startTime = this.query.daterange[0]
|
this.query.endTime = this.query.daterange[1]
|
this.query.daterange = null
|
}
|
this.page.currentPage = 1;
|
this.onLoad(this.page, params);
|
done();
|
},
|
selectionChange(list) {
|
this.selectionList = list;
|
},
|
selectionClear() {
|
this.selectionList = [];
|
this.$refs.crud.toggleSelection();
|
},
|
currentChange(currentPage){
|
this.page.currentPage = currentPage;
|
},
|
sizeChange(pageSize){
|
this.page.pageSize = pageSize;
|
},
|
refreshChange() {
|
this.onLoad(this.page, this.query);
|
},
|
onLoad(page, params = {}) {
|
this.loading = true;
|
getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
|
const data = res.data.data;
|
this.page.total = data.total;
|
this.data = data.records;
|
this.loading = false;
|
this.selectionClear();
|
});
|
},
|
uploadBefore(file, done, loading) {
|
if (["image","video"].includes(file.type.split("/")[0])){
|
done()
|
}else {
|
this.$message.warning('请上传图片或视频')
|
loading()
|
}
|
},
|
handleSendorder(row) {
|
this.sendorderVisible = true
|
this.$nextTick(() => {
|
this.$refs.sendorder.init(row)
|
})
|
},
|
//点击当前行事件
|
rowClick(val){
|
this.detailInfo = val
|
this.isDetail();
|
},
|
isDetail(){
|
this.detailVisible = !this.detailVisible
|
}
|
}
|
};
|
</script>
|
|
<style>
|
</style>
|
