| | |
| | | |
| | | // 获取所有车辆信息 |
| | | export const getAll = (params) => { |
| | | return getRequest('/car/getAll', params) |
| | | return getRequest('/car/getAllCar', params) |
| | | } |
| | | |
| | | // 分页获取加油信息 |
| | |
| | | // 查询片区信息 |
| | | export const getSuggest = (params) => { |
| | | return getRequest('/suggest/getByPage', params) |
| | | } |
| | | } |
| | | |
| | | // 删除接货人信息 |
| | | export const deleteSuggest = (params) => { |
| | | return postRequest('/suggest/delByIds', params) |
| | | } |
| | | |
| | | // 查询接货人信息 |
| | | export const getCar = (params) => { |
| | | return getRequest('/car/getAll', params) |
| | | } |
| | | |
| | | // 导出excel |
| | | export const getOilExcel = (params) => { |
| | | return getRequest('/addOil/getExcel', params) |
| | | } |
| | | |
| | | // 根据车辆ID查询加油记录 |
| | | export const getByDate = (params) => { |
| | | return getRequest('/addOil/getByDate', params) |
| | | } |
| | |
| | | <Card> |
| | | <Row class="operation"> |
| | | <Button @click="addOil" type="primary" icon="md-add">添加事故记录</Button> |
| | | <Button @click="delAll" icon="md-trash">批量删除</Button> |
| | | <Button @click="init" icon="md-refresh">刷新</Button> |
| | | <Button type="dashed" @click="openTip = !openTip">{{ |
| | | openTip ? "关闭提示" : "开启提示" |
| | |
| | | <Card> |
| | | <Row class="operation"> |
| | | <Button @click="addOil" type="primary" icon="md-add">添加加油记录</Button> |
| | | <Button @click="delAll" icon="md-trash">批量删除</Button> |
| | | <Button @click="init" icon="md-refresh">刷新</Button> |
| | | <Button type="dashed" @click="openTip = !openTip">{{ |
| | | openTip ? "关闭提示" : "开启提示" |
| | |
| | | :label-width="80" |
| | | :rules="addOilFormValidate" |
| | | > |
| | | <FormItem label="车辆" prop="carId"> |
| | | <Select v-model="addOilForm.carId" filterable> |
| | | <Option v-for="item in carList" :value="item.id">{{ item.carNo }}</Option> |
| | | </Select> |
| | | </FormItem> |
| | | <Form-item label="加油日期" prop="addDate"> |
| | | <Row> |
| | | <Col span="11"> |
| | | <Row :gutter="0"> |
| | | <Col span="12"> |
| | | <FormItem label="车辆" prop="carId"> |
| | | <Select v-model="addOilForm.carId" filterable> |
| | | <Option v-for="item in carList" :value="item.id">{{ item.carNo }}</Option> |
| | | </Select> |
| | | </FormItem> |
| | | </Col> |
| | | <Col span="12"> |
| | | <Form-item label="加油日期" prop="addDate"> |
| | | <Date-picker @on-change="change1" type="date" value="yyyy-MM-dd" placeholder="选择日期" v-model="addOilForm.addDate"></Date-picker> |
| | | </Col> |
| | | </Row> |
| | | </Form-item> |
| | | <FormItem label="加油量" prop="amount"> |
| | | <Input v-model="addOilForm.amount" type="number"/> |
| | | </FormItem> |
| | | <FormItem label="单价" prop="unitPrice"> |
| | | <Input v-model="addOilForm.unitPrice" type="number"/> |
| | | </FormItem> |
| | | <FormItem label="加油金额" prop="money"> |
| | | <Input v-model="addOilForm.money" type="number"/> |
| | | </FormItem> |
| | | <FormItem label="加油时里程" prop="mileage"> |
| | | <Input v-model="addOilForm.mileage" type="number"/> |
| | | </Form-item> |
| | | </Col> |
| | | </Row> |
| | | <Row :gutter="0"> |
| | | <Col span="12"> |
| | | <FormItem label="加油量" prop="amount"> |
| | | <Input v-model="addOilForm.amount" type="number"/> |
| | | </FormItem> |
| | | </Col> |
| | | <Col span="12"> |
| | | <FormItem label="单价" prop="unitPrice"> |
| | | <Input v-model="addOilForm.unitPrice" type="number"/> |
| | | </FormItem> |
| | | </Col> |
| | | </Row> |
| | | <Row :gutter="0"> |
| | | <Col span="12"> |
| | | <FormItem label="加油金额" prop="money"> |
| | | <Input v-model="addOilForm.money" type="number"/> |
| | | </FormItem> |
| | | </Col> |
| | | <Col span="12"> |
| | | <FormItem label="里程" prop="mileage"> |
| | | <Input v-model="addOilForm.mileage" type="number"/> |
| | | </FormItem> |
| | | </Col> |
| | | </Row> |
| | | <FormItem label="加油卡号" prop="addOilCode"> |
| | | <Input v-model="addOilForm.addOilCode" /> |
| | | </FormItem> |
| | | <FormItem label="备注" prop="remarks"> |
| | | <Input v-model="addOilForm.remarks" /> |
| | |
| | | sortable: true, |
| | | }, |
| | | { |
| | | title: "加油卡号", |
| | | key: "addOilCode", |
| | | width: 100, |
| | | sortable: true, |
| | | }, |
| | | { |
| | | title: "加油日期", |
| | | key: "addDate", |
| | | width: 150, |
| | |
| | | this.loading = false; |
| | | if (res.success) { |
| | | this.data = res.result.records; |
| | | this.total = res.result.total; |
| | | this.total = res.result.length; |
| | | } |
| | | }); |
| | | }, |
New file |
| | |
| | | .permModal { |
| | | .ivu-modal-body { |
| | | max-height: 560px; |
| | | overflow: auto; |
| | | } |
| | | } |
| | | |
| | | .depModal { |
| | | .ivu-modal-body { |
| | | max-height: 500px; |
| | | overflow: auto; |
| | | } |
| | | } |
New file |
| | |
| | | <style lang="less"> |
| | | @import "@/styles/table-common.less"; |
| | | @import "@/styles/drawer-common.less"; |
| | | @import "./addOilInfoManage.less"; |
| | | </style> |
| | | <template> |
| | | <div class="search"> |
| | | <Card> |
| | | <Row class="operation"> |
| | | <Button @click="init" icon="md-refresh">刷新</Button> |
| | | <Button type="dashed" @click="openTip = !openTip">{{ |
| | | openTip ? "关闭提示" : "开启提示" |
| | | }}</Button> |
| | | <Date-picker v-model="value" @on-change="getDataList" |
| | | value-format="yyyy-MM-dd" type="daterange" placement="bottom-end" placeholder="请选择日期" style="width: 240px;padding-left: 20px"> |
| | | </Date-picker> |
| | | <Dropdown @on-click="handleDropdown" style="padding-left: 20px"> |
| | | <Button> |
| | | 导出数据 |
| | | <Icon type="md-arrow-dropdown" /> |
| | | </Button> |
| | | <DropdownMenu slot="list"> |
| | | <DropdownItem name="exportAll">导出所选日期数据</DropdownItem> |
| | | </DropdownMenu> |
| | | </Dropdown> |
| | | </Row> |
| | | <Alert show-icon v-show="openTip"> |
| | | 已选择 |
| | | <span class="select-count">{{ selectList.length }}</span> 项 |
| | | <a class="select-clear" @click="clearSelectAll">清空</a> |
| | | </Alert> |
| | | <Table |
| | | :loading="loading" |
| | | border |
| | | :columns="columns" |
| | | :data="data" |
| | | ref="table" |
| | | sortable="custom" |
| | | @on-sort-change="changeSort" |
| | | @on-selection-change="changeSelect" |
| | | ></Table> |
| | | <Row type="flex" justify="end" class="page"> |
| | | <Page |
| | | :current="searchForm.pageNumber" |
| | | :total="total" |
| | | :page-size="searchForm.pageSize" |
| | | @on-change="changePage" |
| | | @on-page-size-change="changePageSize" |
| | | :page-size-opts="[10, 20, 50]" |
| | | size="small" |
| | | show-total |
| | | show-elevator |
| | | show-sizer |
| | | v-show="this.page" |
| | | ></Page> |
| | | </Row> |
| | | </Card> |
| | | |
| | | <!-- 编辑 --> |
| | | <Modal |
| | | :title="modalTitle" |
| | | v-model="roleModalVisible" |
| | | :mask-closable="false" |
| | | :width="500" |
| | | > |
| | | </Modal> |
| | | <!-- 菜单权限 --> |
| | | <Drawer |
| | | :title="modalTitle" |
| | | v-model="permModalVisible" |
| | | :mask-closable="false" |
| | | :width="500" |
| | | draggable |
| | | > |
| | | <div :style="{ maxHeight: maxHeight }" class="drawer-content"> |
| | | <div style="position: relative"> |
| | | <Tree |
| | | ref="tree" |
| | | :data="permData" |
| | | show-checkbox |
| | | :render="renderContent" |
| | | :check-strictly="true" |
| | | ></Tree> |
| | | <Spin size="large" fix v-if="treeLoading"></Spin> |
| | | </div> |
| | | </div> |
| | | <div class="drawer-footer br"> |
| | | <Button |
| | | type="primary" |
| | | :loading="submitPermLoading" |
| | | @click="submitPermEdit" |
| | | >提交</Button |
| | | > |
| | | <Button @click="selectTreeAll">全选/反选</Button> |
| | | <Select |
| | | v-model="openLevel" |
| | | @on-change="changeOpen" |
| | | style="width: 110px" |
| | | transfer |
| | | > |
| | | <Option value="0">展开所有</Option> |
| | | <Option value="1">收合所有</Option> |
| | | <Option value="2">仅展开一级</Option> |
| | | <Option value="3">仅展开两级</Option> |
| | | </Select> |
| | | <Button type="text" @click="cancelPermEdit">取消</Button> |
| | | </div> |
| | | </Drawer> |
| | | <!-- 数据权限 --> |
| | | <Modal |
| | | :title="modalTitle" |
| | | v-model="carModalVisible" |
| | | :mask-closable="false" |
| | | :width="500" |
| | | class="depModal" |
| | | > |
| | | <Form :label-width="85" ref="removeForm" :model="removeForm"> |
| | | <FormItem label="移除原因" prop="removeReason"> |
| | | <Input v-model="removeForm.removeReason"/> |
| | | </FormItem> |
| | | </Form> |
| | | <div v-show="dataType == 1" style="margin-top: 15px"> |
| | | <div style="position: relative"> |
| | | <Tree |
| | | ref="depTree" |
| | | :data="depData" |
| | | :load-data="loadData" |
| | | @on-toggle-expand="expandCheckDep" |
| | | multiple |
| | | style="margin-top: 15px" |
| | | ></Tree> |
| | | <Spin size="large" fix v-if="depTreeLoading"></Spin> |
| | | </div> |
| | | </div> |
| | | <div slot="footer"> |
| | | <Button type="text" @click="depModalVisible = false">取消</Button> |
| | | <Button |
| | | type="primary" |
| | | :loading="submitDepLoading" |
| | | @click="submitRemove" |
| | | >提交</Button |
| | | > |
| | | </div> |
| | | </Modal> |
| | | <Modal |
| | | v-model="exportModalVisible" |
| | | :title="exportTitle" |
| | | :loading="loadingExport" |
| | | @on-ok="exportCustomData" |
| | | > |
| | | <Form ref="exportForm" :label-width="100"> |
| | | <FormItem label="导出文件名"> |
| | | <Input v-model="filename" /> |
| | | </FormItem> |
| | | </Form> |
| | | </Modal> |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | | import { |
| | | getAllPermissionList, |
| | | setDefaultRole, |
| | | editRolePerm, |
| | | initDepartment, |
| | | loadDepartment, |
| | | editRoleDep, |
| | | } from "@/api/index"; |
| | | |
| | | import { |
| | | getAll, |
| | | getAddOilList, |
| | | addOil, |
| | | deleteAddOil, |
| | | getCarList, |
| | | editCar, |
| | | deleteCar, |
| | | getByDate, |
| | | getOilExcel |
| | | } from "@/api/open"; |
| | | import util from "@/libs/util.js"; |
| | | import excel from "@/libs/excel.js"; |
| | | import XLSX from 'xlsx'; |
| | | import {exportColumn} from "./exportColumn"; |
| | | export default { |
| | | name: "car-manage", |
| | | data() { |
| | | return { |
| | | maxHeight: 510, |
| | | openTip: true, |
| | | openLevel: "0", |
| | | loading: true, |
| | | treeLoading: true, |
| | | depTreeLoading: true, |
| | | submitPermLoading: false, |
| | | submitDepLoading: false, |
| | | searchKey: "", |
| | | sortColumn: "createTime", |
| | | sortType: "desc", |
| | | modalType: 0, |
| | | roleModalVisible: false, |
| | | page: true, |
| | | carModalVisible: false, |
| | | exportModalVisible: false, |
| | | loadingExport: true, |
| | | permModalVisible: false, |
| | | depModalVisible: false, |
| | | modalTitle: "", |
| | | searchForm: { |
| | | // 搜索框初始化对象 |
| | | pageNumber: 1, // 当前页数 |
| | | pageSize: 10, // 页面大小 |
| | | sort: "createTime", // 默认排序字段 |
| | | order: "desc", // 默认排序方式 |
| | | key: "", |
| | | }, |
| | | addOilForm: { |
| | | status : 0 |
| | | }, |
| | | removeForm: { |
| | | status : 1 |
| | | }, |
| | | addOilFormValidate: { |
| | | name: [ |
| | | { required: true, message: "角色名称不能为空", trigger: "change" }, |
| | | ], |
| | | }, |
| | | submitLoading: false, |
| | | selectList: [], |
| | | columns: [ |
| | | { |
| | | type: "selection", |
| | | width: 60, |
| | | align: "center", |
| | | }, |
| | | { |
| | | type: "index", |
| | | width: 60, |
| | | align: "center", |
| | | }, |
| | | { |
| | | title: "车牌号", |
| | | key: "carNo", |
| | | width: 100, |
| | | }, |
| | | { |
| | | title: "加油卡号", |
| | | key: "addOilCode", |
| | | width: 130, |
| | | sortable: true, |
| | | align: "center", |
| | | }, |
| | | { |
| | | title: "加油日期", |
| | | key: "addDate", |
| | | width: 120, |
| | | sortable: true, |
| | | align: "center", |
| | | }, |
| | | { |
| | | title: "加油金额(元)", |
| | | key: "money", |
| | | minWidth: 130, |
| | | sortable: true, |
| | | align: "center", |
| | | render: (h, params) => { |
| | | return h("div",params.row.money==0 ? '':params.row.money); |
| | | } |
| | | }, |
| | | { |
| | | title: "加油量(升)", |
| | | key: "amount", |
| | | width: 130, |
| | | sortable: true, |
| | | align: "center", |
| | | render: (h, params) => { |
| | | return h("div",params.row.amount==0 ? '':params.row.amount); |
| | | } |
| | | }, |
| | | { |
| | | title: "行使里程(KM)", |
| | | key: "mileage", |
| | | minWidth: 130, |
| | | sortable: true, |
| | | align: "center", |
| | | render: (h, params) => { |
| | | return h("div",params.row.mileage==0 ? '':params.row.mileage); |
| | | } |
| | | }, |
| | | { |
| | | title: "百公里油耗(升)", |
| | | key: "oilWear", |
| | | minWidth: 150, |
| | | align: "center", |
| | | sortable: true, |
| | | }, |
| | | { |
| | | title: "备注", |
| | | key: "remarks", |
| | | align: "center", |
| | | minWidth: 150, |
| | | }, |
| | | ], |
| | | data: [], |
| | | chooseColumns: [], |
| | | total: 0, |
| | | permData: [], |
| | | exportColumns: exportColumn, |
| | | filename: "加油数据", |
| | | exportTitle: "确认导出", |
| | | editRolePermId: "", |
| | | selectAllFlag: false, |
| | | depData: [], |
| | | dataType: 0, |
| | | editDepartments: [], |
| | | buyYear:'', |
| | | carList:[], |
| | | value:[] |
| | | }; |
| | | }, |
| | | methods: { |
| | | change1(e){ |
| | | this.addDate = e; |
| | | }, |
| | | init() { |
| | | this.getDataList(); |
| | | // 获取所有菜单权限树 |
| | | this.getPermList(); |
| | | this.getAllCar(); |
| | | }, |
| | | renderContent(h, { root, node, data }) { |
| | | let icon = ""; |
| | | if (data.level == 0) { |
| | | icon = "ios-navigate"; |
| | | } else if (data.level == 1) { |
| | | icon = "md-list-box"; |
| | | } else if (data.level == 2) { |
| | | icon = "md-list"; |
| | | } else if (data.level == 3) { |
| | | icon = "md-radio-button-on"; |
| | | } else { |
| | | icon = "md-radio-button-off"; |
| | | } |
| | | return h( |
| | | "span", |
| | | { |
| | | style: { |
| | | display: "inline-block", |
| | | cursor: "pointer", |
| | | }, |
| | | on: { |
| | | click: () => { |
| | | if (data.status == -1) { |
| | | return; |
| | | } |
| | | data.checked = !data.checked; |
| | | }, |
| | | }, |
| | | }, |
| | | [ |
| | | h("span", [ |
| | | h("Icon", { |
| | | props: { |
| | | type: icon, |
| | | size: "16", |
| | | }, |
| | | style: { |
| | | "margin-right": "8px", |
| | | "margin-bottom": "3px", |
| | | }, |
| | | }), |
| | | h("span", data.title), |
| | | ]), |
| | | ] |
| | | ); |
| | | }, |
| | | handleDropdown(name) { |
| | | if (name == "refresh") { |
| | | this.getDataList(); |
| | | } else if (name == "exportData") { |
| | | if (this.selectList.length <= 0) { |
| | | this.$Message.warning("您还未选择要导出的数据"); |
| | | return; |
| | | } |
| | | this.exportType = "part"; |
| | | this.exportModalVisible = true; |
| | | this.exportTitle = |
| | | "确认导出数据"; |
| | | } else if (name == "exportAll") { |
| | | this.exportType = "all"; |
| | | this.exportModalVisible = true; |
| | | this.exportTitle = "确认导出全部数据"; |
| | | getOilExcel(this.searchForm).then((res) => { |
| | | if (res.success) { |
| | | this.exportData = res.result; |
| | | } |
| | | }); |
| | | } else if (name == "importData") { |
| | | this.importModalVisible = true; |
| | | } |
| | | }, |
| | | //导出数据 |
| | | exportCustomData() { |
| | | if (this.filename == "") { |
| | | this.filename = "加油数据"; |
| | | } |
| | | // 判断勾选导出列 |
| | | let exportColumns = []; |
| | | this.exportColumns.forEach((e) => { |
| | | exportColumns.push(e); |
| | | }); |
| | | this.exportModalVisible = false; |
| | | let title = []; |
| | | let key = []; |
| | | exportColumns.forEach((e) => { |
| | | title.push(e.title); |
| | | key.push(e.key); |
| | | }); |
| | | console.log(this.exportData) |
| | | const params = { |
| | | title: title, |
| | | key: key, |
| | | data: this.exportData, |
| | | autoWidth: true, |
| | | filename: this.filename, |
| | | }; |
| | | this.exportData.forEach((i) => { |
| | | console.log(i); |
| | | |
| | | i.amount = i.amount == 0 ? '': i.amount ; |
| | | i.unitPrice = i.unitPrice == 0 ? '' : i.unitPrice; |
| | | i.money = i.money == 0 ? '' : i.money; |
| | | i.mileage = i.mileage == 0 ? '' : i.mileage; |
| | | }); |
| | | excel.export_array_to_excel(params); |
| | | }, |
| | | changePage(v) { |
| | | this.searchForm.pageNumber = v; |
| | | this.getDataList(); |
| | | this.clearSelectAll(); |
| | | }, |
| | | changePageSize(v) { |
| | | this.searchForm.pageSize = v; |
| | | this.getDataList(); |
| | | }, |
| | | changeSort(e) { |
| | | this.searchForm.sort = e.key; |
| | | this.searchForm.order = e.order; |
| | | if (e.order == "normal") { |
| | | this.searchForm.order = ""; |
| | | } |
| | | this.getDataList(); |
| | | }, |
| | | selectDate(dateData) { |
| | | let date = new Date (dateData) |
| | | let y = date . getFullYear() |
| | | let m = date . getMonth() + 1 |
| | | m=m<10?('0'+m):m |
| | | let d = date.getDate() |
| | | d = d< 10?('0'+ d):d |
| | | const time = y + '-' + m + '-' + d; |
| | | return time |
| | | }, |
| | | getDataList() { |
| | | this.loading = true; |
| | | if (this.value[0]!="" && this.value[1]!=""){ |
| | | this.searchForm.beginTime = this.selectDate(this.value[0]); |
| | | this.searchForm.endTime = this.selectDate(this.value[1]); |
| | | this.page=false; |
| | | }else{ |
| | | this.searchForm.beginTime = ""; |
| | | this.searchForm.endTime = ""; |
| | | } |
| | | getOilExcel(this.searchForm).then((res) => { |
| | | this.loading = false; |
| | | if (res.success) { |
| | | this.data = res.result; |
| | | this.total = res.result.length; |
| | | } |
| | | }); |
| | | }, |
| | | getPermList() { |
| | | this.treeLoading = true; |
| | | getAllPermissionList().then((res) => { |
| | | if (res.success) { |
| | | this.deleteDisableNode(res.result); |
| | | this.permData = res.result; |
| | | this.treeLoading = false; |
| | | } |
| | | this.treeLoading = false; |
| | | }); |
| | | }, |
| | | // 递归标记禁用节点 |
| | | deleteDisableNode(permData) { |
| | | let that = this; |
| | | permData.forEach(function (e) { |
| | | if (e.status == -1) { |
| | | e.title = "[已禁用] " + e.title; |
| | | e.disabled = true; |
| | | } |
| | | if (e.children && e.children.length > 0) { |
| | | that.deleteDisableNode(e.children); |
| | | } |
| | | }); |
| | | }, |
| | | carRole() { |
| | | this.roleModalVisible = false; |
| | | }, |
| | | submitAddOil() { |
| | | this.addOilForm.addDate = this.addDate; |
| | | this.$refs.addOilForm.validate((valid) => { |
| | | if (valid) { |
| | | if (this.modalType == 0) { |
| | | // 添加 |
| | | this.submitLoading = true; |
| | | addOil(this.addOilForm).then((res) => { |
| | | this.submitLoading = false; |
| | | if (res.success) { |
| | | this.$Message.success("操作成功"); |
| | | this.getDataList(); |
| | | this.roleModalVisible = false; |
| | | } |
| | | }); |
| | | } else { |
| | | this.submitLoading = true; |
| | | addOil(this.addOilForm).then((res) => { |
| | | this.submitLoading = false; |
| | | if (res.success) { |
| | | this.$Message.success("操作成功"); |
| | | this.getDataList(); |
| | | this.roleModalVisible = false; |
| | | } |
| | | }); |
| | | } |
| | | } |
| | | }); |
| | | }, |
| | | submitRemove(){ |
| | | this.$refs.removeForm.validate((valid) => { |
| | | if (valid) { |
| | | this.submitLoading = true; |
| | | editCar(this.removeForm).then((res) => { |
| | | this.submitLoading = false; |
| | | if (res.success) { |
| | | this.$Message.success("操作成功"); |
| | | this.getDataList(); |
| | | this.carModalVisible = false; |
| | | } |
| | | }); |
| | | } |
| | | }); |
| | | }, |
| | | addOil() { |
| | | this.modalType = 0; |
| | | this.modalTitle = "添加加油记录"; |
| | | this.$refs.addOilForm.resetFields(); |
| | | delete this.addOilForm.id; |
| | | this.roleModalVisible = true; |
| | | }, |
| | | edit(v) { |
| | | this.getAllCar(); |
| | | this.addDate = v.addDate; |
| | | this.modalType = 1; |
| | | this.modalTitle = "编辑加油信息"; |
| | | this.$refs.addOilForm.resetFields(); |
| | | // 转换null为"" |
| | | for (let attr in v) { |
| | | if (v[attr] == null) { |
| | | v[attr] = ""; |
| | | } |
| | | } |
| | | let str = JSON.stringify(v); |
| | | let roleInfo = JSON.parse(str); |
| | | |
| | | this.addOilForm = roleInfo; |
| | | this.roleModalVisible = true; |
| | | }, |
| | | removeCar(v) { |
| | | this.dataType = 0; |
| | | this.modalTitle = "移除车辆"; |
| | | this.$refs.addOilForm.resetFields(); |
| | | // 转换null为"" |
| | | for (let attr in v) { |
| | | if (v[attr] == null) { |
| | | v[attr] = ""; |
| | | } |
| | | } |
| | | let str = JSON.stringify(v); |
| | | let roleInfo = JSON.parse(str); |
| | | roleInfo.status=1 |
| | | console.log(roleInfo); |
| | | this.removeForm = roleInfo; |
| | | this.carModalVisible = true; |
| | | |
| | | }, |
| | | getAllCar(){ |
| | | getAll().then((res) => { |
| | | if(res.success){ |
| | | this.carList = res.result; |
| | | console.log(this.carList); |
| | | } |
| | | }); |
| | | }, |
| | | remove(v) { |
| | | this.$Modal.confirm({ |
| | | title: "确认删除", |
| | | content: "您确认要删除吗 ", |
| | | loading: true, |
| | | onOk: () => { |
| | | deleteAddOil({ ids: v.id }).then((res) => { |
| | | this.$Modal.remove(); |
| | | if (res.success) { |
| | | this.clearSelectAll(); |
| | | this.$Message.success("删除成功"); |
| | | this.getDataList(); |
| | | } |
| | | }); |
| | | }, |
| | | }); |
| | | }, |
| | | setDefault(v) { |
| | | this.loading = true; |
| | | let params = { |
| | | id: v.id, |
| | | isDefault: true, |
| | | }; |
| | | setDefaultRole(params).then((res) => { |
| | | this.loading = false; |
| | | if (res.success) { |
| | | this.$Message.success("操作成功"); |
| | | this.getDataList(); |
| | | } |
| | | }); |
| | | }, |
| | | cancelDefault(v) { |
| | | this.loading = true; |
| | | let params = { |
| | | id: v.id, |
| | | isDefault: false, |
| | | }; |
| | | setDefaultRole(params).then((res) => { |
| | | this.loading = false; |
| | | if (res.success) { |
| | | this.$Message.success("操作成功"); |
| | | this.getDataList(); |
| | | } |
| | | }); |
| | | }, |
| | | clearSelectAll() { |
| | | this.$refs.table.selectAll(false); |
| | | }, |
| | | changeSelect(e) { |
| | | this.selectList = e; |
| | | }, |
| | | delAll() { |
| | | if (this.selectList.length <= 0) { |
| | | this.$Message.warning("您还未选择要删除的数据"); |
| | | return; |
| | | } |
| | | this.$Modal.confirm({ |
| | | title: "确认删除", |
| | | content: "您确认要删除所选的 " + this.selectList.length + " 条数据?", |
| | | loading: true, |
| | | onOk: () => { |
| | | let ids = ""; |
| | | this.selectList.forEach(function (e) { |
| | | ids += e.id + ","; |
| | | }); |
| | | ids = ids.substring(0, ids.length - 1); |
| | | deleteCar({ ids: ids }).then((res) => { |
| | | this.$Modal.remove(); |
| | | if (res.success) { |
| | | this.$Message.success("删除成功"); |
| | | this.clearSelectAll(); |
| | | this.getDataList(); |
| | | } |
| | | }); |
| | | }, |
| | | }); |
| | | }, |
| | | editPerm(v) { |
| | | this.editRolePermId = v.id; |
| | | this.modalTitle = "分配 " + v.name + " 的菜单权限"; |
| | | // 匹配勾选 |
| | | let rolePerms = v.permissions; |
| | | if (this.treeLoading) { |
| | | this.$Message.warning("菜单权限数据加载中,请稍后点击查看"); |
| | | return; |
| | | } |
| | | // 递归判断子节点 |
| | | this.checkPermTree(this.permData, rolePerms); |
| | | this.permModalVisible = true; |
| | | }, |
| | | // 递归判断子节点 |
| | | checkPermTree(permData, rolePerms) { |
| | | let that = this; |
| | | permData.forEach(function (p) { |
| | | if (that.hasPerm(p, rolePerms) && p.status != -1) { |
| | | p.checked = true; |
| | | } else { |
| | | p.checked = false; |
| | | } |
| | | if (p.children && p.children.length > 0) { |
| | | that.checkPermTree(p.children, rolePerms); |
| | | } |
| | | }); |
| | | }, |
| | | // 判断角色拥有的权限节点勾选 |
| | | hasPerm(p, rolePerms) { |
| | | let flag = false; |
| | | for (let i = 0; i < rolePerms.length; i++) { |
| | | if (p.id == rolePerms[i].permissionId) { |
| | | flag = true; |
| | | break; |
| | | } |
| | | } |
| | | if (flag) { |
| | | return true; |
| | | } |
| | | return false; |
| | | }, |
| | | // 全选反选 |
| | | selectTreeAll() { |
| | | this.selectAllFlag = !this.selectAllFlag; |
| | | let select = this.selectAllFlag; |
| | | this.selectedTreeAll(this.permData, select); |
| | | }, |
| | | // 递归全选节点 |
| | | selectedTreeAll(permData, select) { |
| | | let that = this; |
| | | permData.forEach(function (e) { |
| | | e.checked = select; |
| | | if (e.children && e.children.length > 0) { |
| | | that.selectedTreeAll(e.children, select); |
| | | } |
| | | }); |
| | | }, |
| | | submitPermEdit() { |
| | | this.submitPermLoading = true; |
| | | let permIds = ""; |
| | | let selectedNodes = this.$refs.tree.getCheckedNodes(); |
| | | selectedNodes.forEach(function (e) { |
| | | permIds += e.id + ","; |
| | | }); |
| | | permIds = permIds.substring(0, permIds.length - 1); |
| | | editRolePerm({ |
| | | roleId: this.editRolePermId, |
| | | permIds: permIds, |
| | | }).then((res) => { |
| | | this.submitPermLoading = false; |
| | | if (res.success) { |
| | | this.$Message.success("操作成功"); |
| | | // 标记重新获取菜单数据 |
| | | this.$store.commit("setAdded", false); |
| | | util.initRouter(this); |
| | | this.getDataList(); |
| | | this.permModalVisible = false; |
| | | } |
| | | }); |
| | | }, |
| | | cancelPermEdit() { |
| | | this.permModalVisible = false; |
| | | }, |
| | | loadData(item, callback) { |
| | | loadDepartment(item.id, { openDataFilter: false }).then((res) => { |
| | | if (res.success) { |
| | | res.result.forEach(function (e) { |
| | | e.selected = false; |
| | | if (e.isParent) { |
| | | e.loading = false; |
| | | e.children = []; |
| | | } |
| | | if (e.status == -1) { |
| | | e.title = "[已禁用] " + e.title; |
| | | e.disabled = true; |
| | | } |
| | | }); |
| | | callback(res.result); |
| | | } |
| | | }); |
| | | }, |
| | | expandCheckDep(v) { |
| | | // 判断展开子节点 |
| | | this.checkDepTree(v.children, this.editDepartments); |
| | | }, |
| | | // 判断子节点 |
| | | checkDepTree(depData, roleDepIds) { |
| | | let that = this; |
| | | depData.forEach(function (p) { |
| | | if (that.hasDepPerm(p, roleDepIds)) { |
| | | p.selected = true; |
| | | } else { |
| | | p.selected = false; |
| | | } |
| | | }); |
| | | }, |
| | | // 判断角色拥有的权限节点勾选 |
| | | hasDepPerm(p, roleDepIds) { |
| | | let flag = false; |
| | | for (let i = 0; i < roleDepIds.length; i++) { |
| | | if (p.id == roleDepIds[i].departmentId) { |
| | | flag = true; |
| | | break; |
| | | } |
| | | } |
| | | if (flag) { |
| | | return true; |
| | | } |
| | | return false; |
| | | }, |
| | | submitDepEdit() { |
| | | let depIds = ""; |
| | | if (this.dataType == 1) { |
| | | let selectedNodes = this.$refs.depTree.getSelectedNodes(); |
| | | selectedNodes.forEach(function (e) { |
| | | depIds += e.id + ","; |
| | | }); |
| | | depIds = depIds.substring(0, depIds.length - 1); |
| | | } |
| | | this.submitDepLoading = true; |
| | | editRoleDep({ |
| | | roleId: this.editRolePermId, |
| | | dataType: this.dataType, |
| | | depIds: depIds, |
| | | }).then((res) => { |
| | | this.submitDepLoading = false; |
| | | if (res.success) { |
| | | this.$Message.success("操作成功"); |
| | | this.getDataList(); |
| | | this.depModalVisible = false; |
| | | } |
| | | }); |
| | | }, |
| | | changeOpen(v) { |
| | | if (v == "0") { |
| | | this.permData.forEach((e) => { |
| | | e.expand = true; |
| | | if (e.children && e.children.length > 0) { |
| | | e.children.forEach((c) => { |
| | | c.expand = true; |
| | | if (c.children && c.children.length > 0) { |
| | | c.children.forEach(function (b) { |
| | | b.expand = true; |
| | | }); |
| | | } |
| | | }); |
| | | } |
| | | }); |
| | | } else if (v == "1") { |
| | | this.permData.forEach((e) => { |
| | | e.expand = false; |
| | | if (e.children && e.children.length > 0) { |
| | | e.children.forEach((c) => { |
| | | c.expand = false; |
| | | if (c.children && c.children.length > 0) { |
| | | c.children.forEach(function (b) { |
| | | b.expand = false; |
| | | }); |
| | | } |
| | | }); |
| | | } |
| | | }); |
| | | } else if (v == "2") { |
| | | this.permData.forEach((e) => { |
| | | e.expand = true; |
| | | if (e.children && e.children.length > 0) { |
| | | e.children.forEach((c) => { |
| | | c.expand = false; |
| | | if (c.children && c.children.length > 0) { |
| | | c.children.forEach(function (b) { |
| | | b.expand = false; |
| | | }); |
| | | } |
| | | }); |
| | | } |
| | | }); |
| | | } else if (v == "3") { |
| | | this.permData.forEach((e) => { |
| | | e.expand = true; |
| | | if (e.children && e.children.length > 0) { |
| | | e.children.forEach((c) => { |
| | | c.expand = true; |
| | | if (c.children && c.children.length > 0) { |
| | | c.children.forEach(function (b) { |
| | | b.expand = false; |
| | | }); |
| | | } |
| | | }); |
| | | } |
| | | }); |
| | | } |
| | | }, |
| | | }, |
| | | mounted() { |
| | | this.maxHeight = Number(document.documentElement.clientHeight - 121) + "px"; |
| | | this.init(); |
| | | }, |
| | | }; |
| | | </script> |
New file |
| | |
| | | export const exportColumn = [ |
| | | { |
| | | title: "车牌号", |
| | | key: "carNo", |
| | | width: 100, |
| | | align: "center", |
| | | }, |
| | | { |
| | | title: "加油卡号", |
| | | key: "addOilCode", |
| | | width: 140, |
| | | sortable: true, |
| | | align: "center", |
| | | }, |
| | | { |
| | | title: "加油日期", |
| | | key: "addDate", |
| | | width: 150, |
| | | sortable: true, |
| | | align: "center", |
| | | }, |
| | | { |
| | | title: "加油金额(元)", |
| | | key: "money", |
| | | minWidth: 100, |
| | | sortable: true, |
| | | align: "center", |
| | | }, |
| | | { |
| | | title: "加油量(升)", |
| | | key: "amount", |
| | | width: 130, |
| | | sortable: true, |
| | | align: "center", |
| | | }, |
| | | { |
| | | title: "行使里程(KM)", |
| | | key: "mileage", |
| | | minWidth: 100, |
| | | sortable: true, |
| | | align: "center", |
| | | }, |
| | | { |
| | | title: "百公里油耗(升)", |
| | | key: "oilWear", |
| | | minWidth: 100, |
| | | sortable: true, |
| | | align: "center", |
| | | }, |
| | | { |
| | | title: "备注", |
| | | key: "remarks", |
| | | minWidth: 150, |
| | | align: "center", |
| | | }, |
| | | ] |
| | |
| | | |
| | | |
| | | </Table> |
| | | </Modal>05 |
| | | </Modal> |
| | | <Modal :title="modalTitle3" v-model="customerVisible" :mask-closable="false" :width="1050"> |
| | | <Row class="operation" style="padding-bottom: 20px"> |
| | | <Button @click="addCustomer" type="primary" icon="md-add">添加</Button> |
| | |
| | | <FormItem label="商户编号" prop="code"> |
| | | <Input v-model="customerForm.code" /> |
| | | </FormItem> |
| | | <FormItem label="联系方式" prop="phone"> |
| | | <Input v-model="customerForm.phone" /> |
| | | </FormItem> |
| | | <FormItem label="经度" prop="lng"> |
| | | <Input v-model="customerForm.lng" /> |
| | | </FormItem> |
| | | <FormItem label="纬度" prop="lat"> |
| | | <Input v-model="customerForm.lat" /> |
| | | </FormItem> |
| | | <Form-item label="上次配送日期" prop="lastTime"> |
| | | <Row> |
| | | <Col> |
| | | <Date-picker @on-change="change1" type="date" value="yyyy-MM-dd" placeholder="选择日期" v-model="customerForm.lastTime"></Date-picker> |
| | | </Col> |
| | | </Row> |
| | | </Form-item> |
| | | |
| | | <Row :gutter="0"> |
| | | <Col span="12"> |
| | | <FormItem label="经度" prop="lng"> |
| | | <Input v-model="customerForm.lng" /> |
| | | </FormItem> |
| | | </Col> |
| | | <Col span="12"> |
| | | <FormItem label="纬度" prop="lat"> |
| | | <Input v-model="customerForm.lat" /> |
| | | </FormItem> |
| | | </Col> |
| | | </Row> |
| | | <Row :gutter="0"> |
| | | <Col span="12"> |
| | | <Form-item label="上次配送日期" prop="lastTime"> |
| | | <Row> |
| | | <Col> |
| | | <Date-picker @on-change="change1" type="date" value="yyyy-MM-dd" placeholder="选择日期" v-model="customerForm.lastTime"></Date-picker> |
| | | </Col> |
| | | </Row> |
| | | </Form-item> |
| | | </Col> |
| | | <Col span="12"> |
| | | <FormItem label="联系方式" prop="phone"> |
| | | <Input v-model="customerForm.phone" type="number"/> |
| | | </FormItem> |
| | | </Col> |
| | | </Row> |
| | | |
| | | <FormItem label="商户注册地址" prop="registeredAddress"> |
| | | <Input v-model="customerForm.registeredAddress" /> |
| | | </FormItem> |
| | |
| | | <Card> |
| | | <Row class="operation"> |
| | | <Button @click="addCar" type="primary" icon="md-add">添加车辆</Button> |
| | | <Button @click="delAll" icon="md-trash">批量删除</Button> |
| | | <Button @click="init" icon="md-refresh">刷新</Button> |
| | | <Button type="dashed" @click="openTip = !openTip">{{ |
| | | openTip ? "关闭提示" : "开启提示" |
New file |
| | |
| | | .permModal { |
| | | .ivu-modal-body { |
| | | max-height: 560px; |
| | | overflow: auto; |
| | | } |
| | | } |
| | | |
| | | .depModal { |
| | | .ivu-modal-body { |
| | | max-height: 500px; |
| | | overflow: auto; |
| | | } |
| | | } |
New file |
| | |
| | | <style lang="less"> |
| | | @import "@/styles/table-common.less"; |
| | | @import "@/styles/drawer-common.less"; |
| | | @import "src/views/your/carInfo-manage/carInfoManage.less"; |
| | | </style> |
| | | <template> |
| | | <div class="search"> |
| | | <Card> |
| | | <Row class="operation"> |
| | | <Button @click="init" icon="md-refresh">刷新</Button> |
| | | <Button type="dashed" @click="openTip = !openTip">{{ |
| | | openTip ? "关闭提示" : "开启提示" |
| | | }}</Button> |
| | | |
| | | <Date-picker v-model="value" @on-change="getDataList" |
| | | value-format="yyyy-MM-dd" type="daterange" placement="bottom-end" placeholder="请选择日期" style="width: 240px;padding-left: 20px"> |
| | | </Date-picker> |
| | | <Dropdown @on-click="handleDropdown" style="padding-left: 20px"> |
| | | <Button> |
| | | 导出数据 |
| | | <Icon type="md-arrow-dropdown" /> |
| | | </Button> |
| | | <DropdownMenu slot="list"> |
| | | <DropdownItem name="exportData">导出所选数据</DropdownItem> |
| | | <DropdownItem name="exportAll">导出全部数据</DropdownItem> |
| | | </DropdownMenu> |
| | | </Dropdown> |
| | | </Row> |
| | | |
| | | <Alert show-icon v-show="openTip"> |
| | | 已选择 |
| | | <span class="select-count">{{ selectList.length }}</span> 项 |
| | | <a class="select-clear" @click="clearSelectAll">清空</a> |
| | | </Alert> |
| | | <Table |
| | | :loading="loading" |
| | | border |
| | | :columns="columns" |
| | | :data="data" |
| | | ref="table" |
| | | sortable="custom" |
| | | @on-sort-change="changeSort" |
| | | @on-selection-change="changeSelect" |
| | | ></Table> |
| | | <Row type="flex" justify="end" class="page"> |
| | | <Page |
| | | :current="searchForm.pageNumber" |
| | | :total="total" |
| | | :page-size="searchForm.pageSize" |
| | | @on-change="changePage" |
| | | @on-page-size-change="changePageSize" |
| | | :page-size-opts="[10, 20, 50]" |
| | | size="small" |
| | | show-total |
| | | show-elevator |
| | | show-sizer |
| | | ></Page> |
| | | </Row> |
| | | </Card> |
| | | |
| | | <!-- 编辑 --> |
| | | <Modal |
| | | :title="modalTitle" |
| | | v-model="roleModalVisible" |
| | | :mask-closable="false" |
| | | :width="500" |
| | | > |
| | | <div slot="footer"> |
| | | <Button type="text" @click="carRole">取消</Button> |
| | | <Button type="primary" :loading="submitLoading" @click="submitAddOil" |
| | | >提交</Button |
| | | > |
| | | </div> |
| | | </Modal> |
| | | <!-- 自定义导出数据 --> |
| | | <Modal |
| | | v-model="exportModalVisible" |
| | | :title="exportTitle" |
| | | :loading="loadingExport" |
| | | @on-ok="exportCustomData" |
| | | > |
| | | <Form ref="exportForm" :label-width="100"> |
| | | <FormItem label="导出文件名"> |
| | | <Input v-model="filename" /> |
| | | </FormItem> |
| | | </Form> |
| | | </Modal> |
| | | <!-- 菜单权限 --> |
| | | <Drawer |
| | | :title="modalTitle" |
| | | v-model="permModalVisible" |
| | | :mask-closable="false" |
| | | :width="500" |
| | | draggable |
| | | > |
| | | <div :style="{ maxHeight: maxHeight }" class="drawer-content"> |
| | | <div style="position: relative"> |
| | | <Tree |
| | | ref="tree" |
| | | :data="permData" |
| | | show-checkbox |
| | | :render="renderContent" |
| | | :check-strictly="true" |
| | | ></Tree> |
| | | <Spin size="large" fix v-if="treeLoading"></Spin> |
| | | </div> |
| | | </div> |
| | | <div class="drawer-footer br"> |
| | | <Button |
| | | type="primary" |
| | | :loading="submitPermLoading" |
| | | @click="submitPermEdit" |
| | | >提交</Button |
| | | > |
| | | <Button @click="selectTreeAll">全选/反选</Button> |
| | | <Select |
| | | v-model="openLevel" |
| | | @on-change="changeOpen" |
| | | style="width: 110px" |
| | | transfer |
| | | > |
| | | <Option value="0">展开所有</Option> |
| | | <Option value="1">收合所有</Option> |
| | | <Option value="2">仅展开一级</Option> |
| | | <Option value="3">仅展开两级</Option> |
| | | </Select> |
| | | <Button type="text" @click="cancelPermEdit">取消</Button> |
| | | </div> |
| | | </Drawer> |
| | | <!-- 数据权限 --> |
| | | <Modal |
| | | :title="modalTitle" |
| | | v-model="carModalVisible" |
| | | :mask-closable="false" |
| | | :width="500" |
| | | class="depModal" |
| | | > |
| | | <Form :label-width="85" ref="removeForm" :model="removeForm"> |
| | | <FormItem label="移除原因" prop="removeReason"> |
| | | <Input v-model="removeForm.removeReason"/> |
| | | </FormItem> |
| | | </Form> |
| | | <div v-show="dataType == 1" style="margin-top: 15px"> |
| | | <div style="position: relative"> |
| | | <Tree |
| | | ref="depTree" |
| | | :data="depData" |
| | | :load-data="loadData" |
| | | @on-toggle-expand="expandCheckDep" |
| | | multiple |
| | | style="margin-top: 15px" |
| | | ></Tree> |
| | | <Spin size="large" fix v-if="depTreeLoading"></Spin> |
| | | </div> |
| | | </div> |
| | | <div slot="footer"> |
| | | <Button type="text" @click="depModalVisible = false">取消</Button> |
| | | <Button |
| | | type="primary" |
| | | :loading="submitDepLoading" |
| | | @click="submitRemove" |
| | | >提交</Button |
| | | > |
| | | </div> |
| | | </Modal> |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | | import { |
| | | getAllPermissionList, |
| | | setDefaultRole, |
| | | editRolePerm, |
| | | initDepartment, |
| | | loadDepartment, |
| | | editRoleDep, |
| | | } from "@/api/index"; |
| | | |
| | | import { |
| | | getAll, |
| | | getAddOilList, |
| | | addOil, |
| | | deleteAddOil, |
| | | getCarList, |
| | | editCar, |
| | | deleteCar, |
| | | getCar, |
| | | getSuggest, |
| | | deleteSuggest, |
| | | } from "@/api/open"; |
| | | import util from "@/libs/util.js"; |
| | | import excel from "@/libs/excel.js"; |
| | | import {exportColumn} from "./exportColumn"; |
| | | export default { |
| | | name: "car-manage", |
| | | data() { |
| | | return { |
| | | maxHeight: 510, |
| | | openTip: true, |
| | | openLevel: "0", |
| | | loading: true, |
| | | treeLoading: true, |
| | | depTreeLoading: true, |
| | | submitPermLoading: false, |
| | | submitDepLoading: false, |
| | | searchKey: "", |
| | | sortColumn: "createTime", |
| | | sortType: "desc", |
| | | modalType: 0, |
| | | loadingExport: true, |
| | | roleModalVisible: false, |
| | | exportModalVisible: false, |
| | | carModalVisible: false, |
| | | permModalVisible: false, |
| | | depModalVisible: false, |
| | | modalTitle: "", |
| | | searchForm: { |
| | | // 搜索框初始化对象 |
| | | pageNumber: 1, // 当前页数 |
| | | pageSize: 10, // 页面大小 |
| | | sort: "createTime", // 默认排序字段 |
| | | order: "desc", // 默认排序方式 |
| | | key: "", |
| | | }, |
| | | addOilForm: { |
| | | status : 0 |
| | | }, |
| | | removeForm: { |
| | | status : 1 |
| | | }, |
| | | addOilFormValidate: { |
| | | name: [ |
| | | { required: true, message: "角色名称不能为空", trigger: "change" }, |
| | | ], |
| | | }, |
| | | submitLoading: false, |
| | | selectList: [], |
| | | columns: [ |
| | | { |
| | | type: "selection", |
| | | width: 60, |
| | | align: "center", |
| | | }, |
| | | { |
| | | type: "index", |
| | | width: 60, |
| | | align: "center", |
| | | }, |
| | | { |
| | | title: "送货线路", |
| | | key: "areaName", |
| | | width: 130, |
| | | render: (h, params) => { |
| | | return h("div",params.row.car.areaName); |
| | | } |
| | | }, |
| | | { |
| | | title: "车牌号", |
| | | key: "carNo", |
| | | width: 120, |
| | | render: (h, params) => { |
| | | return h("div",params.row.car.carNo); |
| | | } |
| | | }, |
| | | { |
| | | title: "加油卡号", |
| | | key: "addOilCode", |
| | | width: 140, |
| | | sortable: true, |
| | | render: (h, params) => { |
| | | return h("div",params.row.car.addOilCode); |
| | | } |
| | | }, |
| | | { |
| | | title: "起始里程(公里)", |
| | | key: "beginMileage", |
| | | width: 140, |
| | | }, |
| | | { |
| | | title: "期末里程(公里)", |
| | | key: "endMileage", |
| | | width: 140, |
| | | }, |
| | | { |
| | | title: "月行驶里程(公里)", |
| | | key: "mileage", |
| | | width: 150, |
| | | render: (h, params) => { |
| | | return h("div",params.row.endMileage-params.row.beginMileage); |
| | | } |
| | | }, |
| | | { |
| | | title: "月油耗(升)", |
| | | key: "oilWear", |
| | | width: 130, |
| | | }, |
| | | { |
| | | title: "百公里油耗", |
| | | key: "oil", |
| | | width: 130, |
| | | render: (h, params) => { |
| | | var mileage = params.row.endMileage-params.row.beginMileage; |
| | | if (mileage==0 || params.row.oilWear==0){ |
| | | return h("div","0"); |
| | | }else { |
| | | return h("div",(parseFloat(params.row.oilWear/mileage*100).toFixed(2))); |
| | | } |
| | | } |
| | | }, |
| | | { |
| | | title: "驾驶员", |
| | | key: "nickname", |
| | | width: 120, |
| | | render: (h, params) => { |
| | | return h("div",params.row.car.nickName); |
| | | } |
| | | }, |
| | | { |
| | | title: "月加油金额(元)", |
| | | key: "money", |
| | | width: 140, |
| | | }, |
| | | { |
| | | title: "操作", |
| | | key: "action", |
| | | align: "center", |
| | | width: 120, |
| | | render: (h, params) => { |
| | | return h("div", [ |
| | | h( |
| | | "a", |
| | | { |
| | | on: { |
| | | click: () => { |
| | | this.remove(params.row); |
| | | }, |
| | | }, |
| | | }, |
| | | "删除" |
| | | ), |
| | | ]); |
| | | }, |
| | | }, |
| | | ], |
| | | data: [], |
| | | chooseColumns: [], |
| | | total: 0, |
| | | permData: [], |
| | | exportColumns: exportColumn, |
| | | filename: "车辆数据", |
| | | exportTitle: "确认导出", |
| | | editRolePermId: "", |
| | | selectAllFlag: false, |
| | | depData: [], |
| | | dataType: 0, |
| | | editDepartments: [], |
| | | buyYear:'', |
| | | carList:[], |
| | | value:[], |
| | | exportData: [], |
| | | }; |
| | | }, |
| | | methods: { |
| | | change1(e){ |
| | | this.addDate = e; |
| | | }, |
| | | init() { |
| | | this.getDataList(); |
| | | // 获取所有菜单权限树 |
| | | this.getPermList(); |
| | | // 初始化导出列数据 |
| | | let array = []; |
| | | this.exportColumns.forEach((e) => { |
| | | // 指定列限制权限 |
| | | if ( |
| | | !this.getStore("roles").includes("ROLE_ADMIN") && |
| | | e.key == "mobile" |
| | | ) { |
| | | e.title = "[无权导出] " + e.title; |
| | | e.disabled = true; |
| | | } else { |
| | | e.disabled = false; |
| | | } |
| | | array.push(e.title); |
| | | }); |
| | | this.chooseColumns = array; |
| | | }, |
| | | renderContent(h, { root, node, data }) { |
| | | let icon = ""; |
| | | if (data.level == 0) { |
| | | icon = "ios-navigate"; |
| | | } else if (data.level == 1) { |
| | | icon = "md-list-box"; |
| | | } else if (data.level == 2) { |
| | | icon = "md-list"; |
| | | } else if (data.level == 3) { |
| | | icon = "md-radio-button-on"; |
| | | } else { |
| | | icon = "md-radio-button-off"; |
| | | } |
| | | return h( |
| | | "span", |
| | | { |
| | | style: { |
| | | display: "inline-block", |
| | | cursor: "pointer", |
| | | }, |
| | | on: { |
| | | click: () => { |
| | | if (data.status == -1) { |
| | | return; |
| | | } |
| | | data.checked = !data.checked; |
| | | }, |
| | | }, |
| | | }, |
| | | [ |
| | | h("span", [ |
| | | h("Icon", { |
| | | props: { |
| | | type: icon, |
| | | size: "16", |
| | | }, |
| | | style: { |
| | | "margin-right": "8px", |
| | | "margin-bottom": "3px", |
| | | }, |
| | | }), |
| | | h("span", data.title), |
| | | ]), |
| | | ] |
| | | ); |
| | | }, |
| | | changePage(v) { |
| | | this.searchForm.pageNumber = v; |
| | | this.getDataList(); |
| | | this.clearSelectAll(); |
| | | }, |
| | | changePageSize(v) { |
| | | this.searchForm.pageSize = v; |
| | | this.getDataList(); |
| | | }, |
| | | changeSort(e) { |
| | | this.searchForm.sort = e.key; |
| | | this.searchForm.order = e.order; |
| | | if (e.order == "normal") { |
| | | this.searchForm.order = ""; |
| | | } |
| | | this.getDataList(); |
| | | }, |
| | | getDataList() { |
| | | this.loading = true; |
| | | if (this.value[0]!="" && this.value[1]!=""){ |
| | | this.searchForm.beginTime = this.selectDate(this.value[0]); |
| | | this.searchForm.endTime = this.selectDate(this.value[1]); |
| | | }else{ |
| | | this.searchForm.beginTime = ""; |
| | | this.searchForm.endTime = ""; |
| | | } |
| | | getCar(this.searchForm).then((res) => { |
| | | this.loading = false; |
| | | if (res.success) { |
| | | this.data = res.result; |
| | | this.total = res.result.length; |
| | | } |
| | | }); |
| | | }, |
| | | selectDate(dateData) { |
| | | let date = new Date (dateData) |
| | | let y = date . getFullYear() |
| | | let m = date . getMonth() + 1 |
| | | m=m<10?('0'+m):m |
| | | let d = date.getDate() |
| | | d = d< 10?('0'+ d):d |
| | | const time = y + '-' + m + '-' + d; |
| | | return time |
| | | }, |
| | | getPermList() { |
| | | this.treeLoading = true; |
| | | getAllPermissionList().then((res) => { |
| | | if (res.success) { |
| | | this.deleteDisableNode(res.result); |
| | | this.permData = res.result; |
| | | this.treeLoading = false; |
| | | } |
| | | this.treeLoading = false; |
| | | }); |
| | | }, |
| | | // 递归标记禁用节点 |
| | | deleteDisableNode(permData) { |
| | | let that = this; |
| | | permData.forEach(function (e) { |
| | | if (e.status == -1) { |
| | | e.title = "[已禁用] " + e.title; |
| | | e.disabled = true; |
| | | } |
| | | if (e.children && e.children.length > 0) { |
| | | that.deleteDisableNode(e.children); |
| | | } |
| | | }); |
| | | }, |
| | | carRole() { |
| | | this.roleModalVisible = false; |
| | | }, |
| | | submitAddOil() { |
| | | this.addOilForm.addDate = this.addDate; |
| | | this.$refs.addOilForm.validate((valid) => { |
| | | if (valid) { |
| | | if (this.modalType == 0) { |
| | | // 添加 |
| | | this.submitLoading = true; |
| | | addOil(this.addOilForm).then((res) => { |
| | | this.submitLoading = false; |
| | | if (res.success) { |
| | | this.$Message.success("操作成功"); |
| | | this.getDataList(); |
| | | this.roleModalVisible = false; |
| | | } |
| | | }); |
| | | } else { |
| | | this.submitLoading = true; |
| | | addOil(this.addOilForm).then((res) => { |
| | | this.submitLoading = false; |
| | | if (res.success) { |
| | | this.$Message.success("操作成功"); |
| | | this.getDataList(); |
| | | this.roleModalVisible = false; |
| | | } |
| | | }); |
| | | } |
| | | } |
| | | }); |
| | | }, |
| | | handleDropdown(name) { |
| | | if (name == "refresh") { |
| | | this.getDataList(); |
| | | } else if (name == "exportData") { |
| | | if (this.selectList.length <= 0) { |
| | | this.$Message.warning("您还未选择要导出的数据"); |
| | | return; |
| | | } |
| | | this.exportType = "part"; |
| | | this.exportModalVisible = true; |
| | | this.exportTitle = |
| | | "确认导出 " + this.selectList.length + " 条数据"; |
| | | } else if (name == "exportAll") { |
| | | this.exportType = "all"; |
| | | this.exportModalVisible = true; |
| | | this.exportTitle = "确认导出全部 " + this.total + " 条数据"; |
| | | getCar().then((res) => { |
| | | if (res.success) { |
| | | this.exportData = this.data; |
| | | } |
| | | }); |
| | | } else if (name == "importData") { |
| | | this.importModalVisible = true; |
| | | } |
| | | }, |
| | | //导出数据 |
| | | exportCustomData() { |
| | | if (this.filename == "") { |
| | | this.filename = "车辆数据"; |
| | | } |
| | | // 判断勾选导出列 |
| | | let exportColumns = []; |
| | | this.exportColumns.forEach((e) => { |
| | | exportColumns.push(e); |
| | | }); |
| | | this.exportModalVisible = false; |
| | | let title = []; |
| | | let key = []; |
| | | exportColumns.forEach((e) => { |
| | | title.push(e.title); |
| | | key.push(e.key); |
| | | }); |
| | | |
| | | |
| | | console.log(this.exportData) |
| | | const params = { |
| | | title: title, |
| | | key: key, |
| | | data: this.exportData, |
| | | autoWidth: true, |
| | | filename: this.filename, |
| | | }; |
| | | this.exportData.forEach((i) => { |
| | | i.areaName = i.car.areaName; |
| | | i.carNo = i.car.carNo; |
| | | i.addOilCode = i.car.addOilCode; |
| | | i.oil = i.car.oil; |
| | | i.nickName = i.car.nickName; |
| | | i.mileage=i.endMileage-i.beginMileage; |
| | | if (i.oilWear!=0 && i.mileage!=0){ |
| | | i.oil=parseFloat((i.oilWear/i.mileage*100).toFixed(2)); |
| | | }else { |
| | | i.oil=0 |
| | | } |
| | | }); |
| | | excel.export_array_to_excel(params); |
| | | }, |
| | | submitRemove(){ |
| | | this.$refs.removeForm.validate((valid) => { |
| | | if (valid) { |
| | | this.submitLoading = true; |
| | | editCar(this.removeForm).then((res) => { |
| | | this.submitLoading = false; |
| | | if (res.success) { |
| | | this.$Message.success("操作成功"); |
| | | this.getDataList(); |
| | | this.carModalVisible = false; |
| | | } |
| | | }); |
| | | } |
| | | }); |
| | | }, |
| | | addOil() { |
| | | this.getAllCar(); |
| | | this.modalType = 0; |
| | | this.modalTitle = "添加加油记录"; |
| | | this.$refs.addOilForm.resetFields(); |
| | | delete this.addOilForm.id; |
| | | this.roleModalVisible = true; |
| | | }, |
| | | edit(v) { |
| | | this.getAllCar(); |
| | | this.addDate = v.addDate; |
| | | this.modalType = 1; |
| | | this.modalTitle = "编辑加油信息"; |
| | | this.$refs.addOilForm.resetFields(); |
| | | // 转换null为"" |
| | | for (let attr in v) { |
| | | if (v[attr] == null) { |
| | | v[attr] = ""; |
| | | } |
| | | } |
| | | let str = JSON.stringify(v); |
| | | let roleInfo = JSON.parse(str); |
| | | |
| | | this.addOilForm = roleInfo; |
| | | this.roleModalVisible = true; |
| | | }, |
| | | removeCar(v) { |
| | | this.dataType = 0; |
| | | this.modalTitle = "移除车辆"; |
| | | this.$refs.addOilForm.resetFields(); |
| | | // 转换null为"" |
| | | for (let attr in v) { |
| | | if (v[attr] == null) { |
| | | v[attr] = ""; |
| | | } |
| | | } |
| | | let str = JSON.stringify(v); |
| | | let roleInfo = JSON.parse(str); |
| | | roleInfo.status=1 |
| | | this.removeForm = roleInfo; |
| | | this.carModalVisible = true; |
| | | |
| | | }, |
| | | getAllCar(){ |
| | | getAll().then((res) => { |
| | | if(res.success){ |
| | | this.carList = res.result; |
| | | console.log(this.carList); |
| | | } |
| | | }); |
| | | }, |
| | | remove(v) { |
| | | this.$Modal.confirm({ |
| | | title: "确认删除", |
| | | content: "您确认要删除吗 ", |
| | | loading: true, |
| | | onOk: () => { |
| | | deleteSuggest({ ids: v.id }).then((res) => { |
| | | this.$Modal.remove(); |
| | | if (res.success) { |
| | | this.clearSelectAll(); |
| | | this.$Message.success("删除成功"); |
| | | this.getDataList(); |
| | | } |
| | | }); |
| | | }, |
| | | }); |
| | | }, |
| | | setDefault(v) { |
| | | this.loading = true; |
| | | let params = { |
| | | id: v.id, |
| | | isDefault: true, |
| | | }; |
| | | setDefaultRole(params).then((res) => { |
| | | this.loading = false; |
| | | if (res.success) { |
| | | this.$Message.success("操作成功"); |
| | | this.getDataList(); |
| | | } |
| | | }); |
| | | }, |
| | | cancelDefault(v) { |
| | | this.loading = true; |
| | | let params = { |
| | | id: v.id, |
| | | isDefault: false, |
| | | }; |
| | | setDefaultRole(params).then((res) => { |
| | | this.loading = false; |
| | | if (res.success) { |
| | | this.$Message.success("操作成功"); |
| | | this.getDataList(); |
| | | } |
| | | }); |
| | | }, |
| | | clearSelectAll() { |
| | | this.$refs.table.selectAll(false); |
| | | }, |
| | | |
| | | changeSelect(e) { |
| | | this.exportData = e; |
| | | this.selectList = e; |
| | | }, |
| | | delAll() { |
| | | if (this.selectList.length <= 0) { |
| | | this.$Message.warning("您还未选择要删除的数据"); |
| | | return; |
| | | } |
| | | this.$Modal.confirm({ |
| | | title: "确认删除", |
| | | content: "您确认要删除所选的 " + this.selectList.length + " 条数据?", |
| | | loading: true, |
| | | onOk: () => { |
| | | let ids = ""; |
| | | this.selectList.forEach(function (e) { |
| | | ids += e.id + ","; |
| | | }); |
| | | ids = ids.substring(0, ids.length - 1); |
| | | deleteCar({ ids: ids }).then((res) => { |
| | | this.$Modal.remove(); |
| | | if (res.success) { |
| | | this.$Message.success("删除成功"); |
| | | this.clearSelectAll(); |
| | | this.getDataList(); |
| | | } |
| | | }); |
| | | }, |
| | | }); |
| | | }, |
| | | editPerm(v) { |
| | | this.editRolePermId = v.id; |
| | | this.modalTitle = "分配 " + v.name + " 的菜单权限"; |
| | | // 匹配勾选 |
| | | let rolePerms = v.permissions; |
| | | if (this.treeLoading) { |
| | | this.$Message.warning("菜单权限数据加载中,请稍后点击查看"); |
| | | return; |
| | | } |
| | | // 递归判断子节点 |
| | | this.checkPermTree(this.permData, rolePerms); |
| | | this.permModalVisible = true; |
| | | }, |
| | | // 递归判断子节点 |
| | | checkPermTree(permData, rolePerms) { |
| | | let that = this; |
| | | permData.forEach(function (p) { |
| | | if (that.hasPerm(p, rolePerms) && p.status != -1) { |
| | | p.checked = true; |
| | | } else { |
| | | p.checked = false; |
| | | } |
| | | if (p.children && p.children.length > 0) { |
| | | that.checkPermTree(p.children, rolePerms); |
| | | } |
| | | }); |
| | | }, |
| | | // 判断角色拥有的权限节点勾选 |
| | | hasPerm(p, rolePerms) { |
| | | let flag = false; |
| | | for (let i = 0; i < rolePerms.length; i++) { |
| | | if (p.id == rolePerms[i].permissionId) { |
| | | flag = true; |
| | | break; |
| | | } |
| | | } |
| | | if (flag) { |
| | | return true; |
| | | } |
| | | return false; |
| | | }, |
| | | // 全选反选 |
| | | selectTreeAll() { |
| | | this.selectAllFlag = !this.selectAllFlag; |
| | | let select = this.selectAllFlag; |
| | | this.selectedTreeAll(this.permData, select); |
| | | }, |
| | | // 递归全选节点 |
| | | selectedTreeAll(permData, select) { |
| | | let that = this; |
| | | permData.forEach(function (e) { |
| | | e.checked = select; |
| | | if (e.children && e.children.length > 0) { |
| | | that.selectedTreeAll(e.children, select); |
| | | } |
| | | }); |
| | | }, |
| | | submitPermEdit() { |
| | | this.submitPermLoading = true; |
| | | let permIds = ""; |
| | | let selectedNodes = this.$refs.tree.getCheckedNodes(); |
| | | selectedNodes.forEach(function (e) { |
| | | permIds += e.id + ","; |
| | | }); |
| | | permIds = permIds.substring(0, permIds.length - 1); |
| | | editRolePerm({ |
| | | roleId: this.editRolePermId, |
| | | permIds: permIds, |
| | | }).then((res) => { |
| | | this.submitPermLoading = false; |
| | | if (res.success) { |
| | | this.$Message.success("操作成功"); |
| | | // 标记重新获取菜单数据 |
| | | this.$store.commit("setAdded", false); |
| | | util.initRouter(this); |
| | | this.getDataList(); |
| | | this.permModalVisible = false; |
| | | } |
| | | }); |
| | | }, |
| | | cancelPermEdit() { |
| | | this.permModalVisible = false; |
| | | }, |
| | | loadData(item, callback) { |
| | | loadDepartment(item.id, { openDataFilter: false }).then((res) => { |
| | | if (res.success) { |
| | | res.result.forEach(function (e) { |
| | | e.selected = false; |
| | | if (e.isParent) { |
| | | e.loading = false; |
| | | e.children = []; |
| | | } |
| | | if (e.status == -1) { |
| | | e.title = "[已禁用] " + e.title; |
| | | e.disabled = true; |
| | | } |
| | | }); |
| | | callback(res.result); |
| | | } |
| | | }); |
| | | }, |
| | | expandCheckDep(v) { |
| | | // 判断展开子节点 |
| | | this.checkDepTree(v.children, this.editDepartments); |
| | | }, |
| | | // 判断子节点 |
| | | checkDepTree(depData, roleDepIds) { |
| | | let that = this; |
| | | depData.forEach(function (p) { |
| | | if (that.hasDepPerm(p, roleDepIds)) { |
| | | p.selected = true; |
| | | } else { |
| | | p.selected = false; |
| | | } |
| | | }); |
| | | }, |
| | | // 判断角色拥有的权限节点勾选 |
| | | hasDepPerm(p, roleDepIds) { |
| | | let flag = false; |
| | | for (let i = 0; i < roleDepIds.length; i++) { |
| | | if (p.id == roleDepIds[i].departmentId) { |
| | | flag = true; |
| | | break; |
| | | } |
| | | } |
| | | if (flag) { |
| | | return true; |
| | | } |
| | | return false; |
| | | }, |
| | | submitDepEdit() { |
| | | let depIds = ""; |
| | | if (this.dataType == 1) { |
| | | let selectedNodes = this.$refs.depTree.getSelectedNodes(); |
| | | selectedNodes.forEach(function (e) { |
| | | depIds += e.id + ","; |
| | | }); |
| | | depIds = depIds.substring(0, depIds.length - 1); |
| | | } |
| | | this.submitDepLoading = true; |
| | | editRoleDep({ |
| | | roleId: this.editRolePermId, |
| | | dataType: this.dataType, |
| | | depIds: depIds, |
| | | }).then((res) => { |
| | | this.submitDepLoading = false; |
| | | if (res.success) { |
| | | this.$Message.success("操作成功"); |
| | | this.getDataList(); |
| | | this.depModalVisible = false; |
| | | } |
| | | }); |
| | | }, |
| | | changeOpen(v) { |
| | | if (v == "0") { |
| | | this.permData.forEach((e) => { |
| | | e.expand = true; |
| | | if (e.children && e.children.length > 0) { |
| | | e.children.forEach((c) => { |
| | | c.expand = true; |
| | | if (c.children && c.children.length > 0) { |
| | | c.children.forEach(function (b) { |
| | | b.expand = true; |
| | | }); |
| | | } |
| | | }); |
| | | } |
| | | }); |
| | | } else if (v == "1") { |
| | | this.permData.forEach((e) => { |
| | | e.expand = false; |
| | | if (e.children && e.children.length > 0) { |
| | | e.children.forEach((c) => { |
| | | c.expand = false; |
| | | if (c.children && c.children.length > 0) { |
| | | c.children.forEach(function (b) { |
| | | b.expand = false; |
| | | }); |
| | | } |
| | | }); |
| | | } |
| | | }); |
| | | } else if (v == "2") { |
| | | this.permData.forEach((e) => { |
| | | e.expand = true; |
| | | if (e.children && e.children.length > 0) { |
| | | e.children.forEach((c) => { |
| | | c.expand = false; |
| | | if (c.children && c.children.length > 0) { |
| | | c.children.forEach(function (b) { |
| | | b.expand = false; |
| | | }); |
| | | } |
| | | }); |
| | | } |
| | | }); |
| | | } else if (v == "3") { |
| | | this.permData.forEach((e) => { |
| | | e.expand = true; |
| | | if (e.children && e.children.length > 0) { |
| | | e.children.forEach((c) => { |
| | | c.expand = true; |
| | | if (c.children && c.children.length > 0) { |
| | | c.children.forEach(function (b) { |
| | | b.expand = false; |
| | | }); |
| | | } |
| | | }); |
| | | } |
| | | }); |
| | | } |
| | | }, |
| | | }, |
| | | mounted() { |
| | | this.maxHeight = Number(document.documentElement.clientHeight - 121) + "px"; |
| | | this.init(); |
| | | }, |
| | | }; |
| | | </script> |
New file |
| | |
| | | export const exportColumn = [ |
| | | { |
| | | title: "送货线路", |
| | | key: "areaName", |
| | | width: 130, |
| | | }, |
| | | { |
| | | title: "车牌号", |
| | | key: "carNo", |
| | | width: 120, |
| | | }, |
| | | { |
| | | title: "加油卡号", |
| | | key: "addOilCode", |
| | | width: 140, |
| | | sortable: true, |
| | | }, |
| | | { |
| | | title: "起始里程", |
| | | key: "beginMileage", |
| | | width: 130, |
| | | }, |
| | | { |
| | | title: "期末里程", |
| | | key: "endMileage", |
| | | width: 130, |
| | | }, |
| | | { |
| | | title: "月行驶里程", |
| | | key: "mileage", |
| | | width: 130, |
| | | }, |
| | | { |
| | | title: "月油耗", |
| | | key: "oilWear", |
| | | width: 130, |
| | | }, |
| | | { |
| | | title: "百公里油耗", |
| | | key: "oil", |
| | | width: 130, |
| | | }, |
| | | { |
| | | title: "驾驶员", |
| | | key: "nickName", |
| | | width: 120, |
| | | }, |
| | | { |
| | | title: "月加油金额", |
| | | key: "money", |
| | | width: 120, |
| | | } |
| | | ] |
| | |
| | | <div class="search"> |
| | | <Card> |
| | | <Row class="operation"> |
| | | <Button @click="addOil" type="primary" icon="md-add">添加加油记录</Button> |
| | | <Button @click="init" icon="md-refresh">刷新</Button> |
| | | <Button type="dashed" @click="openTip = !openTip">{{ |
| | | openTip ? "关闭提示" : "开启提示" |
| | | }}</Button> |
| | | <Input |
| | | v-model="searchForm.carNo" |
| | | v-model="searchForm.content" |
| | | suffix="ios-search" |
| | | @on-change="getDataList" |
| | | placeholder="输入车牌号搜索" |
| | | placeholder="输入反馈内容搜索" |
| | | clearable |
| | | style="width: 250px" |
| | | /> |
| | |
| | | getCarList, |
| | | editCar, |
| | | deleteCar, |
| | | getSuggest, |
| | | deleteSuggest, |
| | | } from "@/api/open"; |
| | | import util from "@/libs/util.js"; |
| | | export default { |
| | |
| | | }, |
| | | { |
| | | title: "意见分类", |
| | | key: "dictDataId", |
| | | key: "title", |
| | | width: 150, |
| | | }, |
| | | { |
| | |
| | | { |
| | | title: "反馈时间", |
| | | key: "createTime", |
| | | width: 180, |
| | | width: 240, |
| | | sortable: true, |
| | | }, |
| | | { |
| | | title: "反馈商户", |
| | | key: "customerId", |
| | | key: "name", |
| | | width: 150, |
| | | }, |
| | | { |
| | | title: "操作", |
| | | key: "action", |
| | | align: "center", |
| | | width: 195, |
| | | render: (h, params) => { |
| | | return h("div", [ |
| | | h( |
| | |
| | | }, |
| | | getDataList() { |
| | | this.loading = true; |
| | | getAddOilList(this.searchForm).then((res) => { |
| | | getSuggest(this.searchForm).then((res) => { |
| | | this.loading = false; |
| | | if (res.success) { |
| | | this.data = res.result.records; |
| | |
| | | content: "您确认要删除吗 ", |
| | | loading: true, |
| | | onOk: () => { |
| | | deleteAddOil({ ids: v.id }).then((res) => { |
| | | deleteSuggest({ ids: v.id }).then((res) => { |
| | | this.$Modal.remove(); |
| | | if (res.success) { |
| | | this.clearSelectAll(); |