bonus
/
Zlpt_Portal
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

商城提交

This commit is contained in:
songyang 2023-12-01 17:02:05 +08:00
parent d5459591c6
commit 5d56b88081
10 changed files with 282 additions and 160 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

130
src/App.vue
View File

@ -1,22 +1,48 @@
<script setup lang="ts">
import FooterInfo from './compontents/FooterInfo/index.vue'
const router = useRouter()
const route = useRoute()
// const footFlag = ref(route.path.indexOf('/myuser/baseInfo') > -1)
const isMyInfoPage = () => {
const currentPage = window.location.hash
if (currentPage.indexOf("myuser/baseInfo") > -1) {
return false
}
}
onMounted(() => {
// console.log(route.params, '路由');
})
</script>
<template>
<div class="shop-header">
<div class="header-box">
<div class="header-wapper">
<a>登录</a>
<!-- <a>注册</a> -->
<a @click="$router.push({ name: 'myuser', params: { type: 'myuser' } })">个人中心</a>
<a>收藏夹</a>
<a>手机版</a>
</div>
<ul class="header-wapper">
<li>
<span>
登录
</span>
</li>
<li>
<span @click="$router.push({ name: 'myuser', query: { type: 'myuser' } })">
个人中心
</span>
</li>
<li>
<img src="./assets/img/home/2023_12_01_beijing2/shoucang.png" alt="">
<span>
收藏夹
</span>
</li>
<li>
<img src="./assets/img/home/2023_12_01_beijing2/shouji.png" alt="">
<span class="last-span">
手机版
</span>
</li>
</ul>
</div>
<!-- 菜单 -->
@ -26,7 +52,11 @@ onMounted(() => {
<img src="@/assets/img/home/2023_12_01_beijing2/logo.png" alt="">
</div>
<input placeholder="输入设备关键词" type="text">
<div class="erweima">二维码占位</div>
<button class="search-btn">搜索</button>
<div class="erweima">
<div class="tilte">手机扫码登录</div>
<img src="" alt="">
</div>
</div>
</div>
@ -34,19 +64,20 @@ onMounted(() => {
</div>
<div class="container">
<RouterView />
<RouterView />
</div>
<!-- <FooterInfo v-if="isMyInfoPage()" /> -->
<FooterInfo />
</template>
<style scoped lang="scss">
.container{
.container {
width: 1200px;
margin: 0 auto;
overflow: hidden;
}
.shop-header {
height: 157px;
width: 100%;
@ -67,22 +98,35 @@ onMounted(() => {
align-items: center;
justify-content: flex-end;
a {
color: #6D6D6D;
font-size: 14px;
padding: 0 20px;
border-right: 1px solid #666655;
li {
display: flex;
align-items: center;
justify-content: center;
height: 37px;
cursor: pointer;
margin-left: 20px;
&:last-child {
span {
color: #6D6D6D;
font-size: 14px;
// padding: 0 20px;
padding: 0 20px 0 3px;
border-right: 1px solid #666655;
&:hover {
color: #2282FF;
}
}
.last-span {
border: none;
}
&:hover {
color: #2282FF;
}
}
}
}
@ -116,15 +160,47 @@ onMounted(() => {
border: 1px solid #5CA4FF;
border-radius: 45px;
margin-left: 70px;
// margin-left: 190px;
line-height: 45px;
color: transparent;
text-shadow: 0 0 0 #333;
padding-left: 30px;
}
input:focus {
outline: 1px solid #5CA4FF;
}
input::-webkit-input-placeholder {
color: #949494;
}
.search-btn {
width: 100px;
height: 39px;
transform: translateX(-110px);
border-radius: 39px;
background: linear-gradient(132deg, #6DE7FF 0%, #348CFF 100%);
box-shadow: 0px 2px 4px 0px rgba(20, 175, 255, 0.5);
border: none;
color: #fff;
cursor: pointer;
font-size: 18px;
}
.erweima {
width: 80px;
width: 100px;
height: 80px;
line-height: 80px;
margin-left: 30px;
background-color: skyblue;
margin-left: -20px;
padding: 10px;
background-color: #fff;
.tilte {
font-size: 14px;
color: #1F88FF;
text-align: center;
}
}
}

18
src/views/home/index.vue
View File

@ -1,6 +1,6 @@
<script setup lang="ts">
import EquipCard from '../../compontents/equipCard.vue'
</script>
<template>
@ -45,9 +45,15 @@
</div>
<ul class="equip-pic">
<li></li>
<li></li>
<li></li>
<li>
<EquipCard />
</li>
<li>
<EquipCard />
</li>
<li>
<EquipCard />
</li>
</ul>
<!-- 专题咨询 -->
@ -122,7 +128,7 @@
background-color: #fff;
padding: 20px 15px;
border-radius: 10px;
box-sizing: border-box;
box-sizing: border-box;
}
.home-index {
@ -248,8 +254,6 @@
li {
width: 340px;
height: 140px;
background-color: skyblue;
}
}

159
src/views/user/baseInfo/index.vue
View File

@ -6,20 +6,29 @@
<!-- 基础信息 -->
<div class="base-info">
<div class="title-info">
<span>132255xxxxxxxx</span>
<!-- <span>132255xxxxxxxx</span>
<a class="edit-a">修改</a>
<span>免费用户/标准用户 xxxx-xxx</span>
<a class="logoff-a">账号注销</a>
<a class="logoff-a">账号注销</a> -->
<div class="number-box">
13585990498
</div>
<div class="user-name">
<span class="free-user">免费用户</span>/
<span class="standard-user">标准用户</span>
</div>
</div>
<div class="myqiye">
<!-- <div class="myqiye">
<span>我的企业:</span>
<a>申请企业认证</a>
/
<a>xxxxxx公司</a>
</div>
</div> -->
<!-- 订单交易信息 -->
<div class="goods-box">
@ -57,80 +66,98 @@
height: 100%;
}
.title-info,
.myqiye {
padding: 0 20px;
.title-info {
height: 40px;
background-color: #f7f9fa;
border-radius: 10px;
display: flex;
height: 56px;
align-items: center;
}
.edit-a {
margin: 0 50px 0 10px;
color: #0262db;
}
.logoff-a {
flex: 1;
text-align: right;
}
.myqiye {
// width: calc(100% - 15px);
padding: 0;
margin: 20px 0 0 20px;
border-bottom: 1px solid #000;
span {
margin-right: 5px;
.number-box {
font-weight: bold;
color: #1B7EFF;
}
a {
color: #0262db;
.user-name {
margin-left: 15px;
}
}
.goods-box {
padding: 20px;
// .title-info,
// .myqiye {
// padding: 0 20px;
// display: flex;
// height: 56px;
// align-items: center;
// }
// .edit-a {
// margin: 0 50px 0 10px;
// color: #0262db;
// }
// .logoff-a {
// flex: 1;
// text-align: right;
// }
// .myqiye {
// // width: calc(100% - 15px);
// padding: 0;
// margin: 20px 0 0 20px;
// border-bottom: 1px solid #000;
// span {
// margin-right: 5px;
// }
// a {
// color: #0262db;
// }
// }
// .goods-box {
// padding: 20px;
.goods-pay {
display: inline-block;
padding: 5px;
height: 37px;
line-height: 37px;
color: #000;
border-bottom: 1px solid #d90d1a;
}
// .goods-pay {
// display: inline-block;
// padding: 5px;
// height: 37px;
// line-height: 37px;
// color: #000;
// border-bottom: 1px solid #d90d1a;
// }
.goods-count {
// width: 100%;
height: 140px;
background-color: #f5f5f5;
padding: 0;
margin: 0;
margin-top: 15px;
list-style: none;
display: flex;
justify-content: space-around;
// .goods-count {
// // width: 100%;
// height: 140px;
// background-color: #f5f5f5;
// padding: 0;
// margin: 0;
// margin-top: 15px;
// list-style: none;
// display: flex;
// justify-content: space-around;
.svgicon {
width: 35px;
height: 35px;
}
// .svgicon {
// width: 35px;
// height: 35px;
// }
li {
width: 140px;
height: 140px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
// li {
// width: 140px;
// height: 140px;
// display: flex;
// flex-direction: column;
// align-items: center;
// justify-content: center;
span {
margin: 5px;
}
}
}
}
// span {
// margin: 5px;
// }
// }
// }
// }
</style>

17
src/views/user/goodsManagement/index.vue
View File

@ -46,25 +46,24 @@ const tableData = [
<el-input />
</el-form-item>
<el-form-item>
<el-button>装备入驻</el-button>
<el-button type="primary">装备入驻</el-button>
</el-form-item>
</el-form>
<!-- 表格 -->
<el-table :data="tableData" style="width: 100%">
<el-table :data="tableData" style="width: 100%" :header-cell-style="{
background: '#3E98FF', color: '#fff'
}">
<el-table-column align="center" prop="name" label="编码" />
<el-table-column align="center" prop="address" label="租赁范围" />
<el-table-column align="center" prop="date" label="装备类型" />
<el-table-column align="center" prop="name" label="装备名称" />
<el-table-column align="center" prop="name" label="租金" />
<el-table-column align="center" prop="name" label="状态" />
<el-table-column align="center" prop="name" label="操作">
<template>
<el-button>查看</el-button>
<el-button>确认收货</el-button>
<el-button>退租</el-button>
<el-button>续租</el-button>
<el-button>删除</el-button>
<el-table-column align="center" prop="name" label="操作" width="180">
<template #default="scope">
<el-button size="small" type="primary">编辑</el-button>
<el-button size="small" type="danger">删除</el-button>
</template>
</el-table-column>
</el-table>

19
src/views/user/goodsUpdown/index.vue
View File

@ -46,26 +46,25 @@ const tableData = [
<el-input />
</el-form-item>
<el-form-item>
<el-button>批量上架</el-button>
<el-button>批量下架</el-button>
<el-button type="primary">批量上架</el-button>
<el-button type="wanring">批量下架</el-button>
</el-form-item>
</el-form>
<!-- 表格 -->
<el-table :data="tableData" style="width: 100%">
<el-table :data="tableData" style="width: 100%" :header-cell-style="{
background: '#3E98FF', color: '#fff'
}">
<el-table-column align="center" prop="name" label="编码" />
<el-table-column align="center" prop="address" label="租赁范围" />
<el-table-column align="center" prop="date" label="装备类型" />
<el-table-column align="center" prop="name" label="装备名称" />
<el-table-column align="center" prop="name" label="租金" />
<el-table-column align="center" prop="name" label="状态" />
<el-table-column align="center" prop="name" label="操作">
<template>
<el-button>查看</el-button>
<el-button>确认收货</el-button>
<el-button>退租</el-button>
<el-button>续租</el-button>
<el-button>删除</el-button>
<el-table-column align="center" prop="name" label="操作" width="180">
<template #default="scope">
<el-button size="small" type="primary">编辑</el-button>
<el-button size="small" type="danger">删除</el-button>
</template>
</el-table-column>
</el-table>

31
src/views/user/index.vue
View File

@ -54,8 +54,16 @@ const lesseeClick = () => {
<!-- 按钮 -->
<div class="btn-box">
<span @click="seekingRentClick" :class="activeseekingRent ? 'active' : ''">求租</span>
<span @click="lesseeClick" :class="!activeseekingRent ? 'active' : ''">承租</span>
<span @click="seekingRentClick">
<a :class="activeseekingRent ? 'active' : ''">
求租
</a>
</span>
<span @click="lesseeClick">
<a :class="!activeseekingRent ? 'active' : ''">
承租
</a>
</span>
</div>
<!-- 菜单 -->
@ -73,16 +81,21 @@ const lesseeClick = () => {
<style lang="scss" >
.app-container {
width: 100%;
// width: 100%;
// height: 100%;
background-color: #fff;
display: flex;
justify-content: space-between;
padding: 10px 20px;
.left-menu {
width: 300px;
width: 260px;
background-color: #f7f9fa;
border-radius: 5px;
margin-right: 15px;
.pic-box {
width: 300px;
width: 260px;
height: 180px;
text-align: center;
@ -109,15 +122,19 @@ const lesseeClick = () => {
flex: 1;
cursor: pointer;
text-align: center;
color: #82B8FF;
}
}
.right-content {
width: calc(100% - 300px);
width: calc(100% - 260px);
}
.active {
background-color: #2282ff;
color: #2282ff;
border-bottom: 2px solid #2282ff;
font-weight: bold;
}
}
</style>

14
src/views/user/operatorManagement/index.vue
View File

@ -32,21 +32,23 @@ const tableData = [
<el-form :model="queryParams" :inline="true">
<el-form-item>
<el-button>新增</el-button>
<el-button type="primary">新增</el-button>
</el-form-item>
</el-form>
<!-- 表格 -->
<el-table :data="tableData" style="width: 100%">
<el-table :data="tableData" style="width: 100%" :header-cell-style="{
background: '#3E98FF', color: '#fff'
}">
<el-table-column align="center" prop="name" label="机手姓名" />
<el-table-column align="center" prop="name" label="机手电话" />
<el-table-column align="center" prop="date" label="年龄" />
<el-table-column align="center" prop="name" label="性别" />
<el-table-column align="center" prop="name" label="身份证号" />
<el-table-column align="center" prop="name" label="操作">
<template>
<el-button>修改</el-button>
<el-button>删除</el-button>
<el-table-column align="center" prop="name" label="操作" width="180">
<template #default="scope">
<el-button size="small" type="primary">编辑</el-button>
<el-button size="small" type="danger">删除</el-button>
</template>
</el-table-column>
</el-table>

20
src/views/user/orderManagement/index.vue
View File

@ -46,28 +46,28 @@ const tableData = [
<el-input />
</el-form-item>
<el-form-item>
<el-button>
<el-button type="primary">
查询
</el-button>
<el-button>保存</el-button>
<el-button type="success">保存</el-button>
</el-form-item>
</el-form>
<!-- 表格 -->
<el-table :data="tableData" style="width: 100%">
<el-table :data="tableData" style="width: 100%" :header-cell-style="{
background: '#3E98FF', color: '#fff'
}">
<el-table-column align="center" prop="name" label="订单编号" />
<el-table-column align="center" prop="name" label="供应商" />
<el-table-column align="center" prop="date" label="订单创建日期" />
<el-table-column align="center" prop="name" label="装备类型" />
<el-table-column align="center" prop="name" label="装备名称" />
<el-table-column align="center" prop="name" label="订单状态" />
<el-table-column align="center" prop="name" label="操作">
<template>
<el-button>查看</el-button>
<el-button>确认收货</el-button>
<el-button>退租</el-button>
<el-button>续租</el-button>
<el-button>删除</el-button>
<el-table-column align="center" prop="name" label="操作" width="260px">
<template #default="scope">
<el-button size="small" type="primary">确认</el-button>
<el-button size="small" type="success">查看</el-button>
<el-button size="small" type="danger">删除</el-button>
</template>
</el-table-column>
</el-table>

20
src/views/user/orderManagementCz/index.vue
View File

@ -46,13 +46,15 @@ const tableData = [
<el-input />
</el-form-item>
<el-form-item>
<el-button>查询</el-button>
<el-button>保存</el-button>
<el-button type="primary">查询</el-button>
<el-button type="success">保存</el-button>
</el-form-item>
</el-form>
<!-- 表格 -->
<el-table :data="tableData" style="width: 100%">
<el-table :data="tableData" style="width: 100%" :header-cell-style="{
background: '#3E98FF', color: '#fff'
}">
<el-table-column align="center" prop="name" label="订单编号" />
<el-table-column align="center" prop="address" label="客户单位" />
<el-table-column align="center" prop="date" label="订单创建日期" />
@ -60,13 +62,11 @@ const tableData = [
<el-table-column align="center" prop="name" label="装备类型" />
<el-table-column align="center" prop="name" label="装备名称" />
<el-table-column align="center" prop="name" label="订单状态" />
<el-table-column align="center" prop="name" label="操作">
<template>
<el-button>查看</el-button>
<el-button>确认收货</el-button>
<el-button>退租</el-button>
<el-button>续租</el-button>
<el-button>删除</el-button>
<el-table-column align="center" prop="name" label="操作" width="260px">
<template #default="scope">
<el-button size="small" type="primary">确认</el-button>
<el-button size="small" type="success">查看</el-button>
<el-button size="small" type="danger">删除</el-button>
</template>
</el-table-column>
</el-table>

14
src/views/user/subAccount/index.vue
View File

@ -31,23 +31,21 @@ const tableData = [
<el-form :model="queryParams" :inline="true">
<el-form-item>
<el-button>新增</el-button>
<el-button type="primary">新增</el-button>
</el-form-item>
</el-form>
<!-- 表格 -->
<el-table :data="tableData" style="width: 100%">
<el-table :data="tableData" style="width: 100%" :header-cell-style="{
background: '#3E98FF', color: '#fff'
}">
<el-table-column align="center" prop="name" label="手机号" />
<el-table-column align="center" prop="name" label="用户名" />
<el-table-column align="center" prop="date" label="创建时间" />
<el-table-column align="center" prop="address" label="是否启用" />
<el-table-column align="center" prop="name" label="操作">
<template>
<el-button>查看</el-button>
<el-button>确认收货</el-button>
<el-button>退租</el-button>
<el-button>续租</el-button>
<el-button>删除</el-button>
<template #default="scope">
<el-button size="small" type="danger">删除</el-button>
</template>
</el-table-column>
</el-table>