张海宁 2023-12-05 16:58:38 +08:00
commit 350130aa81
4 changed files with 924 additions and 27 deletions

View File

@ -5,8 +5,8 @@
"author": "Micheal", "author": "Micheal",
"license": "MIT", "license": "MIT",
"scripts": { "scripts": {
"dev": "vue-cli-service serve", "dev": "SET NODE_OPTIONS=--openssl-legacy-provider && vue-cli-service serve",
"build:prod": "vue-cli-service build", "build:prod": "SET NODE_OPTIONS=--openssl-legacy-provider && vue-cli-service build",
"build:stage": "vue-cli-service build --mode staging", "build:stage": "vue-cli-service build --mode staging",
"preview": "node build/index.js --preview", "preview": "node build/index.js --preview",
"lint": "eslint --ext .js,.vue src" "lint": "eslint --ext .js,.vue src"

View File

@ -0,0 +1,48 @@
import request from '@/utils/request'
export function getFirmList(form) {
return request({
url: '/firm/company/firm/firmInfoList',
method: 'post',
data:form
})
}
export function delCar(firmId) {
return request({
url: '/firm?firmId='+firmId,
method: 'post'
})
}
export function updateCar(carForm) {
return request({
url: '/history/car/updateCar',
method: 'post',
data:carForm
})
}
export function insertCar(carInsert) {
return request({
url: '/history/car/insertCar',
method: 'post',
data:carInsert
})
}
export function getList() {
return request({
url: '/history/listHistoricalTrack',
method: 'get'
})
}
export function deleteRecord(recordId) {
return request({
url: '/history/delHistoricalTrack?recordId='+recordId,
method: 'post',
data:recordId
})
}

View File

@ -1,14 +1,864 @@
<script setup>
</script>
<template> <template>
<div> <div>
<el-button>点击公司</el-button> <div v-show="!isShow">
<div id="container" ></div>
<el-button type="primary" @click="isShowAll"></el-button>
</div> </div>
<div v-show="!isList">
<el-form :model="form" ref="myForm">
<table style="width: 100%">
<tr>
<td>企业名称:</td>
<td>
<el-input v-model="form.firmName" size="medium" style="width: 100%;"></el-input>
</td>
<td>企业电话:</td>
<td>
<el-input v-model="form.firmTel" size="medium" style="width: 100%;"></el-input>
</td>
<td>企业详细地址:</td>
<td>
<el-input v-model="form.firmAddress" size="medium" style="width: 100%;"></el-input>
</td>
<td>法定代表人电话:</td>
<td>
<el-input v-model="form.firmRepresentativePhone" size="medium" style="width: 100%;"></el-input>
</td>
<td>银行账号:</td>
<td>
<el-input v-model="form.firmBankAccount" size="medium" style="width: 100%;"></el-input>
</td>
<td>统一社会信用代码:</td>
<td>
<el-input v-model="form.firmSocialCredit" size="medium" style="width: 100%;"></el-input>
</td>
<td>法人代表身份证号:</td>
<td>
<el-input v-model="form.firmRepresentativeId" size="medium" style="width: 100%;"></el-input>
</td>
<td>企业法人代表:</td>
<td>
<el-input v-model="form.firmRepresentative" size="medium" style="width: 100%;"></el-input>
</td>
</tr>
<tr>
<td>
<el-button type="primary" @click="findForm" size="mini">搜索</el-button>
</td>
<td>
<el-button @click="resetForm" size="mini">重置</el-button>
</td>
</tr>
</table>
</el-form>
<br><br>
<div style="text-align: right;">
<button type="submit" @click="refreshTable"></button>
</div>
<el-table :data="firmList"
element-loading-text="Loading"
border
fit
highlight-current-row>
<el-table-column label="企业编号">
<template slot-scope="scope">
{{scope.row.firmId}}
</template>
</el-table-column>
<el-table-column label="企业名称">
<template slot-scope="scope">
{{scope.row.firmName}}
</template>
</el-table-column>
<el-table-column label="企业电话">
<template slot-scope="scope">
{{scope.row.firmTel}}
</template>
</el-table-column>
<el-table-column label="企业详情地址">
<template slot-scope="scope">
{{scope.row.firmAddress}}
</template>
</el-table-column>
<el-table-column label="企业法定代表人">
<template slot-scope="scope">
{{scope.row.firmRepresentative}}
</template>
</el-table-column>
<el-table-column label="企业法定代表人手机号码">
<template slot-scope="scope">
{{scope.row.firmRepresentativePhone}}
</template>
</el-table-column>
<el-table-column label="法定代表人身份证号码">
<template slot-scope="scope">
{{scope.row.firmRepresentativeId}}
</template>
</el-table-column>
<el-table-column label="开户行名称">
<template slot-scope="scope">
{{scope.row.firmBank}}
</template>
</el-table-column>
<el-table-column label="开户行支行">
<template slot-scope="scope">
{{scope.row.firmBankBranch}}
</template>
</el-table-column>
<el-table-column label="银行账号">
<template slot-scope="scope">
{{scope.row.firmBankAccount}}
</template>
</el-table-column>
<el-table-column label="营业执照号">
<template slot-scope="scope">
{{scope.row.firmBusinessLicense}}
</template>
</el-table-column>
<el-table-column label="统一社会信用代码">
<template slot-scope="scope">
{{scope.row.firmSocialCredit}}
</template>
</el-table-column>
<el-table-column label="操作">
<template slot-scope="scope">
<el-button type="primary" @click="updateFirmList(scope.row)"></el-button>
<el-button type="primary" @click="delCar(scope.row.carVin)"></el-button>
</template>
</el-table-column>
</el-table>
<div style="text-align: right;">
<el-pagination
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="this.form.pageNum"
:page-sizes="[3, 5, 7, 10]"
:page-size="this.form.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="total">
</el-pagination>
</div>
<el-dialog :visible.sync="dialogVisible" width="30%">
<el-form :model="firmForm">
<el-form-item label="企业编号">
<el-input v-model="firmForm.firmId" readonly></el-input>
</el-form-item>
<el-form-item label="企业名称">
<el-input v-model="firmForm.firmName" readonly></el-input>
</el-form-item>
<el-form-item label="企业电话">
<el-input v-model="firmForm.firmTel" readonly placeholder="请输入企业电话"></el-input>
</el-form-item>
<el-form-item label="企业详情地址">
<el-input v-model="firmForm.firmAddress" readonly placeholder="请输入企业详情地址"></el-input>
</el-form-item>
<el-form-item label="企业法定代表人">
<el-input v-model="firmForm.firmRepresentative" readonly placeholder="请输入企业法定代表人"></el-input>
</el-form-item>
<el-form-item label="法定代表人手机号码">
<el-input v-model="firmForm.firmRepresentativePhone" readonly placeholder="请输入法定代表人手机号码"></el-input>
</el-form-item>
<el-form-item label="法定代表人身份证号码">
<el-input v-model="firmForm.firmRepresentativeId" readonly placeholder="请输入法定代表人身份证号"></el-input>
</el-form-item>
<el-form-item label="开户行名称">
<el-input v-model="firmForm.firmBank" readonly placeholder="请输入开户行名称"></el-input>
</el-form-item>
<el-form-item label="开户行支行">
<el-input v-model="firmForm.firmBankBranch" readonly placeholder="请输入开户行支行"></el-input>
</el-form-item>
<el-form-item label="银行账号">
<el-input v-model="firmForm.firmBankAccount" readonly placeholder="请输入银行账号"></el-input>
</el-form-item>
<el-form-item label="营业执照号">
<el-input v-model="firmForm.firmBusinessLicense" readonly placeholder="请输入营业执照"></el-input>
</el-form-item>
<el-form-item label="统一社会信用代码">
<el-input v-model="firmForm.firmSocialCredit" readonly placeholder="请输入统一社会信用代码"></el-input>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="dialogVisible = false"> </el-button>
<el-button type="primary" @click="updateCar"></el-button>
</span>
</el-dialog>
<el-button type="primary" @click="tapInsert"></el-button>
<el-dialog :visible.sync="dialogVisibleTwo" width="30%">
<el-form :model="firmInsert">
<el-form-item label="企业名称">
<el-input v-model="firmInsert.firmName" placeholder="请输入企业名称"></el-input>
</el-form-item>
<el-form-item label="企业电话">
<el-input v-model="firmInsert.firmTel" placeholder="请输入企业电话"></el-input>
</el-form-item>
<el-form-item label="企业详情地址">
<el-input v-model="firmInsert.firmAddress" placeholder="请输入企业详情地址"></el-input>
</el-form-item>
<el-form-item label="企业法定代表人">
<el-input v-model="firmInsert.firmRepresentative" placeholder="请输入企业法定代表人"></el-input>
</el-form-item>
<el-form-item label="法定代表人手机号码">
<el-input v-model="firmInsert.firmRepresentativePhone" placeholder="请输入法定代表人手机号码"></el-input>
</el-form-item>
<el-form-item label="法定代表人身份证号">
<el-input v-model="firmInsert.firmRepresentativeId" placeholder="请输入法定代表人身份证号"></el-input>
</el-form-item>
<el-form-item label="开户行名称">
<el-input v-model="firmInsert.firmBank" placeholder="请输入开户行名称"></el-input>
</el-form-item>
<el-form-item label="开户行支行">
<el-input v-model="firmInsert.firmBankBranch" placeholder="请输入开户行支行"></el-input>
</el-form-item>
<el-form-item label="银行账号">
<el-input v-model="firmInsert.firmBankAccount" placeholder="请输入银行账号"></el-input>
</el-form-item>
<el-form-item label="营业执照号">
<el-input v-model="firmInsert.firmBusinessLicense" placeholder="请输入营业执照号"></el-input>
</el-form-item>
<el-form-item label="统一社会信用代码">
<el-input v-model="firmInsert.firmSocialCredit" placeholder="请输入统一社会信用代码"></el-input>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="dialogVisibleTwo = false"> </el-button>
<el-button type="primary" @click="insertFirm"></el-button>
</span>
</el-dialog>
</div>
</div>
</template> </template>
<style scoped lang="scss"> <script>
import {getFirmList} from "@/api/firmtable";
export default {
data() {
return {
firmList:[],
total:0,
form:{
pageNum:1,
pageSize:10,
firmName:null,
firmTel:null,
firmAddress:null,
firmRepresentativePhone:null,
firmBankAccount:null,
firmSocialCredit:null,
firmRepresentativeId:null,
firmRepresentative:null,
},
firmForm:{
firmId:null,
firmName:null,
firmTel:null,
firmAddress:null,
firmRepresentative:null,
firmRepresentativePhone:null,
firmRepresentativeId:null,
firmBank:null,
firmBankBranch:null,
firmBankAccount:null,
firmBusinessLicense:null,
firmSocialCredit:null
},
firmInsert:{
firmId:null,
firmName:null,
firmTel:null,
firmAddress:null,
firmRepresentative:null,
firmRepresentativePhone:null,
firmRepresentativeId:null,
firmBank:null,
firmBankBranch:null,
firmBankAccount:null,
firmBusinessLicense:null,
firmSocialCredit:null,
},
dialogVisible:false,
dialogVisibleTwo:false,
isShow:true,
isList:false
};
},
mounted() {
},
created() {
this.getList()
},
methods: {
/*重置表单*/
resetForm() {
this.form = { // form
firmName: '', //
firmTel: '', //
firmAddress: '', //
firmRepresentativePhone: '', //
firmBankAccount: '', //
firmSocialCredit: '', //
firmRepresentativeId: '', //
firmRepresentative: '', //
};
this.$refs.myForm.resetFields(); //
},
isShowAll(){
this.isShow = true
this.isList = false
// this.map.destroy();//
location.reload()
},
insertFirm(){
insertFirm(this.firmInsert).then(res=>{
if(res.code === 200){
this.$message.success("添加成功!")
location.reload()
}
})
},
tapInsert(){
this.dialogVisibleTwo = true
},
updateFirmList(firm){
this.dialogVisible = true
this.firmForm = firm
console.log(this.firmForm)
},
/*刷新*/
refreshTable(){
this.getList()
},
handleSizeChange(val) {
this.form.pageSize=val
this.getList()
},
handleCurrentChange(val) {
this.form.pageNum=val
this.getList()
},
/*车辆列表*/
getList(){
getFirmList(this.form).then(response => {
console.log(response)
this.firmList = response.data.list
this.total = response.data.total
}).catch(err=>{
this.$message.error(err.message)
console.log(err);
})
},
delCar(carVin){
this.carVin = carVin
delCar(this.carVin).then(res=>{
if(res.code === 200){
this.$message.success("删除成功!")
location.reload()
}
})
},
updateCar(){
updateCar(this.carForm).then(res=>{
if(res.code === 200){
this.$message.success("修改成功!")
location.reload()
}
})
},
/*表单查询*/
findForm(){
this.getList()
},
}
}
</script>
<style scoped lang="scss">
#container{
padding:0px;
margin: 0px;
width: 100%;
height: 800px;
}
html {
font-size: 12px;
}
.amap-copyright{
box-sizing: content-box
}
* {
box-sizing: border-box
}
.input-textarea{
color:grey;
height:8em;
overflow:auto;
border-radius:0.4rem;
border:1px solid #ced4da;
margin-bottom:1rem;
}
body {
margin: 0;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
line-height: 1.5;
font-weight: 300;
color: #111213;
}
hr {
margin: 0.5rem 0;
box-sizing: content-box;
height: 0;
overflow: visible;
border: 0;
border-top: 1px solid rgba(0, 0, 0, .1)
}
p {
margin-top: 0;
margin-bottom: 0;
}
label {
display: inline-block;
margin-bottom: 0.4rem;
}
label, .btn {
margin-left: 0;
font-size: 1rem;
}
button, input, select {
margin: 0;
font-family: inherit;
font-size: inherit;
line-height: inherit;
overflow: visible;
text-transform: none
}
[type=button]::-moz-focus-inner, [type=reset]::-moz-focus-inner, [type=submit]::-moz-focus-inner, button::-moz-focus-inner {
padding: 0;
border-style: none;
}
input[type=checkbox], input[type=radio] {
box-sizing: border-box;
padding: 0;
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding: 0;
margin: 0 0.5rem 0 0;
}
h4 {
font-family: inherit;
line-height: 1.8;
font-weight: 300;
color: inherit;
font-size: 1.1rem;
margin-top: 0;
margin-bottom: .5rem
}
.btn {
display: inline-block;
font-weight: 400;
text-align: center;
white-space: nowrap;
vertical-align: middle;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
border: 1px solid transparent;
transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
background-color: transparent;
background-image: none;
color: #25A5F7;
border-color: #25A5F7;
padding: .25rem .5rem;
line-height: 1.5;
border-radius: 1rem;
-webkit-appearance: button;
cursor:pointer;
}
.btn:hover {
color: #fff;
background-color: #25A5F7;
border-color: #25A5F7
}
.btn:hover {
text-decoration: none
}
.input-item {
position: relative;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-ms-flex-align: center;
align-items: center;
width: 100%;
height: 3rem;
}
.input-item:last-child {
margin-bottom: 0;
}
.input-item>select, .input-item>input[type=text], .input-item>input[type=date] {
position: relative;
-ms-flex: 1 1 auto;
flex: 1 1 auto;
width: 1%;
margin-bottom: 0;
}
.input-item>select:not(:last-child), .input-item>input[type=text]:not(:last-child), .input-item>input[type=date]:not(:last-child) {
border-top-right-radius: 0;
border-bottom-right-radius: 0
}
.input-item>select:not(:first-child), .input-item>input[type=text]:not(:first-child), .input-item>input[type=date]:not(:first-child) {
border-top-left-radius: 0;
border-bottom-left-radius: 0
}
.input-item-prepend {
margin-right: -1px;
}
.input-item-text, input[type=text],input[type=date], select {
height: calc(2.2rem + 2px);
}
.input-item-text {
width: 6rem;
text-align: justify;
padding: 0.4rem 0.7rem;
display: inline-block;
text-justify: distribute-all-lines;
/*ie6-8*/
text-align-last: justify;
/* ie9*/
-moz-text-align-last: justify;
/*ff*/
-webkit-text-align-last: justify;
/*chrome 20+*/
-ms-flex-align: center;
align-items: center;
margin-bottom: 0;
font-size: 1rem;
font-weight: 400;
line-height: 1.5;
color: #495057;
text-align: center;
white-space: nowrap;
background-color: #e9ecef;
border: 1px solid #ced4da;
border-radius: .25rem;
border-bottom-right-radius: 0;
border-top-right-radius: 0;
}
.input-item-text input[type=checkbox], .input-item-text input[type=radio] {
margin-top: 0
}
.input-card {
display: flex;
flex-direction: column;
min-width: 0;
word-wrap: break-word;
background-color: #fff;
background-clip: border-box;
border-radius: .25rem;
width: 22rem;
border-width: 0;
border-radius: 0.4rem;
box-shadow: 0 2px 6px 0 rgba(114, 124, 245, .5);
position: fixed;
bottom: 1rem;
right: 1rem;
-ms-flex: 1 1 auto;
flex: 1 1 auto;
padding: 0.75rem 1.25rem;
}
.input-text {
line-height: 2rem;
margin-right: 2rem;
}
.info hr {
margin-right: 0;
margin-left: 0;
border-top-color: grey;
}
.info {
padding: .75rem 1.25rem;
margin-bottom: 1rem;
border-radius: .25rem;
position: fixed;
top: 1rem;
background-color: white;
width: auto;
min-width: 22rem;
border-width: 0;
right: 1rem;
box-shadow: 0 2px 6px 0 rgba(114, 124, 245, .5);
}
.code {
left: 1.5rem;
right: 1.5rem;
top: 1.5rem;
bottom: 1.5rem;
overflow: auto;
margin-bottom: 0rem;
}
.code .btn {
top: 1rem;
position: absolute;
right: 1rem;
}
.code .result {
border: 1px solid rgba(0, 0, 0, 0.1);
border-radius: 0.5rem;
padding: 1rem;
bottom: 1rem;
position: absolute;
top: 5.5rem;
right: 1rem;
left: 1rem;
overflow: auto;
}
.code .status {
color: #80adff;
display: inline-block;
font-size: 14px;
}
.code h4 {
display: inline-block;
max-width: 20rem;
margin-right: 1rem;
margin-bottom: 1rem;
}
select, input[type=text], input[type=date] {
display: inline-block;
width: 100%;
padding: .375rem 1.75rem .375rem .75rem;
line-height: 1.5;
color: #495057;
vertical-align: middle;
background: #fff url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='%23343a40' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E") no-repeat right .75rem center;
background-size: 8px 10px;
border: 1px solid #ced4da;
border-radius: .25rem;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none
}
input[type=text],input[type=date] {
background: #fff;
padding: .375rem .75rem;
}
select:focus, input[type=text]:focus, input[type=date]:focus {
border-color: #80bdff;
outline: 0;
box-shadow: 0 0 0 .1rem rgba(128, 189, 255, .1)
}
.btn:focus {
outline: 0;
box-shadow: none;
}
select:focus::-ms-value, input[type=text]:focus::-ms-value,input[type=date]:focus::-ms-value {
color: #495057;
background-color: #fff
}
/* native toastr */
.native-toast {
position: fixed;
background-color: rgba(50, 50, 50, .8);
border-radius: 33px;
color: white;
left: 50%;
text-align: center;
padding: 6px 12px;
opacity: 0;
z-index: 99999;
transition: transform .25s, opacity .25s, top .25s;
box-sizing: border-box;
}
.native-toast-bottom {
bottom: 50px;
-ms-transform: translateX(-50%) translateY(50px);
transform: translateX(-50%) translateY(50px)
}
.native-toast-bottom.native-toast-shown {
opacity: 1;
-ms-transform: translateX(-50%) translateY(0);
transform: translateX(-50%) translateY(0);
}
.native-toast-bottom.native-toast-edge {
bottom: 0;
}
.native-toast-top {
top: 50px;
-ms-transform: translateX(-50%) translateY(-50px);
transform: translateX(-50%) translateY(-50px)
}
.native-toast-top.native-toast-shown {
opacity: 1;
-ms-transform: translateX(-50%) translateY(0);
transform: translateX(-50%) translateY(0);
}
.native-toast-top.native-toast-edge {
top: 0;
}
.native-toast-center {
top: 0;
-ms-transform: translateX(-50%) translateY(-50px);
transform: translateX(-50%) translateY(-50px)
}
.native-toast-center.native-toast-shown {
opacity: 1;
top: 50%;
-ms-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
}
.native-toast-edge {
border-radius: 0;
width: 100%;
text-align: left;
}
@media screen and (min-width: 40rem) {
.native-toast:not(.native-toast-edge) {
max-width: 18rem;
}
}
/*
max-width does not seem to work in small screen?
*/
/*@media screen and (max-width: 768px) {
.native-toast:not(.native-toast-edge) {
max-width: 400px;
}
}
@media screen and (max-width: 468px) {
.native-toast:not(.native-toast-edge) {
max-width: 300px;
}
}*/
/* types */
.native-toast-error {
background-color: #d92727;
color: white;
}
.native-toast-success {
background-color: #62a465;
color: white;
}
.native-toast-warning {
background-color: #fdaf17;
color: white;
}
.native-toast-info {
background-color: #5060ba;
color: white;
}
[class^="native-toast-icon-"] {
vertical-align: middle;
margin-right: 8px
}
[class^="native-toast-icon-"] svg {
width: 16px;
height: 16px;
}
</style> </style>

View File

@ -105,23 +105,23 @@ export default {
}); });
this.map.add(this.marker) this.map.add(this.marker)
// // //
this.polyline = new AMap.Polyline({ // this.polyline = new AMap.Polyline({
path: this.lineArr, // path: this.lineArr,
showDir: true, // showDir: true,
strokeColor: "#28F", //线 // strokeColor: "#28F", //线
// strokeOpacity: 1, //线 // // strokeOpacity: 1, //线
strokeWeight: 6, //线 // strokeWeight: 6, //线
// strokeStyle: "solid" //线 // // strokeStyle: "solid" //线
}); // });
this.map.add(this.polyline) // this.map.add(this.polyline)
//
// // //
this.passedPolyline = new AMap.Polyline({ // this.passedPolyline = new AMap.Polyline({
strokeColor: "#AF5", //线 // strokeColor: "#AF5", //线
strokeWeight: 6, //线 // strokeWeight: 6, //线
}); // });
this.map.add(this.passedPolyline) // this.map.add(this.passedPolyline)
// marker // marker
this.marker.on('moving', (e) => { this.marker.on('moving', (e) => {
@ -154,7 +154,6 @@ export default {
<div> <div>
<p>{{currentObject}}</p> <p>{{currentObject}}</p>
<div> <div>
<el-form> <el-form>
<table style="width: 100% "> <table style="width: 100% ">
<tr> <tr>