购物车等 页面提交 接口调试
This commit is contained in:
BianLzhaoMin
parent
f46cd7b905
commit
eecfd0c0e0
|
|
@ -7,6 +7,8 @@ export {}
|
|||
|
||||
declare module 'vue' {
|
||||
export interface GlobalComponents {
|
||||
ElBreadcrumb: typeof import('element-plus/es')['ElBreadcrumb']
|
||||
ElBreadcrumbItem: typeof import('element-plus/es')['ElBreadcrumbItem']
|
||||
ElButton: typeof import('element-plus/es')['ElButton']
|
||||
ElCarousel: typeof import('element-plus/es')['ElCarousel']
|
||||
ElCarouselItem: typeof import('element-plus/es')['ElCarouselItem']
|
||||
|
|
@ -22,6 +24,7 @@ declare module 'vue' {
|
|||
ElIcon: typeof import('element-plus/es')['ElIcon']
|
||||
ElImage: typeof import('element-plus/es')['ElImage']
|
||||
ElInput: typeof import('element-plus/es')['ElInput']
|
||||
ElInputNumber: typeof import('element-plus/es')['ElInputNumber']
|
||||
ElMenu: typeof import('element-plus/es')['ElMenu']
|
||||
ElMenuItem: typeof import('element-plus/es')['ElMenuItem']
|
||||
ElOption: typeof import('element-plus/es')['ElOption']
|
||||
|
|
@ -34,6 +37,8 @@ declare module 'vue' {
|
|||
ElSelect: typeof import('element-plus/es')['ElSelect']
|
||||
ElTable: typeof import('element-plus/es')['ElTable']
|
||||
ElTableColumn: typeof import('element-plus/es')['ElTableColumn']
|
||||
ElTabPane: typeof import('element-plus/es')['ElTabPane']
|
||||
ElTabs: typeof import('element-plus/es')['ElTabs']
|
||||
ElTag: typeof import('element-plus/es')['ElTag']
|
||||
ElTimeline: typeof import('element-plus/es')['ElTimeline']
|
||||
ElTimelineItem: typeof import('element-plus/es')['ElTimelineItem']
|
||||
|
|
@ -43,6 +48,8 @@ declare module 'vue' {
|
|||
EquipDetailTable: typeof import('./src/components/equipDetailTable.vue')['default']
|
||||
FooterInfo: typeof import('./src/components/FooterInfo/index.vue')['default']
|
||||
FormComponent: typeof import('./src/components/FormComponent/index.vue')['default']
|
||||
Header: typeof import('./src/components/header/index.vue')['default']
|
||||
Hearder: typeof import('./src/components/hearder/index.vue')['default']
|
||||
Navmenu: typeof import('./src/components/Navmenu/index.vue')['default']
|
||||
PagingComponent: typeof import('./src/components/PagingComponent/index.vue')['default']
|
||||
RouterLink: typeof import('vue-router')['RouterLink']
|
||||
|
|
|
|||
3189
pnpm-lock.yaml
3189
pnpm-lock.yaml
File diff suppressed because it is too large
Load Diff
|
|
@ -0,0 +1,539 @@
|
|||
/* Logo 字体 */
|
||||
@font-face {
|
||||
font-family: "iconfont logo";
|
||||
src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834');
|
||||
src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834#iefix') format('embedded-opentype'),
|
||||
url('https://at.alicdn.com/t/font_985780_km7mi63cihi.woff?t=1545807318834') format('woff'),
|
||||
url('https://at.alicdn.com/t/font_985780_km7mi63cihi.ttf?t=1545807318834') format('truetype'),
|
||||
url('https://at.alicdn.com/t/font_985780_km7mi63cihi.svg?t=1545807318834#iconfont') format('svg');
|
||||
}
|
||||
|
||||
.logo {
|
||||
font-family: "iconfont logo";
|
||||
font-size: 160px;
|
||||
font-style: normal;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
/* tabs */
|
||||
.nav-tabs {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.nav-tabs .nav-more {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
height: 42px;
|
||||
line-height: 42px;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
#tabs {
|
||||
border-bottom: 1px solid #eee;
|
||||
}
|
||||
|
||||
#tabs li {
|
||||
cursor: pointer;
|
||||
width: 100px;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
text-align: center;
|
||||
font-size: 16px;
|
||||
border-bottom: 2px solid transparent;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
margin-bottom: -1px;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
|
||||
#tabs .active {
|
||||
border-bottom-color: #f00;
|
||||
color: #222;
|
||||
}
|
||||
|
||||
.tab-container .content {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* 页面布局 */
|
||||
.main {
|
||||
padding: 30px 100px;
|
||||
width: 960px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.main .logo {
|
||||
color: #333;
|
||||
text-align: left;
|
||||
margin-bottom: 30px;
|
||||
line-height: 1;
|
||||
height: 110px;
|
||||
margin-top: -50px;
|
||||
overflow: hidden;
|
||||
*zoom: 1;
|
||||
}
|
||||
|
||||
.main .logo a {
|
||||
font-size: 160px;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.helps {
|
||||
margin-top: 40px;
|
||||
}
|
||||
|
||||
.helps pre {
|
||||
padding: 20px;
|
||||
margin: 10px 0;
|
||||
border: solid 1px #e7e1cd;
|
||||
background-color: #fffdef;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.icon_lists {
|
||||
width: 100% !important;
|
||||
overflow: hidden;
|
||||
*zoom: 1;
|
||||
}
|
||||
|
||||
.icon_lists li {
|
||||
width: 100px;
|
||||
margin-bottom: 10px;
|
||||
margin-right: 20px;
|
||||
text-align: center;
|
||||
list-style: none !important;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.icon_lists li .code-name {
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
.icon_lists .icon {
|
||||
display: block;
|
||||
height: 100px;
|
||||
line-height: 100px;
|
||||
font-size: 42px;
|
||||
margin: 10px auto;
|
||||
color: #333;
|
||||
-webkit-transition: font-size 0.25s linear, width 0.25s linear;
|
||||
-moz-transition: font-size 0.25s linear, width 0.25s linear;
|
||||
transition: font-size 0.25s linear, width 0.25s linear;
|
||||
}
|
||||
|
||||
.icon_lists .icon:hover {
|
||||
font-size: 100px;
|
||||
}
|
||||
|
||||
.icon_lists .svg-icon {
|
||||
/* 通过设置 font-size 来改变图标大小 */
|
||||
width: 1em;
|
||||
/* 图标和文字相邻时，垂直对齐 */
|
||||
vertical-align: -0.15em;
|
||||
/* 通过设置 color 来改变 SVG 的颜色/fill */
|
||||
fill: currentColor;
|
||||
/* path 和 stroke 溢出 viewBox 部分在 IE 下会显示
|
||||
normalize.css 中也包含这行 */
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.icon_lists li .name,
|
||||
.icon_lists li .code-name {
|
||||
color: #666;
|
||||
}
|
||||
|
||||
/* markdown 样式 */
|
||||
.markdown {
|
||||
color: #666;
|
||||
font-size: 14px;
|
||||
line-height: 1.8;
|
||||
}
|
||||
|
||||
.highlight {
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.markdown img {
|
||||
vertical-align: middle;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.markdown h1 {
|
||||
color: #404040;
|
||||
font-weight: 500;
|
||||
line-height: 40px;
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
|
||||
.markdown h2,
|
||||
.markdown h3,
|
||||
.markdown h4,
|
||||
.markdown h5,
|
||||
.markdown h6 {
|
||||
color: #404040;
|
||||
margin: 1.6em 0 0.6em 0;
|
||||
font-weight: 500;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.markdown h1 {
|
||||
font-size: 28px;
|
||||
}
|
||||
|
||||
.markdown h2 {
|
||||
font-size: 22px;
|
||||
}
|
||||
|
||||
.markdown h3 {
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.markdown h4 {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.markdown h5 {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.markdown h6 {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.markdown hr {
|
||||
height: 1px;
|
||||
border: 0;
|
||||
background: #e9e9e9;
|
||||
margin: 16px 0;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.markdown p {
|
||||
margin: 1em 0;
|
||||
}
|
||||
|
||||
.markdown>p,
|
||||
.markdown>blockquote,
|
||||
.markdown>.highlight,
|
||||
.markdown>ol,
|
||||
.markdown>ul {
|
||||
width: 80%;
|
||||
}
|
||||
|
||||
.markdown ul>li {
|
||||
list-style: circle;
|
||||
}
|
||||
|
||||
.markdown>ul li,
|
||||
.markdown blockquote ul>li {
|
||||
margin-left: 20px;
|
||||
padding-left: 4px;
|
||||
}
|
||||
|
||||
.markdown>ul li p,
|
||||
.markdown>ol li p {
|
||||
margin: 0.6em 0;
|
||||
}
|
||||
|
||||
.markdown ol>li {
|
||||
list-style: decimal;
|
||||
}
|
||||
|
||||
.markdown>ol li,
|
||||
.markdown blockquote ol>li {
|
||||
margin-left: 20px;
|
||||
padding-left: 4px;
|
||||
}
|
||||
|
||||
.markdown code {
|
||||
margin: 0 3px;
|
||||
padding: 0 5px;
|
||||
background: #eee;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.markdown strong,
|
||||
.markdown b {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.markdown>table {
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0px;
|
||||
empty-cells: show;
|
||||
border: 1px solid #e9e9e9;
|
||||
width: 95%;
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
|
||||
.markdown>table th {
|
||||
white-space: nowrap;
|
||||
color: #333;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.markdown>table th,
|
||||
.markdown>table td {
|
||||
border: 1px solid #e9e9e9;
|
||||
padding: 8px 16px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.markdown>table th {
|
||||
background: #F7F7F7;
|
||||
}
|
||||
|
||||
.markdown blockquote {
|
||||
font-size: 90%;
|
||||
color: #999;
|
||||
border-left: 4px solid #e9e9e9;
|
||||
padding-left: 0.8em;
|
||||
margin: 1em 0;
|
||||
}
|
||||
|
||||
.markdown blockquote p {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.markdown .anchor {
|
||||
opacity: 0;
|
||||
transition: opacity 0.3s ease;
|
||||
margin-left: 8px;
|
||||
}
|
||||
|
||||
.markdown .waiting {
|
||||
color: #ccc;
|
||||
}
|
||||
|
||||
.markdown h1:hover .anchor,
|
||||
.markdown h2:hover .anchor,
|
||||
.markdown h3:hover .anchor,
|
||||
.markdown h4:hover .anchor,
|
||||
.markdown h5:hover .anchor,
|
||||
.markdown h6:hover .anchor {
|
||||
opacity: 1;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.markdown>br,
|
||||
.markdown>p>br {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
|
||||
.hljs {
|
||||
display: block;
|
||||
background: white;
|
||||
padding: 0.5em;
|
||||
color: #333333;
|
||||
overflow-x: auto;
|
||||
}
|
||||
|
||||
.hljs-comment,
|
||||
.hljs-meta {
|
||||
color: #969896;
|
||||
}
|
||||
|
||||
.hljs-string,
|
||||
.hljs-variable,
|
||||
.hljs-template-variable,
|
||||
.hljs-strong,
|
||||
.hljs-emphasis,
|
||||
.hljs-quote {
|
||||
color: #df5000;
|
||||
}
|
||||
|
||||
.hljs-keyword,
|
||||
.hljs-selector-tag,
|
||||
.hljs-type {
|
||||
color: #a71d5d;
|
||||
}
|
||||
|
||||
.hljs-literal,
|
||||
.hljs-symbol,
|
||||
.hljs-bullet,
|
||||
.hljs-attribute {
|
||||
color: #0086b3;
|
||||
}
|
||||
|
||||
.hljs-section,
|
||||
.hljs-name {
|
||||
color: #63a35c;
|
||||
}
|
||||
|
||||
.hljs-tag {
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.hljs-title,
|
||||
.hljs-attr,
|
||||
.hljs-selector-id,
|
||||
.hljs-selector-class,
|
||||
.hljs-selector-attr,
|
||||
.hljs-selector-pseudo {
|
||||
color: #795da3;
|
||||
}
|
||||
|
||||
.hljs-addition {
|
||||
color: #55a532;
|
||||
background-color: #eaffea;
|
||||
}
|
||||
|
||||
.hljs-deletion {
|
||||
color: #bd2c00;
|
||||
background-color: #ffecec;
|
||||
}
|
||||
|
||||
.hljs-link {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* 代码高亮 */
|
||||
/* PrismJS 1.15.0
|
||||
https://prismjs.com/download.html#themes=prism&languages=markup+css+clike+javascript */
|
||||
/**
|
||||
* prism.js default theme for JavaScript, CSS and HTML
|
||||
* Based on dabblet (http://dabblet.com)
|
||||
* @author Lea Verou
|
||||
*/
|
||||
code[class*="language-"],
|
||||
pre[class*="language-"] {
|
||||
color: black;
|
||||
background: none;
|
||||
text-shadow: 0 1px white;
|
||||
font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
|
||||
text-align: left;
|
||||
white-space: pre;
|
||||
word-spacing: normal;
|
||||
word-break: normal;
|
||||
word-wrap: normal;
|
||||
line-height: 1.5;
|
||||
|
||||
-moz-tab-size: 4;
|
||||
-o-tab-size: 4;
|
||||
tab-size: 4;
|
||||
|
||||
-webkit-hyphens: none;
|
||||
-moz-hyphens: none;
|
||||
-ms-hyphens: none;
|
||||
hyphens: none;
|
||||
}
|
||||
|
||||
pre[class*="language-"]::-moz-selection,
|
||||
pre[class*="language-"] ::-moz-selection,
|
||||
code[class*="language-"]::-moz-selection,
|
||||
code[class*="language-"] ::-moz-selection {
|
||||
text-shadow: none;
|
||||
background: #b3d4fc;
|
||||
}
|
||||
|
||||
pre[class*="language-"]::selection,
|
||||
pre[class*="language-"] ::selection,
|
||||
code[class*="language-"]::selection,
|
||||
code[class*="language-"] ::selection {
|
||||
text-shadow: none;
|
||||
background: #b3d4fc;
|
||||
}
|
||||
|
||||
@media print {
|
||||
|
||||
code[class*="language-"],
|
||||
pre[class*="language-"] {
|
||||
text-shadow: none;
|
||||
}
|
||||
}
|
||||
|
||||
/* Code blocks */
|
||||
pre[class*="language-"] {
|
||||
padding: 1em;
|
||||
margin: .5em 0;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
:not(pre)>code[class*="language-"],
|
||||
pre[class*="language-"] {
|
||||
background: #f5f2f0;
|
||||
}
|
||||
|
||||
/* Inline code */
|
||||
:not(pre)>code[class*="language-"] {
|
||||
padding: .1em;
|
||||
border-radius: .3em;
|
||||
white-space: normal;
|
||||
}
|
||||
|
||||
.token.comment,
|
||||
.token.prolog,
|
||||
.token.doctype,
|
||||
.token.cdata {
|
||||
color: slategray;
|
||||
}
|
||||
|
||||
.token.punctuation {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.namespace {
|
||||
opacity: .7;
|
||||
}
|
||||
|
||||
.token.property,
|
||||
.token.tag,
|
||||
.token.boolean,
|
||||
.token.number,
|
||||
.token.constant,
|
||||
.token.symbol,
|
||||
.token.deleted {
|
||||
color: #905;
|
||||
}
|
||||
|
||||
.token.selector,
|
||||
.token.attr-name,
|
||||
.token.string,
|
||||
.token.char,
|
||||
.token.builtin,
|
||||
.token.inserted {
|
||||
color: #690;
|
||||
}
|
||||
|
||||
.token.operator,
|
||||
.token.entity,
|
||||
.token.url,
|
||||
.language-css .token.string,
|
||||
.style .token.string {
|
||||
color: #9a6e3a;
|
||||
background: hsla(0, 0%, 100%, .5);
|
||||
}
|
||||
|
||||
.token.atrule,
|
||||
.token.attr-value,
|
||||
.token.keyword {
|
||||
color: #07a;
|
||||
}
|
||||
|
||||
.token.function,
|
||||
.token.class-name {
|
||||
color: #DD4A68;
|
||||
}
|
||||
|
||||
.token.regex,
|
||||
.token.important,
|
||||
.token.variable {
|
||||
color: #e90;
|
||||
}
|
||||
|
||||
.token.important,
|
||||
.token.bold {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.token.italic {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.token.entity {
|
||||
cursor: help;
|
||||
}
|
||||
File diff suppressed because it is too large
Load Diff
|
|
@ -0,0 +1,299 @@
|
|||
@font-face {
|
||||
font-family: "iconfont"; /* Project id 3152246 */
|
||||
src: url('iconfont.woff2?t=1732329564134') format('woff2'),
|
||||
url('iconfont.woff?t=1732329564134') format('woff'),
|
||||
url('iconfont.ttf?t=1732329564134') format('truetype');
|
||||
}
|
||||
|
||||
.iconfont {
|
||||
font-family: "iconfont" !important;
|
||||
font-size: 16px;
|
||||
font-style: normal;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
.icon-gouwuche2:before {
|
||||
content: "\e639";
|
||||
}
|
||||
|
||||
.icon-gouwuche1:before {
|
||||
content: "\f0f5";
|
||||
}
|
||||
|
||||
.icon-gouwuche1-copy:before {
|
||||
content: "\f0f6";
|
||||
}
|
||||
|
||||
.icon-bangding:before {
|
||||
content: "\e61d";
|
||||
}
|
||||
|
||||
.icon-erweima1:before {
|
||||
content: "\e607";
|
||||
}
|
||||
|
||||
.icon-a-kucunrizhichaxun2x:before {
|
||||
content: "\e64e";
|
||||
}
|
||||
|
||||
.icon-jiekuandingdantijiao5:before {
|
||||
content: "\e6a1";
|
||||
}
|
||||
|
||||
.icon-daishouhuo:before {
|
||||
content: "\e605";
|
||||
}
|
||||
|
||||
.icon-dingdan:before {
|
||||
content: "\e646";
|
||||
}
|
||||
|
||||
.icon-dingdanwancheng_icon:before {
|
||||
content: "\e606";
|
||||
}
|
||||
|
||||
.icon-shezhi:before {
|
||||
content: "\e851";
|
||||
}
|
||||
|
||||
.icon-tuichu4:before {
|
||||
content: "\e645";
|
||||
}
|
||||
|
||||
.icon-31dingwei:before {
|
||||
content: "\e601";
|
||||
}
|
||||
|
||||
.icon-wxbdingwei:before {
|
||||
content: "\e624";
|
||||
}
|
||||
|
||||
.icon-maozi:before {
|
||||
content: "\e602";
|
||||
}
|
||||
|
||||
.icon-WIFI:before {
|
||||
content: "\e8c1";
|
||||
}
|
||||
|
||||
.icon-dianliang:before {
|
||||
content: "\e612";
|
||||
}
|
||||
|
||||
.icon-xinhao:before {
|
||||
content: "\e60a";
|
||||
}
|
||||
|
||||
.icon-dianchi-gaodianliang:before {
|
||||
content: "\e7a5";
|
||||
}
|
||||
|
||||
.icon-dianchi-zhongdianliang:before {
|
||||
content: "\e7a6";
|
||||
}
|
||||
|
||||
.icon-dianchi-didianliang:before {
|
||||
content: "\e7a7";
|
||||
}
|
||||
|
||||
.icon-pc:before {
|
||||
content: "\e604";
|
||||
}
|
||||
|
||||
.icon-shouji:before {
|
||||
content: "\e614";
|
||||
}
|
||||
|
||||
.icon-tongxin:before {
|
||||
content: "\e603";
|
||||
}
|
||||
|
||||
.icon-zu:before {
|
||||
content: "\e617";
|
||||
}
|
||||
|
||||
.icon-duijiang:before {
|
||||
content: "\e6e8";
|
||||
}
|
||||
|
||||
.icon-shuangjiantou-you:before {
|
||||
content: "\e77e";
|
||||
}
|
||||
|
||||
.icon-shuangjiantou-zuo:before {
|
||||
content: "\e77f";
|
||||
}
|
||||
|
||||
.icon-dianliang4:before {
|
||||
content: "\e60f";
|
||||
}
|
||||
|
||||
.icon-butongguo2:before {
|
||||
content: "\e6cd";
|
||||
}
|
||||
|
||||
.icon-tongguo1:before {
|
||||
content: "\e6ee";
|
||||
}
|
||||
|
||||
.icon-butongguo1:before {
|
||||
content: "\e634";
|
||||
}
|
||||
|
||||
.icon-butongguo:before {
|
||||
content: "\e633";
|
||||
}
|
||||
|
||||
.icon-tongguo:before {
|
||||
content: "\e629";
|
||||
}
|
||||
|
||||
.icon-fanhui1:before {
|
||||
content: "\e635";
|
||||
}
|
||||
|
||||
.icon-shangsheng:before {
|
||||
content: "\e750";
|
||||
}
|
||||
|
||||
.icon-xiajiang:before {
|
||||
content: "\e632";
|
||||
}
|
||||
|
||||
.icon-fujian:before {
|
||||
content: "\e88a";
|
||||
}
|
||||
|
||||
.icon-Search:before {
|
||||
content: "\e6ae";
|
||||
}
|
||||
|
||||
.icon-zuofanye:before {
|
||||
content: "\e67d";
|
||||
}
|
||||
|
||||
.icon-youfanye:before {
|
||||
content: "\e67e";
|
||||
}
|
||||
|
||||
.icon-shangla:before {
|
||||
content: "\e609";
|
||||
}
|
||||
|
||||
.icon-xiala:before {
|
||||
content: "\e6b9";
|
||||
}
|
||||
|
||||
.icon-tuichu3:before {
|
||||
content: "\e892";
|
||||
}
|
||||
|
||||
.icon-xiugaimima:before {
|
||||
content: "\e618";
|
||||
}
|
||||
|
||||
.icon-sanjiaoxing:before {
|
||||
content: "\e6bd";
|
||||
}
|
||||
|
||||
.icon-icon:before {
|
||||
content: "\e667";
|
||||
}
|
||||
|
||||
.icon-yonghuguanli-yonghuguanli:before {
|
||||
content: "\e61a";
|
||||
}
|
||||
|
||||
.icon-tiaoduguanli_1:before {
|
||||
content: "\e7c7";
|
||||
}
|
||||
|
||||
.icon-icon_xitongyichangrizhi:before {
|
||||
content: "\e631";
|
||||
}
|
||||
|
||||
.icon-ITyingyongxitongshujutiaozhengliucheng-01:before {
|
||||
content: "\e999";
|
||||
}
|
||||
|
||||
.icon-xiangyoujiantou:before {
|
||||
content: "\e65f";
|
||||
}
|
||||
|
||||
.icon-xiangzuojiantou:before {
|
||||
content: "\e660";
|
||||
}
|
||||
|
||||
.icon-zengjia1:before {
|
||||
content: "\e889";
|
||||
}
|
||||
|
||||
.icon-fanhui:before {
|
||||
content: "\e600";
|
||||
}
|
||||
|
||||
.icon-guanbi:before {
|
||||
content: "\eb6a";
|
||||
}
|
||||
|
||||
.icon-tianjia1:before {
|
||||
content: "\e622";
|
||||
}
|
||||
|
||||
.icon-shanchu2:before {
|
||||
content: "\eafb";
|
||||
}
|
||||
|
||||
.icon-zengjia:before {
|
||||
content: "\e6ea";
|
||||
}
|
||||
|
||||
.icon-shanchu1:before {
|
||||
content: "\ec7b";
|
||||
}
|
||||
|
||||
.icon-xiugai2:before {
|
||||
content: "\e651";
|
||||
}
|
||||
|
||||
.icon-xiugai1:before {
|
||||
content: "\e650";
|
||||
}
|
||||
|
||||
.icon-xiugai:before {
|
||||
content: "\e8cf";
|
||||
}
|
||||
|
||||
.icon-shanchu:before {
|
||||
content: "\e8b6";
|
||||
}
|
||||
|
||||
.icon-tianjia:before {
|
||||
content: "\e613";
|
||||
}
|
||||
|
||||
.icon-tuichu1:before {
|
||||
content: "\e623";
|
||||
}
|
||||
|
||||
.icon-tuichu2:before {
|
||||
content: "\e60c";
|
||||
}
|
||||
|
||||
.icon-tuichu:before {
|
||||
content: "\e865";
|
||||
}
|
||||
|
||||
.icon-jianhaob:before {
|
||||
content: "\e6ca";
|
||||
}
|
||||
|
||||
.icon-jiahao:before {
|
||||
content: "\e61c";
|
||||
}
|
||||
|
||||
.icon-gouwuche:before {
|
||||
content: "\e63f";
|
||||
}
|
||||
|
||||
File diff suppressed because one or more lines are too long
|
|
@ -0,0 +1,506 @@
|
|||
{
|
||||
"id": "3152246",
|
||||
"name": "no name",
|
||||
"font_family": "iconfont",
|
||||
"css_prefix_text": "icon-",
|
||||
"description": "",
|
||||
"glyphs": [
|
||||
{
|
||||
"icon_id": "3826040",
|
||||
"name": "购物车",
|
||||
"font_class": "gouwuche2",
|
||||
"unicode": "e639",
|
||||
"unicode_decimal": 58937
|
||||
},
|
||||
{
|
||||
"icon_id": "19465421",
|
||||
"name": "购物车",
|
||||
"font_class": "gouwuche1",
|
||||
"unicode": "f0f5",
|
||||
"unicode_decimal": 61685
|
||||
},
|
||||
{
|
||||
"icon_id": "42570390",
|
||||
"name": "购物车-copy",
|
||||
"font_class": "gouwuche1-copy",
|
||||
"unicode": "f0f6",
|
||||
"unicode_decimal": 61686
|
||||
},
|
||||
{
|
||||
"icon_id": "1929142",
|
||||
"name": "绑定",
|
||||
"font_class": "bangding",
|
||||
"unicode": "e61d",
|
||||
"unicode_decimal": 58909
|
||||
},
|
||||
{
|
||||
"icon_id": "9002580",
|
||||
"name": "二维码",
|
||||
"font_class": "erweima1",
|
||||
"unicode": "e607",
|
||||
"unicode_decimal": 58887
|
||||
},
|
||||
{
|
||||
"icon_id": "24397693",
|
||||
"name": "库存日志查询@2x",
|
||||
"font_class": "a-kucunrizhichaxun2x",
|
||||
"unicode": "e64e",
|
||||
"unicode_decimal": 58958
|
||||
},
|
||||
{
|
||||
"icon_id": "622378",
|
||||
"name": "借款_订单提交5",
|
||||
"font_class": "jiekuandingdantijiao5",
|
||||
"unicode": "e6a1",
|
||||
"unicode_decimal": 59041
|
||||
},
|
||||
{
|
||||
"icon_id": "2216987",
|
||||
"name": "待收货",
|
||||
"font_class": "daishouhuo",
|
||||
"unicode": "e605",
|
||||
"unicode_decimal": 58885
|
||||
},
|
||||
{
|
||||
"icon_id": "2892820",
|
||||
"name": "订单",
|
||||
"font_class": "dingdan",
|
||||
"unicode": "e646",
|
||||
"unicode_decimal": 58950
|
||||
},
|
||||
{
|
||||
"icon_id": "19904373",
|
||||
"name": "订单完成_icon",
|
||||
"font_class": "dingdanwancheng_icon",
|
||||
"unicode": "e606",
|
||||
"unicode_decimal": 58886
|
||||
},
|
||||
{
|
||||
"icon_id": "8288873",
|
||||
"name": "设置",
|
||||
"font_class": "shezhi",
|
||||
"unicode": "e851",
|
||||
"unicode_decimal": 59473
|
||||
},
|
||||
{
|
||||
"icon_id": "6626335",
|
||||
"name": "退出",
|
||||
"font_class": "tuichu4",
|
||||
"unicode": "e645",
|
||||
"unicode_decimal": 58949
|
||||
},
|
||||
{
|
||||
"icon_id": "201579",
|
||||
"name": "3.1定位",
|
||||
"font_class": "31dingwei",
|
||||
"unicode": "e601",
|
||||
"unicode_decimal": 58881
|
||||
},
|
||||
{
|
||||
"icon_id": "591955",
|
||||
"name": "wxb定位",
|
||||
"font_class": "wxbdingwei",
|
||||
"unicode": "e624",
|
||||
"unicode_decimal": 58916
|
||||
},
|
||||
{
|
||||
"icon_id": "3029239",
|
||||
"name": "安全帽",
|
||||
"font_class": "maozi",
|
||||
"unicode": "e602",
|
||||
"unicode_decimal": 58882
|
||||
},
|
||||
{
|
||||
"icon_id": "11372738",
|
||||
"name": "WIFI",
|
||||
"font_class": "WIFI",
|
||||
"unicode": "e8c1",
|
||||
"unicode_decimal": 59585
|
||||
},
|
||||
{
|
||||
"icon_id": "1159882",
|
||||
"name": "电量",
|
||||
"font_class": "dianliang",
|
||||
"unicode": "e612",
|
||||
"unicode_decimal": 58898
|
||||
},
|
||||
{
|
||||
"icon_id": "1256479",
|
||||
"name": "信号",
|
||||
"font_class": "xinhao",
|
||||
"unicode": "e60a",
|
||||
"unicode_decimal": 58890
|
||||
},
|
||||
{
|
||||
"icon_id": "19985098",
|
||||
"name": "电池-高电量",
|
||||
"font_class": "dianchi-gaodianliang",
|
||||
"unicode": "e7a5",
|
||||
"unicode_decimal": 59301
|
||||
},
|
||||
{
|
||||
"icon_id": "19985102",
|
||||
"name": "电池-中电量",
|
||||
"font_class": "dianchi-zhongdianliang",
|
||||
"unicode": "e7a6",
|
||||
"unicode_decimal": 59302
|
||||
},
|
||||
{
|
||||
"icon_id": "19985106",
|
||||
"name": "电池-低电量",
|
||||
"font_class": "dianchi-didianliang",
|
||||
"unicode": "e7a7",
|
||||
"unicode_decimal": 59303
|
||||
},
|
||||
{
|
||||
"icon_id": "637751",
|
||||
"name": "PC",
|
||||
"font_class": "pc",
|
||||
"unicode": "e604",
|
||||
"unicode_decimal": 58884
|
||||
},
|
||||
{
|
||||
"icon_id": "11776587",
|
||||
"name": "手机",
|
||||
"font_class": "shouji",
|
||||
"unicode": "e614",
|
||||
"unicode_decimal": 58900
|
||||
},
|
||||
{
|
||||
"icon_id": "1374552",
|
||||
"name": "通信",
|
||||
"font_class": "tongxin",
|
||||
"unicode": "e603",
|
||||
"unicode_decimal": 58883
|
||||
},
|
||||
{
|
||||
"icon_id": "8135245",
|
||||
"name": "通信",
|
||||
"font_class": "zu",
|
||||
"unicode": "e617",
|
||||
"unicode_decimal": 58903
|
||||
},
|
||||
{
|
||||
"icon_id": "22094462",
|
||||
"name": "对讲",
|
||||
"font_class": "duijiang",
|
||||
"unicode": "e6e8",
|
||||
"unicode_decimal": 59112
|
||||
},
|
||||
{
|
||||
"icon_id": "15668865",
|
||||
"name": "双箭头-右",
|
||||
"font_class": "shuangjiantou-you",
|
||||
"unicode": "e77e",
|
||||
"unicode_decimal": 59262
|
||||
},
|
||||
{
|
||||
"icon_id": "15668872",
|
||||
"name": "双箭头-左",
|
||||
"font_class": "shuangjiantou-zuo",
|
||||
"unicode": "e77f",
|
||||
"unicode_decimal": 59263
|
||||
},
|
||||
{
|
||||
"icon_id": "31358465",
|
||||
"name": "电量4",
|
||||
"font_class": "dianliang4",
|
||||
"unicode": "e60f",
|
||||
"unicode_decimal": 58895
|
||||
},
|
||||
{
|
||||
"icon_id": "21429827",
|
||||
"name": "不通过",
|
||||
"font_class": "butongguo2",
|
||||
"unicode": "e6cd",
|
||||
"unicode_decimal": 59085
|
||||
},
|
||||
{
|
||||
"icon_id": "26845560",
|
||||
"name": "通过",
|
||||
"font_class": "tongguo1",
|
||||
"unicode": "e6ee",
|
||||
"unicode_decimal": 59118
|
||||
},
|
||||
{
|
||||
"icon_id": "2064108",
|
||||
"name": "不通过2",
|
||||
"font_class": "butongguo1",
|
||||
"unicode": "e634",
|
||||
"unicode_decimal": 58932
|
||||
},
|
||||
{
|
||||
"icon_id": "2064106",
|
||||
"name": "不通过1",
|
||||
"font_class": "butongguo",
|
||||
"unicode": "e633",
|
||||
"unicode_decimal": 58931
|
||||
},
|
||||
{
|
||||
"icon_id": "8312527",
|
||||
"name": "通过",
|
||||
"font_class": "tongguo",
|
||||
"unicode": "e629",
|
||||
"unicode_decimal": 58921
|
||||
},
|
||||
{
|
||||
"icon_id": "12450522",
|
||||
"name": "返回",
|
||||
"font_class": "fanhui1",
|
||||
"unicode": "e635",
|
||||
"unicode_decimal": 58933
|
||||
},
|
||||
{
|
||||
"icon_id": "681195",
|
||||
"name": "上升",
|
||||
"font_class": "shangsheng",
|
||||
"unicode": "e750",
|
||||
"unicode_decimal": 59216
|
||||
},
|
||||
{
|
||||
"icon_id": "6148381",
|
||||
"name": "下降",
|
||||
"font_class": "xiajiang",
|
||||
"unicode": "e632",
|
||||
"unicode_decimal": 58930
|
||||
},
|
||||
{
|
||||
"icon_id": "2076247",
|
||||
"name": "附件",
|
||||
"font_class": "fujian",
|
||||
"unicode": "e88a",
|
||||
"unicode_decimal": 59530
|
||||
},
|
||||
{
|
||||
"icon_id": "1242870",
|
||||
"name": "搜索",
|
||||
"font_class": "Search",
|
||||
"unicode": "e6ae",
|
||||
"unicode_decimal": 59054
|
||||
},
|
||||
{
|
||||
"icon_id": "8045780",
|
||||
"name": "左翻页",
|
||||
"font_class": "zuofanye",
|
||||
"unicode": "e67d",
|
||||
"unicode_decimal": 59005
|
||||
},
|
||||
{
|
||||
"icon_id": "8045781",
|
||||
"name": "右翻页",
|
||||
"font_class": "youfanye",
|
||||
"unicode": "e67e",
|
||||
"unicode_decimal": 59006
|
||||
},
|
||||
{
|
||||
"icon_id": "8224835",
|
||||
"name": "上拉",
|
||||
"font_class": "shangla",
|
||||
"unicode": "e609",
|
||||
"unicode_decimal": 58889
|
||||
},
|
||||
{
|
||||
"icon_id": "672036",
|
||||
"name": "下拉",
|
||||
"font_class": "xiala",
|
||||
"unicode": "e6b9",
|
||||
"unicode_decimal": 59065
|
||||
},
|
||||
{
|
||||
"icon_id": "2076271",
|
||||
"name": "退出",
|
||||
"font_class": "tuichu3",
|
||||
"unicode": "e892",
|
||||
"unicode_decimal": 59538
|
||||
},
|
||||
{
|
||||
"icon_id": "6844389",
|
||||
"name": "修改密码",
|
||||
"font_class": "xiugaimima",
|
||||
"unicode": "e618",
|
||||
"unicode_decimal": 58904
|
||||
},
|
||||
{
|
||||
"icon_id": "6270980",
|
||||
"name": "三角形",
|
||||
"font_class": "sanjiaoxing",
|
||||
"unicode": "e6bd",
|
||||
"unicode_decimal": 59069
|
||||
},
|
||||
{
|
||||
"icon_id": "761516",
|
||||
"name": "用户访问记录",
|
||||
"font_class": "icon",
|
||||
"unicode": "e667",
|
||||
"unicode_decimal": 58983
|
||||
},
|
||||
{
|
||||
"icon_id": "17523081",
|
||||
"name": "用户管理-用户管理",
|
||||
"font_class": "yonghuguanli-yonghuguanli",
|
||||
"unicode": "e61a",
|
||||
"unicode_decimal": 58906
|
||||
},
|
||||
{
|
||||
"icon_id": "26709827",
|
||||
"name": "调度管理_1",
|
||||
"font_class": "tiaoduguanli_1",
|
||||
"unicode": "e7c7",
|
||||
"unicode_decimal": 59335
|
||||
},
|
||||
{
|
||||
"icon_id": "23442262",
|
||||
"name": "icon_系统异常日志",
|
||||
"font_class": "icon_xitongyichangrizhi",
|
||||
"unicode": "e631",
|
||||
"unicode_decimal": 58929
|
||||
},
|
||||
{
|
||||
"icon_id": "28520738",
|
||||
"name": "IT应用系统数据调整流程-01",
|
||||
"font_class": "ITyingyongxitongshujutiaozhengliucheng-01",
|
||||
"unicode": "e999",
|
||||
"unicode_decimal": 59801
|
||||
},
|
||||
{
|
||||
"icon_id": "630094",
|
||||
"name": "向右箭头",
|
||||
"font_class": "xiangyoujiantou",
|
||||
"unicode": "e65f",
|
||||
"unicode_decimal": 58975
|
||||
},
|
||||
{
|
||||
"icon_id": "630095",
|
||||
"name": "向左箭头",
|
||||
"font_class": "xiangzuojiantou",
|
||||
"unicode": "e660",
|
||||
"unicode_decimal": 58976
|
||||
},
|
||||
{
|
||||
"icon_id": "2076243",
|
||||
"name": " 增加",
|
||||
"font_class": "zengjia1",
|
||||
"unicode": "e889",
|
||||
"unicode_decimal": 59529
|
||||
},
|
||||
{
|
||||
"icon_id": "1718321",
|
||||
"name": "返回",
|
||||
"font_class": "fanhui",
|
||||
"unicode": "e600",
|
||||
"unicode_decimal": 58880
|
||||
},
|
||||
{
|
||||
"icon_id": "4118038",
|
||||
"name": "关闭",
|
||||
"font_class": "guanbi",
|
||||
"unicode": "eb6a",
|
||||
"unicode_decimal": 60266
|
||||
},
|
||||
{
|
||||
"icon_id": "1304889",
|
||||
"name": "添加",
|
||||
"font_class": "tianjia1",
|
||||
"unicode": "e622",
|
||||
"unicode_decimal": 58914
|
||||
},
|
||||
{
|
||||
"icon_id": "5387543",
|
||||
"name": "删除",
|
||||
"font_class": "shanchu2",
|
||||
"unicode": "eafb",
|
||||
"unicode_decimal": 60155
|
||||
},
|
||||
{
|
||||
"icon_id": "679796",
|
||||
"name": "增加",
|
||||
"font_class": "zengjia",
|
||||
"unicode": "e6ea",
|
||||
"unicode_decimal": 59114
|
||||
},
|
||||
{
|
||||
"icon_id": "6061533",
|
||||
"name": "删除",
|
||||
"font_class": "shanchu1",
|
||||
"unicode": "ec7b",
|
||||
"unicode_decimal": 60539
|
||||
},
|
||||
{
|
||||
"icon_id": "15388516",
|
||||
"name": "修改",
|
||||
"font_class": "xiugai2",
|
||||
"unicode": "e651",
|
||||
"unicode_decimal": 58961
|
||||
},
|
||||
{
|
||||
"icon_id": "567336",
|
||||
"name": "修改",
|
||||
"font_class": "xiugai1",
|
||||
"unicode": "e650",
|
||||
"unicode_decimal": 58960
|
||||
},
|
||||
{
|
||||
"icon_id": "2076418",
|
||||
"name": "修改",
|
||||
"font_class": "xiugai",
|
||||
"unicode": "e8cf",
|
||||
"unicode_decimal": 59599
|
||||
},
|
||||
{
|
||||
"icon_id": "11372693",
|
||||
"name": "删除",
|
||||
"font_class": "shanchu",
|
||||
"unicode": "e8b6",
|
||||
"unicode_decimal": 59574
|
||||
},
|
||||
{
|
||||
"icon_id": "1506296",
|
||||
"name": "添加",
|
||||
"font_class": "tianjia",
|
||||
"unicode": "e613",
|
||||
"unicode_decimal": 58899
|
||||
},
|
||||
{
|
||||
"icon_id": "4942675",
|
||||
"name": "退出",
|
||||
"font_class": "tuichu1",
|
||||
"unicode": "e623",
|
||||
"unicode_decimal": 58915
|
||||
},
|
||||
{
|
||||
"icon_id": "8060687",
|
||||
"name": "退出",
|
||||
"font_class": "tuichu2",
|
||||
"unicode": "e60c",
|
||||
"unicode_decimal": 58892
|
||||
},
|
||||
{
|
||||
"icon_id": "9799489",
|
||||
"name": "退出",
|
||||
"font_class": "tuichu",
|
||||
"unicode": "e865",
|
||||
"unicode_decimal": 59493
|
||||
},
|
||||
{
|
||||
"icon_id": "908786",
|
||||
"name": "减号-b",
|
||||
"font_class": "jianhaob",
|
||||
"unicode": "e6ca",
|
||||
"unicode_decimal": 59082
|
||||
},
|
||||
{
|
||||
"icon_id": "7434422",
|
||||
"name": "加号",
|
||||
"font_class": "jiahao",
|
||||
"unicode": "e61c",
|
||||
"unicode_decimal": 58908
|
||||
},
|
||||
{
|
||||
"icon_id": "624530",
|
||||
"name": "购物车",
|
||||
"font_class": "gouwuche",
|
||||
"unicode": "e63f",
|
||||
"unicode_decimal": 58943
|
||||
}
|
||||
]
|
||||
}
|
||||
Binary file not shown.
Binary file not shown.
Binary file not shown.
|
|
@ -1 +0,0 @@
|
|||
<svg t="1732269368665" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3110" width="200" height="200"><path d="M845.4 383H758c-16.6 0-30-13.4-30-30s13.4-30 30-30h87.4c16.6 0 30 13.4 30 30s-13.5 30-30 30zM662.3 383H263.1c-16.6 0-30-13.4-30-30s13.4-30 30-30h399.2c16.6 0 30 13.4 30 30s-13.5 30-30 30z" fill="#33CC99" p-id="3111"></path><path d="M433.2 873.2m-55 0a55 55 0 1 0 110 0 55 55 0 1 0-110 0Z" fill="#FFB89A" p-id="3112"></path><path d="M854.5 873.2m-55 0a55 55 0 1 0 110 0 55 55 0 1 0-110 0Z" fill="#FFB89A" p-id="3113"></path><path d="M889.8 722.1h-511c-37.7 0-68.4-30.7-68.4-68.4v-1.4L274.5 270v-0.2-0.2l-6-55.4c-8.6-86.8-57.6-117.5-97.3-128.1L101.5 69c-16.1-4-32.3 5.9-36.3 22s5.9 32.3 22 36.3l68.9 16.9c16.2 4.3 28.1 12.4 36.6 24.7 8.6 12.4 14 29.7 16.1 51.4l6 55.6 35.6 379.3c0.8 70.1 58.1 126.9 128.4 126.9h511c16.6 0 30-13.4 30-30s-13.4-30-30-30z" fill="#45484C" p-id="3114"></path><path d="M840.3 197.8H381c-16.6 0-30 13.4-30 30s13.4 30 30 30h459.3c30.2 0 54.9 24.3 55.5 54.3l-19.9 226.5-0.1 1.3v1.3c0 30.6-24.9 55.5-55.5 55.5H436c-16.6 0-30 13.4-30 30s13.4 30 30 30h384.3c63.2 0 114.7-51.1 115.5-114.1L955.7 316l0.1-1.3v-1.3c0-63.8-51.8-115.6-115.5-115.6z" fill="#45484C" p-id="3115"></path><path d="M408.5 842.1c7.2 0 13.1 5.9 13.1 13.1s-5.9 13.1-13.1 13.1-13.1-5.9-13.1-13.1 5.9-13.1 13.1-13.1m0-60c-40.4 0-73.1 32.7-73.1 73.1s32.7 73.1 73.1 73.1 73.1-32.7 73.1-73.1-32.7-73.1-73.1-73.1zM823.1 842.1c7.2 0 13.1 5.9 13.1 13.1s-5.9 13.1-13.1 13.1-13.1-5.9-13.1-13.1 5.9-13.1 13.1-13.1m0-60c-40.4 0-73.1 32.7-73.1 73.1s32.7 73.1 73.1 73.1 73.1-32.7 73.1-73.1-32.7-73.1-73.1-73.1z" fill="#45484C" p-id="3116"></path></svg>
|
||||
|
Before Width: | Height: | Size: 1.6 KiB |
|
|
@ -0,0 +1,369 @@
|
|||
<script setup lang="ts">
|
||||
import $bus from '@/utils/bus'
|
||||
import { mainStore } from 'store/main'
|
||||
import { ElMessage, ElMessageBox } from 'element-plus'
|
||||
const store: any = mainStore()
|
||||
|
||||
const route = useRoute()
|
||||
const router = useRouter()
|
||||
const isRolesSelect = ref<boolean>(false)
|
||||
const rolesName = ref<string>('出租方')
|
||||
|
||||
// 是否显示退出登录
|
||||
const isShowLogout = computed(() => {
|
||||
return store.token
|
||||
})
|
||||
|
||||
const placeholderText = ref('请输入关键字')
|
||||
|
||||
// 退出登录
|
||||
const handlerLogout = () => {
|
||||
ElMessageBox.confirm('是否确定退出登录', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning',
|
||||
})
|
||||
.then(() => {
|
||||
router.push('/login')
|
||||
store.cleanUpToken('')
|
||||
store.clearUserInfo('')
|
||||
ElMessage({
|
||||
type: 'success',
|
||||
message: '已退出登录',
|
||||
})
|
||||
})
|
||||
.catch(() => {
|
||||
ElMessage({
|
||||
type: 'info',
|
||||
message: '已取消',
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
// 搜索查询绑定值
|
||||
const keywordIptValue = ref('')
|
||||
|
||||
// 输入框 dom
|
||||
const inputRef: any = ref(null)
|
||||
|
||||
// 输入框下方历史搜索记录
|
||||
// const searchHistoryList = computed(() => {
|
||||
// return store.searchHistoryList.slice(0, 1)
|
||||
// })
|
||||
|
||||
const searchHistoryList = ref(['挖掘机', '塔式起重机', '挖掘机', '吊机'])
|
||||
|
||||
// 搜索按钮
|
||||
const searchKeywordBtn = () => {
|
||||
/* 去除空格 */
|
||||
keywordIptValue.value = keywordIptValue.value.replace(/\s*/g, '')
|
||||
|
||||
store.addHistoryRecord(keywordIptValue.value)
|
||||
if (route.path == '/equipList') {
|
||||
$bus.emit('search', keywordIptValue.value)
|
||||
} else {
|
||||
router.push({
|
||||
name: 'equipList',
|
||||
state: { keyWord: keywordIptValue.value },
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
// 点击下方搜索记录时
|
||||
const handleHistory = (hisValue: any) => {
|
||||
keywordIptValue.value = hisValue
|
||||
searchKeywordBtn()
|
||||
// inputRef.value.focus()
|
||||
}
|
||||
//页面刷新回显模糊搜索词
|
||||
$bus.on('callBackText', (val) => {
|
||||
nextTick(() => {
|
||||
keywordIptValue.value = val
|
||||
})
|
||||
})
|
||||
|
||||
// 角色切换按钮
|
||||
const onRolesCheck = () => {
|
||||
isRolesSelect.value = true
|
||||
}
|
||||
// 选择角色
|
||||
const onSelectRoles = (type: number) => {
|
||||
if (type === 1) {
|
||||
rolesName.value = '出租方'
|
||||
} else {
|
||||
rolesName.value = '承租方'
|
||||
}
|
||||
isRolesSelect.value = false
|
||||
}
|
||||
|
||||
// 查看预约车
|
||||
const onCarts = () => {
|
||||
console.log('跳转预约车页面')
|
||||
router.push({
|
||||
name: 'cart',
|
||||
})
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<!-- 头部个人信息 收藏夹 手机版等图标 -->
|
||||
<div class="header-container">
|
||||
<div class="header-user-info">
|
||||
<div class="header-box wapper">
|
||||
<div class="header-item" v-if="isShowLogout">
|
||||
<!-- <img src="../assets/img/home/star.png" alt="" /> -->
|
||||
<a class="user-name">{{ store.userInfo.nickName }}</a>
|
||||
</div>
|
||||
<div class="header-item">
|
||||
<a v-if="!isShowLogout" class="a-border-none" @click="$router.push('/login')"
|
||||
>登录</a
|
||||
>
|
||||
<span v-if="!isShowLogout" style="margin: 0 3px">/</span>
|
||||
<a
|
||||
v-if="!isShowLogout"
|
||||
style="padding: 0 20px 0 0"
|
||||
@click="$router.push('/register')"
|
||||
>注册</a
|
||||
>
|
||||
<a v-else @click="handlerLogout">退出登录</a>
|
||||
</div>
|
||||
<div class="header-item roles-check" @click="onRolesCheck" v-if="isShowLogout">
|
||||
<!-- <img src="../assets/img/home/star.png" alt="" /> -->
|
||||
<a style="display: flex; justify-content: center; padding-right: 10px">
|
||||
{{ rolesName }}
|
||||
<el-icon style="margin-left: 10px"><ArrowDownBold /></el-icon>
|
||||
</a>
|
||||
|
||||
<div class="select-list" v-if="isRolesSelect">
|
||||
<div
|
||||
style="border-top-left-radius: 6px; border-top-right-radius: 6px"
|
||||
@click.stop="onSelectRoles(1)"
|
||||
>
|
||||
出租方
|
||||
</div>
|
||||
<div
|
||||
style="border-bottom-left-radius: 6px; border-bottom-right-radius: 6px"
|
||||
@click.stop="onSelectRoles(2)"
|
||||
>
|
||||
承租方
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="header-item">
|
||||
<a @click="$router.push({ name: 'myuser' })">个人中心</a>
|
||||
</div>
|
||||
<div class="header-item last-item">
|
||||
<img src="../../assets/img/home/phone.png" alt="" />
|
||||
<a class="a-border-none">手机版</a>
|
||||
|
||||
<!-- 二维码弹框 -->
|
||||
<div class="qr-code">
|
||||
<el-image
|
||||
src="https://img.xjishu.com/img/zl/2017/10/212257159687020.gif"
|
||||
fit="cover"
|
||||
/>
|
||||
|
||||
扫二维码查看xxx
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.header-container {
|
||||
position: sticky;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 999;
|
||||
|
||||
.header-user-info {
|
||||
background-color: #f5f5f5;
|
||||
}
|
||||
|
||||
/* 头部个人信息部分 */
|
||||
.header-box {
|
||||
height: 37px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.header-item {
|
||||
height: 37px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
color: #6d6d6d;
|
||||
font-size: 14px;
|
||||
cursor: pointer;
|
||||
|
||||
.user-name:hover {
|
||||
color: #6d6d6d;
|
||||
}
|
||||
|
||||
img {
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
a {
|
||||
padding: 0 20px;
|
||||
border-right: 1px solid #666655;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
color: #3cb4a6;
|
||||
}
|
||||
|
||||
.a-border-none {
|
||||
border: none;
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.roles-check {
|
||||
position: relative;
|
||||
}
|
||||
.roles-check .select-list {
|
||||
height: 50px;
|
||||
// display: none;
|
||||
position: absolute;
|
||||
left: 1%;
|
||||
bottom: -46px;
|
||||
width: 98%;
|
||||
background-color: #fff;
|
||||
border-radius: 6px;
|
||||
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
|
||||
z-index: 999;
|
||||
transition: all 1s linear;
|
||||
|
||||
div {
|
||||
height: 25px;
|
||||
font-size: 14px;
|
||||
line-height: 25px;
|
||||
text-align: center;
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
|
||||
div:hover {
|
||||
color: #fff;
|
||||
background-color: #1967d2;
|
||||
}
|
||||
}
|
||||
|
||||
// .roles-check:hover .select-list {
|
||||
// display: block;
|
||||
// }
|
||||
|
||||
.last-item {
|
||||
position: relative;
|
||||
z-index: 998;
|
||||
padding-left: 20px;
|
||||
.qr-code {
|
||||
position: absolute;
|
||||
left: -70px;
|
||||
top: -140px;
|
||||
width: 140px;
|
||||
height: 140px;
|
||||
background-color: #fff;
|
||||
visibility: hidden;
|
||||
padding: 10px;
|
||||
box-shadow: 0 2px 2px 2px #ccc;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: #333;
|
||||
.el-image {
|
||||
width: 120px;
|
||||
height: 120px;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.last-item:hover > .qr-code {
|
||||
visibility: visible;
|
||||
transform: translateY(177px);
|
||||
transition: all 0.6s;
|
||||
}
|
||||
|
||||
/* 中间logo 搜索框部分 */
|
||||
.logo-ipt-container {
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
background-color: #eeeff6;
|
||||
padding: 30px 0;
|
||||
|
||||
img {
|
||||
width: 210px;
|
||||
height: 48px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
input {
|
||||
width: 700px;
|
||||
height: 45px;
|
||||
border: 1px solid #3cb4a6;
|
||||
border-radius: 45px;
|
||||
margin-left: 70px;
|
||||
line-height: 45px;
|
||||
color: #333;
|
||||
text-shadow: 0 0 0 #333;
|
||||
padding-left: 30px;
|
||||
}
|
||||
|
||||
input:focus {
|
||||
outline: 1px solid #3cb4a6;
|
||||
}
|
||||
|
||||
input::-webkit-input-placeholder {
|
||||
color: #949494;
|
||||
}
|
||||
.search-btn {
|
||||
width: 100px;
|
||||
height: 39px;
|
||||
transform: translate(-110px, 0);
|
||||
border-radius: 39px;
|
||||
background: linear-gradient(132deg, #22ab9b 0%, #0d7462 100%);
|
||||
box-shadow: 0px 2px 4px 0px rgba(20, 175, 255, 0.5);
|
||||
border: none;
|
||||
color: #fff;
|
||||
cursor: pointer;
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
.ipt-down {
|
||||
position: absolute;
|
||||
bottom: 5px;
|
||||
left: 22%;
|
||||
overflow: hidden;
|
||||
|
||||
a {
|
||||
max-width: 140px;
|
||||
padding: 0 10px;
|
||||
color: #727272;
|
||||
font-size: 14px;
|
||||
cursor: pointer;
|
||||
overflow: hidden;
|
||||
display: inline-block;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
}
|
||||
|
||||
.cart-icon {
|
||||
width: 10%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
cursor: pointer;
|
||||
|
||||
span {
|
||||
margin-left: 10px;
|
||||
color: #1abc9c;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,5 @@
|
|||
import { get } from '../../index'
|
||||
|
||||
export const getBookCarDetailsApi = () => {
|
||||
return get('/material-mall/bookCar/getBookCarDetails', {})
|
||||
}
|
||||
|
|
@ -10,7 +10,11 @@ export const getList = (params = {}) => {
|
|||
|
||||
//获取装备详情
|
||||
export const getDetail = (id = '') => {
|
||||
return get(`/zlpt-equip/dev/getInfo/${id}`)
|
||||
return get(`/material-mall/dev/getInfo/${id}`)
|
||||
}
|
||||
//加入预约车
|
||||
export const addBookCarApi = (data: object) => {
|
||||
return post(`/material-mall/bookCar/addBookCar`, data)
|
||||
}
|
||||
|
||||
//获取 推荐装备列表
|
||||
|
|
|
|||
|
|
@ -3,6 +3,9 @@ import { get, post } from '../../index'
|
|||
export const getGoodsClassListApi = () => {
|
||||
return get('/material-mall/maType/getEquipmentType', {})
|
||||
}
|
||||
export const getHotSearchListApi = () => {
|
||||
return get('/material-mall/maType/getHotSearch', {})
|
||||
}
|
||||
|
||||
export const apiGetCollect = (params = {}) => {
|
||||
return post('/zlpt-equip/dev/userCollectList', params)
|
||||
|
|
|
|||
|
|
@ -2,6 +2,7 @@
|
|||
import $bus from '@/utils/bus'
|
||||
import { mainStore } from 'store/main'
|
||||
import { ElMessage, ElMessageBox } from 'element-plus'
|
||||
import { getHotSearchListApi } from '../http/api/home/index'
|
||||
const store: any = mainStore()
|
||||
|
||||
const route = useRoute()
|
||||
|
|
@ -51,7 +52,17 @@ const inputRef: any = ref(null)
|
|||
// return store.searchHistoryList.slice(0, 1)
|
||||
// })
|
||||
|
||||
const searchHistoryList = ref(['挖掘机', '塔式起重机', '挖掘机', '吊机'])
|
||||
const searchHistoryList = ref<any>(['挖掘机', '塔式起重机', '挖掘机', '吊机'])
|
||||
|
||||
// 获取热词
|
||||
const getHotSearchListData = async () => {
|
||||
const { data: res }: any = await getHotSearchListApi()
|
||||
|
||||
searchHistoryList.value = res
|
||||
console.log(res, '热词')
|
||||
}
|
||||
|
||||
getHotSearchListData()
|
||||
|
||||
// 搜索按钮
|
||||
const searchKeywordBtn = () => {
|
||||
|
|
@ -95,6 +106,14 @@ const onSelectRoles = (type: number) => {
|
|||
}
|
||||
isRolesSelect.value = false
|
||||
}
|
||||
|
||||
// 查看预约车
|
||||
const onCarts = () => {
|
||||
console.log('跳转预约车页面')
|
||||
router.push({
|
||||
name: 'cart',
|
||||
})
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
|
@ -183,18 +202,20 @@ const onSelectRoles = (type: number) => {
|
|||
|
||||
<div class="ipt-down">
|
||||
<a
|
||||
v-for="item in searchHistoryList.slice(0, 4)"
|
||||
:key="item"
|
||||
@click="handleHistory(item)"
|
||||
v-for="item in searchHistoryList"
|
||||
:key="item.maId"
|
||||
@click="handleHistory(item.deviceName)"
|
||||
class="history-box"
|
||||
>
|
||||
{{ item }}
|
||||
{{ item.deviceName }}
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="cart-icon">
|
||||
<!-- <svg class="cart"></svg> -->
|
||||
预约车
|
||||
<div class="cart-icon" @click="onCarts">
|
||||
<svg class="icon" aria-hidden="true" style="width: 30px; height: 30px">
|
||||
<use xlink:href="#icon-gouwuche2"></use>
|
||||
</svg>
|
||||
<span> 预约车 </span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -381,6 +402,18 @@ const onSelectRoles = (type: number) => {
|
|||
text-overflow: ellipsis;
|
||||
}
|
||||
}
|
||||
|
||||
.cart-icon {
|
||||
width: 10%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
cursor: pointer;
|
||||
|
||||
span {
|
||||
margin-left: 10px;
|
||||
color: #1abc9c;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
11
src/main.ts
11
src/main.ts
|
|
@ -1,6 +1,7 @@
|
|||
import './assets/main.css'
|
||||
import * as ElementPlusIconsVue from '@element-plus/icons-vue'
|
||||
|
||||
|
||||
import { createApp } from 'vue'
|
||||
// import { createPinia } from 'pinia'
|
||||
|
||||
|
|
@ -9,9 +10,15 @@ import pinia from "./store"
|
|||
import router from './router'
|
||||
import 'element-plus/dist/index.css'
|
||||
import './style/css/reset.css'
|
||||
import './assets/font/iconfont.js'
|
||||
import ElementPlus from 'element-plus'
|
||||
import zhCn from 'element-plus/es/locale/lang/zh-cn'
|
||||
|
||||
|
||||
import registerDirectives from 'utils/directive'
|
||||
const app = createApp(App)
|
||||
|
||||
|
||||
for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
|
||||
app.component(key, component)
|
||||
}
|
||||
|
|
@ -20,6 +27,10 @@ for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
|
|||
app.use(pinia)
|
||||
app.use(router)
|
||||
app.mount('#app')
|
||||
app.use(ElementPlus, {
|
||||
locale: zhCn,
|
||||
})
|
||||
|
||||
|
||||
|
||||
registerDirectives(app)
|
||||
|
|
@ -72,7 +72,7 @@ const routes: Array<RouteRecordRaw> = [
|
|||
redirect: '/home',
|
||||
meta: {
|
||||
title: '首页',
|
||||
keepAlive: true,
|
||||
keepAlive: false,
|
||||
AuthFlag: false
|
||||
},
|
||||
|
||||
|
|
@ -84,7 +84,7 @@ const routes: Array<RouteRecordRaw> = [
|
|||
component: () => import('views/home/index.vue'),
|
||||
meta: {
|
||||
title: '首页',
|
||||
keepAlive: true,
|
||||
keepAlive: false,
|
||||
AuthFlag: false,
|
||||
activeName: 'home',
|
||||
},
|
||||
|
|
@ -106,6 +106,8 @@ const routes: Array<RouteRecordRaw> = [
|
|||
component: () => import('views/equip/detail.vue'),
|
||||
meta: {
|
||||
title: '',
|
||||
keepAlive: false,
|
||||
AuthFlag: false,
|
||||
}
|
||||
},
|
||||
// 资讯详情
|
||||
|
|
@ -192,7 +194,7 @@ const routes: Array<RouteRecordRaw> = [
|
|||
component: () => import('views/user/index.vue'), // 组件加载
|
||||
meta: {
|
||||
title: '个人中心',
|
||||
keepAlive: true,
|
||||
keepAlive: false,
|
||||
AuthFlag: false
|
||||
},
|
||||
redirect: '/myuser/baseInfo',
|
||||
|
|
@ -399,6 +401,17 @@ const routes: Array<RouteRecordRaw> = [
|
|||
]
|
||||
|
||||
},
|
||||
// 预约车页面
|
||||
{
|
||||
path: '/cart',
|
||||
name: 'cart',
|
||||
component: () => import('views/cart/index.vue'),
|
||||
meta: {
|
||||
title: '预约车',
|
||||
keepAlive: false,
|
||||
AuthFlag: false
|
||||
},
|
||||
}
|
||||
|
||||
|
||||
]
|
||||
|
|
|
|||
|
|
@ -1,25 +1,24 @@
|
|||
<script setup lang="ts">
|
||||
import FooterInfo from '../components/FooterInfo/index.vue'
|
||||
import HeaderCom from '../layout/header.vue'
|
||||
import zhCn from 'element-plus/dist/locale/zh-cn.mjs'
|
||||
const locale = zhCn
|
||||
import FooterInfo from '../components/FooterInfo/index.vue'
|
||||
import HeaderCom from '../layout/header.vue'
|
||||
import zhCn from 'element-plus/dist/locale/zh-cn.mjs'
|
||||
const locale = zhCn
|
||||
|
||||
const route = useRoute()
|
||||
// 判断是否是个人中心页面 如果是则隐藏页脚
|
||||
const isMyInfoPage = () => {
|
||||
if (route.path.indexOf('myuser') === -1) {
|
||||
return true
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
const route = useRoute()
|
||||
// 判断是否是个人中心页面 如果是则隐藏页脚
|
||||
const isMyInfoPage = () => {
|
||||
if (route.path.indexOf('myuser') === -1) {
|
||||
return true
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(() => {})
|
||||
onMounted(() => {})
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<HeaderCom />
|
||||
|
||||
<div class="container">
|
||||
<el-config-provider :locale="locale">
|
||||
<RouterView />
|
||||
|
|
@ -30,13 +29,13 @@
|
|||
</template>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.container {
|
||||
width: 1200px;
|
||||
margin: 0 auto;
|
||||
overflow: hidden;
|
||||
background: #ffffff;
|
||||
border-radius: 30px;
|
||||
padding: 20px 30px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.container {
|
||||
width: 1200px;
|
||||
margin: 0 auto;
|
||||
overflow: hidden;
|
||||
background: #ffffff;
|
||||
border-radius: 30px;
|
||||
padding: 20px 30px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -147,7 +147,7 @@ const handlerLogin = async () => {
|
|||
|
||||
h3 {
|
||||
color: #006461;
|
||||
font-size: 22px;
|
||||
font-size: 26px;
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
margin-bottom: 26px;
|
||||
|
|
|
|||
|
|
@ -0,0 +1,490 @@
|
|||
<template>
|
||||
<Header />
|
||||
<div class="container">
|
||||
<el-breadcrumb separator="/">
|
||||
<el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
|
||||
<el-breadcrumb-item>预约车</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
|
||||
<div class="cart-title">
|
||||
<div></div>
|
||||
<div style="margin: 0 8px">预约车</div>
|
||||
<div>({{ amountNum }})</div>
|
||||
</div>
|
||||
|
||||
<el-row class="cart-th">
|
||||
<el-col :span="2">
|
||||
<div>
|
||||
<el-checkbox v-model="allChecked" @change="onChangeAll"> 全选 </el-checkbox>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="9">
|
||||
<div>装备信息</div>
|
||||
</el-col>
|
||||
<el-col :span="3">
|
||||
<div>租期</div>
|
||||
</el-col>
|
||||
<el-col :span="2">
|
||||
<div>日租金/元</div>
|
||||
</el-col>
|
||||
<el-col :span="2">
|
||||
<div>天数</div>
|
||||
</el-col>
|
||||
<el-col :span="2">
|
||||
<div>数量</div>
|
||||
</el-col>
|
||||
<el-col :span="2">
|
||||
<div>总金额/元</div>
|
||||
</el-col>
|
||||
<el-col :span="2">
|
||||
<div>操作</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<div class="cart-tbody" v-for="(item, index) in cardList" :key="index">
|
||||
<el-row style="border-bottom: 1px solid #ccc">
|
||||
<el-col :span="1">
|
||||
<div style="text-align: center">
|
||||
<el-checkbox
|
||||
v-model="item.isChecked"
|
||||
@change="onChangeCompany($event, index, item)"
|
||||
>
|
||||
</el-checkbox>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="22" class="cart-user-info">
|
||||
<div>{{ item.company_name }}</div>
|
||||
<div class="user-name">{{ item.user_name }}</div>
|
||||
<div class="user-phone">{{ item.user_phone }}</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-row class="cart-list" v-for="(goods, j) in item.good_list" :key="j">
|
||||
<el-col :span="1">
|
||||
<div style="text-align: center">
|
||||
<el-checkbox v-model="goods.isChecked" @change="onChangeGoods(index)">
|
||||
</el-checkbox>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="9" class="goods-info">
|
||||
<img :src="goods.goods_pic" alt="" />
|
||||
<div class="goods-code">
|
||||
<div style="font-size: 14px; font-weight: bold">{{ goods.goods_name }}</div>
|
||||
<div>装备编号： {{ goods.goods_code }}</div>
|
||||
<div>装备型号： {{ goods.goods_type }}</div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="4">
|
||||
<div class="lease-date">
|
||||
<div>{{ goods.lease_date_string }}</div>
|
||||
<el-date-picker
|
||||
style="width: 100px; margin-top: 10px"
|
||||
v-model="goods.lease_date"
|
||||
type="daterange"
|
||||
size="small"
|
||||
value-format="YYYY-MM-DD"
|
||||
@change="onLeaseDateChange($event, goods)"
|
||||
/>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="2">
|
||||
<div class="red-font">
|
||||
{{ goods.lease_pic }}
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="2">
|
||||
<div class="red-font" style="color: #0062ff">
|
||||
{{ goods.lease_day }}
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="2">
|
||||
<div>
|
||||
<el-input-number
|
||||
v-model="goods.goods_num"
|
||||
style="width: 100px"
|
||||
:min="1"
|
||||
size="small"
|
||||
/>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="2">
|
||||
<div class="red-font">
|
||||
{{ goods.goods_num * goods.lease_pic * goods.lease_day }}
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="2">
|
||||
<div>
|
||||
<el-button
|
||||
@click="onDeleteGoods(j)"
|
||||
type="text"
|
||||
style="color: #ff4800; font-weight: bold"
|
||||
>
|
||||
删除
|
||||
</el-button>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
|
||||
<div class="protocol-handle">
|
||||
<el-row style="display: flex; align-items: center">
|
||||
<el-col :span="16">
|
||||
<div class="checkbox-container">
|
||||
<el-checkbox v-model="protocolChecked">
|
||||
我已阅读并同意签署
|
||||
<a href="#"> 《xxxx公司租赁服务合同》 </a>
|
||||
</el-checkbox>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="3">
|
||||
<div>
|
||||
共：<span style="color: #ff4800; font-weight: bold">{{
|
||||
amountDevice
|
||||
}}</span>
|
||||
件装备
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="3">
|
||||
<div class="red-font">
|
||||
订单总金额：<span style="color: #ff4800; font-weight: bold"
|
||||
>{{ orderAmountPice }} 元</span
|
||||
>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="2">
|
||||
<div style="text-align: right">
|
||||
<el-button
|
||||
size="small"
|
||||
@click="onCartSubmit"
|
||||
style="padding: 6px 24px; background-color: #1abc9c; color: #fff"
|
||||
>提交</el-button
|
||||
>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</div>
|
||||
<FooterInfo />
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import Header from '../../components/header/index.vue'
|
||||
import FooterInfo from '../../components/FooterInfo/index.vue'
|
||||
import { ElMessage } from 'element-plus'
|
||||
import { getBookCarDetailsApi } from '../../http/api/cart/index'
|
||||
import moment from 'moment'
|
||||
|
||||
const protocolChecked = ref<boolean>(false)
|
||||
|
||||
const cardList = ref([
|
||||
{
|
||||
company_name: '安徽博诺斯有限公司',
|
||||
user_name: '王先生',
|
||||
user_phone: '18725632356',
|
||||
isChecked: false,
|
||||
good_list: [
|
||||
{
|
||||
goods_pic:
|
||||
'https://fc1tn.baidu.com/it/u=4185529537,1682541874&fm=202&src=766&fc=tdmatt&mola=new&crop=v1',
|
||||
goods_name: 'W190挖掘机',
|
||||
goods_code: '995221_JHL',
|
||||
goods_type: '挖地型号996',
|
||||
lease_date: '',
|
||||
lease_pic: 300,
|
||||
lease_day: 1,
|
||||
goods_num: 0,
|
||||
totalAmount: 0,
|
||||
isChecked: false,
|
||||
lease_date_string: '',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
company_name: '安徽博诺斯有限公司',
|
||||
user_name: '王先生',
|
||||
user_phone: '18725632356',
|
||||
isChecked: false,
|
||||
good_list: [
|
||||
{
|
||||
goods_pic:
|
||||
'https://fc1tn.baidu.com/it/u=4185529537,1682541874&fm=202&src=766&fc=tdmatt&mola=new&crop=v1',
|
||||
goods_name: 'W190挖掘机',
|
||||
goods_code: '995221_JHL',
|
||||
goods_type: '挖地型号996',
|
||||
lease_date: '',
|
||||
lease_pic: 300,
|
||||
lease_day: 0,
|
||||
goods_num: 0,
|
||||
totalAmount: 0,
|
||||
isChecked: false,
|
||||
lease_date_string: '',
|
||||
},
|
||||
{
|
||||
goods_pic:
|
||||
'https://fc1tn.baidu.com/it/u=4185529537,1682541874&fm=202&src=766&fc=tdmatt&mola=new&crop=v1',
|
||||
goods_name: 'W190挖掘机',
|
||||
goods_code: '995221_JHL',
|
||||
goods_type: '挖地型号996',
|
||||
lease_date: '',
|
||||
lease_pic: 300,
|
||||
lease_day: 0,
|
||||
goods_num: 0,
|
||||
totalAmount: 0,
|
||||
isChecked: false,
|
||||
lease_date_string: '',
|
||||
},
|
||||
{
|
||||
goods_pic:
|
||||
'https://fc1tn.baidu.com/it/u=4185529537,1682541874&fm=202&src=766&fc=tdmatt&mola=new&crop=v1',
|
||||
goods_name: 'W190挖掘机',
|
||||
goods_code: '995221_JHL',
|
||||
goods_type: '挖地型号996',
|
||||
lease_date: '',
|
||||
lease_pic: 300,
|
||||
lease_day: 0,
|
||||
goods_num: 0,
|
||||
totalAmount: 0,
|
||||
isChecked: false,
|
||||
lease_date_string: '',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
company_name: '安徽博诺斯有限公司',
|
||||
user_name: '王先生',
|
||||
user_phone: '18725632356',
|
||||
isChecked: false,
|
||||
good_list: [
|
||||
{
|
||||
goods_pic:
|
||||
'https://fc1tn.baidu.com/it/u=4185529537,1682541874&fm=202&src=766&fc=tdmatt&mola=new&crop=v1',
|
||||
goods_name: 'W190挖掘机',
|
||||
goods_code: '995221_JHL',
|
||||
goods_type: '挖地型号996',
|
||||
lease_date: '',
|
||||
lease_pic: 300,
|
||||
lease_day: 0,
|
||||
goods_num: 0,
|
||||
totalAmount: 0,
|
||||
isChecked: false,
|
||||
lease_date_string: '',
|
||||
},
|
||||
{
|
||||
goods_pic:
|
||||
'https://fc1tn.baidu.com/it/u=4185529537,1682541874&fm=202&src=766&fc=tdmatt&mola=new&crop=v1',
|
||||
goods_name: 'W190挖掘机',
|
||||
goods_code: '995221_JHL',
|
||||
goods_type: '挖地型号996',
|
||||
lease_date: '',
|
||||
lease_pic: 300,
|
||||
lease_day: 0,
|
||||
goods_num: 0,
|
||||
totalAmount: 0,
|
||||
isChecked: false,
|
||||
lease_date_string: '',
|
||||
},
|
||||
],
|
||||
},
|
||||
])
|
||||
|
||||
const getBookCarDetailsData = async () => {
|
||||
const res = await getBookCarDetailsApi()
|
||||
console.log(res, '购物车详情')
|
||||
}
|
||||
getBookCarDetailsData()
|
||||
// 日期change事件
|
||||
const onLeaseDateChange = (e: any, item: any) => {
|
||||
item.lease_date_string = `${e[0]}至${e[1]}`
|
||||
item.lease_day = moment(e[1]).diff(e[0], 'day')
|
||||
}
|
||||
|
||||
// 删除按钮
|
||||
const onDeleteGoods = (index: number) => {
|
||||
console.log('删除---', index)
|
||||
}
|
||||
|
||||
// 全选change事件
|
||||
const onChangeAll = (e: boolean) => {
|
||||
cardList.value.forEach((item) => {
|
||||
item.isChecked = e
|
||||
item.good_list.forEach((j) => {
|
||||
j.isChecked = e
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
// 公司全选事件
|
||||
const onChangeGoods = (index: number) => {
|
||||
cardList.value[index].isChecked = cardList.value[index].good_list.every(
|
||||
(e) => e.isChecked === true,
|
||||
)
|
||||
}
|
||||
// 公司全选事件
|
||||
const onChangeCompany = (e: boolean, index: number, item: any) => {
|
||||
cardList.value[index].good_list.every((j) => (j.isChecked = e))
|
||||
}
|
||||
|
||||
// 计算所有装备
|
||||
const amountNum = computed(() => {
|
||||
let amountNum = 0
|
||||
cardList.value.forEach((e) => {
|
||||
amountNum = e.good_list.length + amountNum
|
||||
})
|
||||
return amountNum
|
||||
})
|
||||
// 计算全选按钮的选中状态
|
||||
const allChecked = computed(() => {
|
||||
return cardList.value.every((e) => e.isChecked === true)
|
||||
})
|
||||
|
||||
// 已勾选的所有装备
|
||||
const amountDevice = computed(() => {
|
||||
let amountNum = 0
|
||||
cardList.value.forEach((e) => {
|
||||
e.good_list.forEach((g) => {
|
||||
if (g.isChecked) {
|
||||
amountNum++
|
||||
}
|
||||
})
|
||||
})
|
||||
return amountNum
|
||||
})
|
||||
|
||||
// 计算订单总价格
|
||||
const orderAmountPice = computed(() => {
|
||||
let orderAmountPice = 0
|
||||
cardList.value.forEach((e) => {
|
||||
e.good_list.forEach((g) => {
|
||||
if (g.isChecked) {
|
||||
orderAmountPice = g.goods_num * g.lease_pic * g.lease_day + orderAmountPice
|
||||
}
|
||||
})
|
||||
})
|
||||
return orderAmountPice
|
||||
})
|
||||
|
||||
// 提交按钮
|
||||
const onCartSubmit = () => {
|
||||
ElMessage.closeAll()
|
||||
if (!protocolChecked.value) {
|
||||
ElMessage({
|
||||
showClose: false,
|
||||
message: '请阅读公司合同',
|
||||
type: 'error',
|
||||
})
|
||||
}
|
||||
console.log('提交订单')
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.container {
|
||||
width: 1200px;
|
||||
margin: 0 auto;
|
||||
padding: 10px;
|
||||
background: #eeeff6;
|
||||
font-size: 14px;
|
||||
|
||||
.cart-title {
|
||||
margin-top: 20px;
|
||||
padding: 10px 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
|
||||
.cart-title div:first-child {
|
||||
width: 5px;
|
||||
height: 20px;
|
||||
background-color: #4fabfe;
|
||||
}
|
||||
|
||||
.cart-th {
|
||||
margin: 15px 0;
|
||||
div {
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
.cart-tbody {
|
||||
background: #fff;
|
||||
padding: 8px 12px;
|
||||
margin: 10px;
|
||||
|
||||
.cart-user-info {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 13px;
|
||||
|
||||
.user-name,
|
||||
.user-phone {
|
||||
padding: 3px 18px;
|
||||
border: 1px solid #ccc;
|
||||
}
|
||||
|
||||
.user-name {
|
||||
margin-left: 20px;
|
||||
border-right: none;
|
||||
}
|
||||
}
|
||||
|
||||
.cart-list {
|
||||
margin: 15px 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 13px;
|
||||
div {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.goods-info {
|
||||
display: flex;
|
||||
align-content: center;
|
||||
|
||||
img {
|
||||
width: 160px;
|
||||
height: 100px;
|
||||
}
|
||||
|
||||
.goods-code {
|
||||
margin-left: 10px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-around;
|
||||
|
||||
div {
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.lease-date {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.red-font {
|
||||
color: #ff4800;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.protocol-handle {
|
||||
background: #fff;
|
||||
padding: 8px 12px;
|
||||
margin: 10px;
|
||||
font-size: 13px;
|
||||
|
||||
.checkbox-container a {
|
||||
color: #ff4800;
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,16 +1,25 @@
|
|||
<template>
|
||||
<div class="equipShowImg">
|
||||
<div class="show">
|
||||
<img :src="urlList[activeUrl]">
|
||||
<img :src="urlListNew[activeUrl].url" />
|
||||
</div>
|
||||
<div class="loop">
|
||||
<div class="prev btn" @click="changeActive(-1)">
|
||||
<el-icon><ArrowLeftBold /></el-icon>
|
||||
</div>
|
||||
<div class="list">
|
||||
<div class="line" :style="`transform: translateX(calc((-100% - 10px) / 3 * ${move}))`">
|
||||
<div class="item" @mouseenter="mouseenter($event,i)" :class="i == activeUrl && 'activeUrl'" v-for="(v,i) in urlList" :key="i">
|
||||
<img :src="v">
|
||||
<div
|
||||
class="line"
|
||||
:style="`transform: translateX(calc((-100% - 10px) / 3 * ${move}))`"
|
||||
>
|
||||
<div
|
||||
class="item"
|
||||
@mouseenter="mouseenter($event, i)"
|
||||
:class="i == activeUrl && 'activeUrl'"
|
||||
v-for="(v, i) in urlListNew"
|
||||
:key="i"
|
||||
>
|
||||
<img :src="v.url" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -21,135 +30,133 @@
|
|||
</div>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import {ref} from "vue";
|
||||
import {el} from "element-plus/es/locale";
|
||||
import { ref } from 'vue'
|
||||
// import { el } from 'element-plus/es/locale'
|
||||
|
||||
const props = defineProps({
|
||||
urlList:{
|
||||
type:Array,
|
||||
default: [
|
||||
]
|
||||
}
|
||||
})
|
||||
const props: any = defineProps({
|
||||
urlList: {
|
||||
type: Array,
|
||||
default: [],
|
||||
},
|
||||
})
|
||||
|
||||
//激活图片下标
|
||||
const activeUrl = ref(0)
|
||||
const urlListNew = computed(() => {
|
||||
return props.urlList
|
||||
})
|
||||
|
||||
//展示 起始
|
||||
const startIndex = ref(0)
|
||||
//展示 结束
|
||||
const endIndex = ref(2)
|
||||
//移动
|
||||
const move = ref(0)
|
||||
//激活图片下标
|
||||
const activeUrl = ref(0)
|
||||
|
||||
const init = () => {
|
||||
//展示 起始
|
||||
const startIndex = ref(0)
|
||||
//展示 结束
|
||||
const endIndex = ref(2)
|
||||
//移动
|
||||
const move = ref(0)
|
||||
|
||||
}
|
||||
init()
|
||||
const init = () => {}
|
||||
init()
|
||||
|
||||
const mouseenter = (e,val) => {
|
||||
activeUrl.value = val
|
||||
}
|
||||
|
||||
const changeActive = (val) => {
|
||||
activeUrl.value = activeUrl.value + val
|
||||
if(activeUrl.value < 0){
|
||||
activeUrl.value = 0
|
||||
}else if(activeUrl.value == props.urlList?.length){
|
||||
activeUrl.value = props.urlList.length - 1
|
||||
}
|
||||
if(activeUrl.value > endIndex.value || activeUrl.value < startIndex.value){
|
||||
endIndex.value = endIndex.value + val
|
||||
startIndex.value = startIndex.value + val
|
||||
move.value = move.value + val
|
||||
}
|
||||
}
|
||||
const mouseenter = (e, val) => {
|
||||
activeUrl.value = val
|
||||
}
|
||||
|
||||
const changeActive = (val) => {
|
||||
activeUrl.value = activeUrl.value + val
|
||||
if (activeUrl.value < 0) {
|
||||
activeUrl.value = 0
|
||||
} else if (activeUrl.value == props.urlList?.length) {
|
||||
activeUrl.value = props.urlList.length - 1
|
||||
}
|
||||
if (activeUrl.value > endIndex.value || activeUrl.value < startIndex.value) {
|
||||
endIndex.value = endIndex.value + val
|
||||
startIndex.value = startIndex.value + val
|
||||
move.value = move.value + val
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.equipShowImg{
|
||||
width: 100%;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
.show{
|
||||
width: 100%;
|
||||
padding-top: 100%;
|
||||
position: relative;
|
||||
img{
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
}
|
||||
}
|
||||
.loop{
|
||||
height: 20%;
|
||||
overflow: hidden;
|
||||
position: absolute;
|
||||
bottom: 10px;
|
||||
left: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.equipShowImg {
|
||||
width: 100%;
|
||||
user-select: none;
|
||||
.prev{
|
||||
margin-right: 5px;
|
||||
}
|
||||
.next{
|
||||
margin-left: 5px;
|
||||
}
|
||||
.list{
|
||||
flex: 1;
|
||||
overflow: hidden;
|
||||
|
||||
|
||||
height: 100%;
|
||||
.line{
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
.show {
|
||||
width: 100%;
|
||||
padding-top: 100%;
|
||||
position: relative;
|
||||
img {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
transition: all ease 0.5s;
|
||||
object-fit: cover;
|
||||
}
|
||||
.item{
|
||||
height: 100%;
|
||||
}
|
||||
.loop {
|
||||
height: 20%;
|
||||
overflow: hidden;
|
||||
position: absolute;
|
||||
bottom: 10px;
|
||||
left: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
user-select: none;
|
||||
.prev {
|
||||
margin-right: 5px;
|
||||
width: calc((100% - 10px) / 3);
|
||||
border:1px solid white;
|
||||
box-sizing: border-box;
|
||||
background: #ffffff4f;
|
||||
}
|
||||
.next {
|
||||
margin-left: 5px;
|
||||
}
|
||||
.list {
|
||||
flex: 1;
|
||||
overflow: hidden;
|
||||
|
||||
height: 100%;
|
||||
.line {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
transition: all ease 0.5s;
|
||||
}
|
||||
.item {
|
||||
height: 100%;
|
||||
margin-right: 5px;
|
||||
width: calc((100% - 10px) / 3);
|
||||
border: 1px solid white;
|
||||
box-sizing: border-box;
|
||||
background: #ffffff4f;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-shrink: 0;
|
||||
&:last-child {
|
||||
margin-right: 0px;
|
||||
}
|
||||
img {
|
||||
width: 100%;
|
||||
max-height: 100%;
|
||||
object-fit: contain;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
.activeUrl {
|
||||
border: 2px solid #23a3ff;
|
||||
}
|
||||
}
|
||||
.btn {
|
||||
width: 8%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-shrink: 0;
|
||||
&:last-child{
|
||||
margin-right: 0px;
|
||||
}
|
||||
img{
|
||||
width: 100%;
|
||||
max-height: 100%;
|
||||
object-fit: contain;
|
||||
cursor: pointer;
|
||||
background: #ffffff8c;
|
||||
height: 100%;
|
||||
cursor: pointer;
|
||||
&:hover {
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
.activeUrl{
|
||||
border: 2px solid #23a3ff;
|
||||
}
|
||||
|
||||
}
|
||||
.btn{
|
||||
width: 8%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background: #ffffff8c ;
|
||||
height: 100%;
|
||||
cursor: pointer;
|
||||
&:hover{
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load Diff
Loading…
Reference in New Issue