liangbin
/
JSDW
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat(物业模块): 添加移动球机管控相关路由和页面 

新增球机台账、高风险项目球机分配、球机回收入库和入库审核四个功能页面
在路由配置中添加移动球机管控相关路由结构
This commit is contained in:
liangbin 2026-01-09 18:01:19 +08:00
parent 62e8c4f201
commit ad6c327634
5 changed files with 728 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
src/router/index.js
View File

@ -99,6 +99,38 @@ export const constantRoutes = [
},
],
},
{
path: "",
component: Layout,
redirect: "/index",
meta: { title: "移动球机管控", icon: "table" },
children: [
{
path: "/StandingBook",
component: () => import("@/views/Tenement/BallheadCamera/StandingBook.vue"),
name: "StandingBook",
meta: { title: "球机台账", icon: "table" },
},
{
path: "/HighRiskProject",
component: () => import("@/views/Tenement/BallheadCamera/HighRiskProject.vue"),
name: "HighRiskProject",
meta: { title: "高风险项目球机分配", icon: "table" },
},
{
path: "/ReturnToInventory",
component: () => import("@/views/Tenement/BallheadCamera/ReturnToInventory.vue"),
name: "ReturnToInventory",
meta: { title: "球机回收入库", icon: "table" },
},
{
path: "/InventoryAudit",
component: () => import("@/views/Tenement/BallheadCamera/InventoryAudit.vue"),
name: "InventoryAudit",
meta: { title: "入库审核", icon: "table" },
},
],
},
// 物业模块END
{

178
src/views/Tenement/BallheadCamera/HighRiskProject.vue Normal file
View File

@ -0,0 +1,178 @@
<!-- 物业模块-移动球机管控-高风险项目球机分配 -->
<template>
<div class="MainBox">
<el-form :model="queryForm" inline class="card-box mb-4">
<el-form-item label="项目名称/编号">
<el-input v-model="queryForm.projectName" placeholder="请输入项目名称"></el-input>
</el-form-item>
<el-form-item label="施工单位">
<el-input v-model="queryForm.constructionUnit" placeholder="请输入单位名称"></el-input>
</el-form-item>
<el-form-item label="作业地点">
<el-input v-model="queryForm.workLocation" placeholder="请输入作业地点"></el-input>
</el-form-item>
<el-form-item label="分配状态">
<el-select v-model="queryForm.allocationStatus" placeholder="请选择分配状态">
<el-option label="全部" value=""></el-option>
<el-option v-for="item in allocationStatusList" :key="item.value" :label="item.label"
:value="item.value"></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button size="default">重置</el-button>
<el-button type="primary" size="default">查询</el-button>
</el-form-item>
</el-form>
<div class="card-box">
<el-table :data="tableData">
<el-table-column prop="projectName" label="项目名称"></el-table-column>
<el-table-column prop="constructionUnit" label="施工单位"></el-table-column>
<el-table-column prop="workLocation" label="作业地点"></el-table-column>
<el-table-column prop="workCycle" label="作业周期"></el-table-column>
<el-table-column prop="riskType" label="风险类型"></el-table-column>
<el-table-column prop="needBallheadNum" label="需分配球机数量"></el-table-column>
<el-table-column prop="repositoryName" label="所属仓库"></el-table-column>
<el-table-column prop="" label="分配状态">
<template #default="scope">
<el-tag :type="scope.row.allocationStatus === '待分配' ? 'success' : 'danger'">
{{ scope.row.allocationStatus }}
</el-tag>
</template>
</el-table-column>
<el-table-column label="操作" width="180">
<template #default="scope">
<el-button size="small" type="text">分配球机</el-button>
<el-button size="small" type="primary" link>查看详情</el-button>
</template>
</el-table-column>
</el-table>
<div class="pagination-container">
<span class="total-count">显示第 {{ (pageNum - 1) * pageSize + 1 }} 到 {{ pageNum * pageSize }} 条记录，共 {{
total }}
条</span>
<el-pagination v-model:current-page="pageNum" v-model:page-size="pageSize" :page-sizes="[5, 10, 20]"
:total="total" layout="prev, pager, next"></el-pagination>
</div>
</div>
</div>
</template>
<script setup name="Index">
import { ref, onMounted } from "vue";
import { useRouter } from "vue-router";
const router = useRouter();
// 查询表单数据
const queryForm = ref({
projectName: "",
constructionUnit: "",
workLocation: "",
allocationStatus: ""
});
// 分配状态列表
const allocationStatusList = ref([
{
label: "待分配",
value: "1"
},
{
label: "已分配",
value: "2"
}
]);
// 表格数据
const tableData = ref([
{
id: 1,
projectName: "项目1",
constructionUnit: "施工单位1",
workLocation: "作业地点1",
workCycle: "作业周期1",
riskType: "高空作业",
needBallheadNum: "10",
allocationStatus: "待分配",
repositoryName: "一号仓库",
remark: "备注1"
},
{
id: 2,
projectName: "项目2",
constructionUnit: "施工单位2",
workLocation: "作业地点2",
workCycle: "作业周期2",
riskType: "高空作业",
needBallheadNum: "10",
allocationStatus: "待分配",
repositoryName: "二号仓库",
remark: "备注2"
},
{
id: 3,
projectName: "项目3",
constructionUnit: "施工单位3",
workLocation: "作业地点3",
workCycle: "作业周期3",
riskType: "高空作业",
needBallheadNum: "10",
allocationStatus: "待分配",
repositoryName: "三号仓库",
remark: "备注3"
},
]);
const pageNum = ref(1); // 当前页码
const pageSize = ref(5); // 每页显示条数
const total = ref(20); // 总记录数
// 跳转到账号管理
const handleAccountManagement = (row) => {
console.log("账号管理", row);
router.push(`/accountManagement?enterpriseName=${row.name}`);
}
</script>
<style scoped lang="scss">
.MainBox {
padding: 20px;
height: 100%;
background: #F9FAFB;
}
.button-group {
display: flex;
justify-content: flex-start;
align-items: center;
gap: 10px;
}
.mg-2 {
margin: 20px 0px;
}
.card-box {
background: #fff;
padding: 16px;
border-radius: 4px;
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
overflow: hidden;
}
.pagination-container {
display: flex;
justify-content: space-between;
align-items: center;
margin-top: 16px;
}
.total-count {
color: #606266;
}
</style>

165
src/views/Tenement/BallheadCamera/InventoryAudit.vue Normal file
View File

@ -0,0 +1,165 @@
<!-- 物业模块-移动球机管控-入库审核 -->
<template>
<div class="MainBox">
<el-form :model="queryForm" inline class="card-box mb-4">
<el-form-item label="时间范围">
<el-date-picker v-model="queryForm.dateRange" type="daterange" value-format="yyyy-MM-dd"
range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker>
</el-form-item>
<el-form-item label="所属项目">
<el-input v-model="queryForm.projectName" placeholder="请输入项目名称"></el-input>
</el-form-item>
<el-form-item label="球机状态">
<el-select v-model="queryForm.returnStatus" placeholder="请选择球机状态">
<el-option label="全部" value=""></el-option>
<el-option v-for="item in StatusList" :key="item.value" :label="item.label"
:value="item.value"></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button size="default">重置</el-button>
<el-button type="primary" size="default">查询</el-button>
</el-form-item>
</el-form>
<div class="card-box">
<el-table :data="tableData" class="mt-2">
<el-table-column prop="needBallheadNum" label="球机编号"></el-table-column>
<el-table-column prop="projectName" label="所属项目"></el-table-column>
<el-table-column prop="returnStatus" label="回收核验结果"></el-table-column>
<el-table-column prop="returnUserName" label="回收人"></el-table-column>
<el-table-column prop="submitEndTime" label="提交入库时间" format="yyyy-MM-dd HH:mm:ss"></el-table-column>
<el-table-column prop="returnStatus" label="回收状态">
<template #default="scope">
<el-tag :type="scope.row.returnStatus === '待回收' ? 'warning' : 'success'">
{{ scope.row.returnStatus }}
</el-tag>
</template>
</el-table-column>
<el-table-column label="操作" width="180">
<template #default="scope">
<el-button size="small" type="primary" link>入库审核</el-button>
<el-button size="small" type="Info" link>驳回</el-button>
</template>
</el-table-column>
</el-table>
<div class="pagination-container">
<span class="total-count">显示第 {{ (pageNum - 1) * pageSize + 1 }} 到 {{ pageNum * pageSize }} 条记录，共 {{
total }}
条</span>
<el-pagination v-model:current-page="pageNum" v-model:page-size="pageSize" :page-sizes="[5, 10, 20]"
:total="total" layout="prev, pager, next"></el-pagination>
</div>
</div>
</div>
</template>
<script setup name="Index">
import { ref, onMounted } from "vue";
import { useRouter } from "vue-router";
const router = useRouter();
// 查询表单数据
const queryForm = ref({
dateRange: [],
projectName: "",
returnStatus: ""
});
// 状态列表
const StatusList = ref([
{
label: "待审核",
value: "0"
},
{
label: "已通过",
value: "1"
},
{
label: "已驳回",
value: "2"
},
]);
// 表格数据
const tableData = ref([
{
id: 1,
needBallheadNum: "1001",
projectName: "项目1",
returnStatus: "待审核",
returnUserName: "用户1",
submitEndTime: "2023-08-01 10:00:00"
},
{
id: 2,
projectName: "项目2",
constructionUnit: "施工单位2",
needBallheadNum: "1002",
submitEndTime: "2023-08-02 10:00:00",
returnStatus: "待回收"
},
{
id: 3,
projectName: "项目3",
constructionUnit: "施工单位3",
needBallheadNum: "1003",
submitEndTime: "2023-08-03 10:00:00",
returnStatus: "已回收待入库"
},
]);
const pageNum = ref(1); // 当前页码
const pageSize = ref(5); // 每页显示条数
const total = ref(20); // 总记录数
</script>
<style scoped lang="scss">
.MainBox {
padding: 20px;
height: 100%;
background: #F9FAFB;
}
.FlexBox {
display: flex;
justify-content: flex-start;
align-items: center;
gap: 10px;
}
.TitleBox {
font-size: 16px;
font-weight: bold;
color: #303133;
}
.mt-2 {
margin-top: 20px;
}
.card-box {
background: #fff;
padding: 16px;
border-radius: 4px;
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
overflow: hidden;
}
.pagination-container {
display: flex;
justify-content: space-between;
align-items: center;
margin-top: 16px;
}
.total-count {
color: #606266;
}
</style>

169
src/views/Tenement/BallheadCamera/ReturnToInventory.vue Normal file
View File

@ -0,0 +1,169 @@
<!-- 物业模块-移动球机管控-球机回收入库 -->
<template>
<div class="MainBox">
<el-form :model="queryForm" inline class="card-box mb-4">
<el-form-item label="项目名称/编号">
<el-input v-model="queryForm.projectName" placeholder="请输入项目名称"></el-input>
</el-form-item>
<el-form-item label="施工单位">
<el-input v-model="queryForm.constructionUnit" placeholder="请输入单位名称"></el-input>
</el-form-item>
<el-form-item label="球机编号">
<el-input v-model="queryForm.needBallheadNum" placeholder="请输入球机编号"></el-input>
</el-form-item>
<el-form-item label="回收状态">
<el-select v-model="queryForm.returnStatus" placeholder="请选择回收状态">
<el-option label="全部" value=""></el-option>
<el-option v-for="item in returnStatusList" :key="item.value" :label="item.label"
:value="item.value"></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button size="default">重置</el-button>
<el-button type="primary" size="default">查询</el-button>
</el-form-item>
</el-form>
<div class="card-box">
<div class="FlexBox" style="justify-content: space-between;">
<div class="TitleBox">待回收列表</div>
<div class="FlexBox">
<el-button type="primary" plain size="default">导出Excel</el-button>
<el-button type="primary" plain size="default">导出PDF</el-button>
<el-button type="primary" plain size="default">打印</el-button>
</div>
</div>
<el-table :data="tableData" class="mt-2">
<el-table-column prop="projectName" label="项目名称"></el-table-column>
<el-table-column prop="constructionUnit" label="施工单位"></el-table-column>
<el-table-column prop="needBallheadNum" label="分配球机编号"></el-table-column>
<el-table-column prop="submitEndTime" label="提交结束时间"></el-table-column>
<el-table-column prop="returnStatus" label="回收状态">
<template #default="scope">
<el-tag :type="scope.row.returnStatus === '待回收' ? 'warning' : 'success'">
{{ scope.row.returnStatus }}
</el-tag>
</template>
</el-table-column>
<el-table-column label="操作" width="180">
<template #default="scope">
<el-button size="small" type="primary" link>现场回收确认</el-button>
</template>
</el-table-column>
</el-table>
<div class="pagination-container">
<span class="total-count">显示第 {{ (pageNum - 1) * pageSize + 1 }} 到 {{ pageNum * pageSize }} 条记录，共 {{
total }}
条</span>
<el-pagination v-model:current-page="pageNum" v-model:page-size="pageSize" :page-sizes="[5, 10, 20]"
:total="total" layout="prev, pager, next"></el-pagination>
</div>
</div>
</div>
</template>
<script setup name="Index">
import { ref, onMounted } from "vue";
import { useRouter } from "vue-router";
const router = useRouter();
// 查询表单数据
const queryForm = ref({
projectName: "",
constructionUnit: "",
needBallheadNum: "",
returnStatus: ""
});
// 回收状态列表
const returnStatusList = ref([
{
label: "待回收",
value: "1"
},
{
label: "已回收待入库",
value: "2"
}
]);
// 表格数据
const tableData = ref([
{
id: 1,
projectName: "项目1",
constructionUnit: "施工单位1",
needBallheadNum: "1001",
submitEndTime: "2023-08-01 10:00:00",
returnStatus: "待回收"
},
{
id: 2,
projectName: "项目2",
constructionUnit: "施工单位2",
needBallheadNum: "1002",
submitEndTime: "2023-08-02 10:00:00",
returnStatus: "待回收"
},
{
id: 3,
projectName: "项目3",
constructionUnit: "施工单位3",
needBallheadNum: "1003",
submitEndTime: "2023-08-03 10:00:00",
returnStatus: "已回收待入库"
},
]);
const pageNum = ref(1); // 当前页码
const pageSize = ref(5); // 每页显示条数
const total = ref(20); // 总记录数
</script>
<style scoped lang="scss">
.MainBox {
padding: 20px;
height: 100%;
background: #F9FAFB;
}
.FlexBox {
display: flex;
justify-content: flex-start;
align-items: center;
gap: 10px;
}
.TitleBox {
font-size: 16px;
font-weight: bold;
color: #303133;
}
.mt-2 {
margin-top: 20px;
}
.card-box {
background: #fff;
padding: 16px;
border-radius: 4px;
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
overflow: hidden;
}
.pagination-container {
display: flex;
justify-content: space-between;
align-items: center;
margin-top: 16px;
}
.total-count {
color: #606266;
}
</style>

184
src/views/Tenement/BallheadCamera/StandingBook.vue Normal file
View File

@ -0,0 +1,184 @@
<!-- 物业模块-移动球机管控-球机台账 -->
<template>
<div class="MainBox">
<div class="button-group card-box">
<el-button type="primary" size="default">新增球机</el-button>
<el-button type="warning" size="default">批量导入球机</el-button>
<el-button size="default">导出台账</el-button>
</div>
<el-form :model="queryForm" inline class="card-box mb-4">
<el-form-item label="采购时间">
<el-date-picker v-model="queryForm.dateRange" type="daterange" value-format="yyyy-MM-dd"
range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" />
</el-form-item>
<el-form-item label="设备状态">
<el-select v-model="queryForm.status" placeholder="全部">
<el-option label="全部" value=""></el-option>
<el-option v-for="item in statusList" :key="item.value" :label="item.label"
:value="item.value"></el-option>
</el-select>
</el-form-item>
<el-form-item label="所属仓库">
<el-select v-model="queryForm.repositoryId" placeholder="全部">
<el-option label="全部" value=""></el-option>
<el-option label="一号仓库" value="1"></el-option>
<el-option label="二号仓库" value="2"></el-option>
<el-option label="三号仓库" value="3"></el-option>
</el-select>
</el-form-item>
<el-form-item label="单位名称">
<el-input v-model="queryForm.unitName" placeholder="请输入单位名称"></el-input>
</el-form-item>
<el-form-item>
<el-button size="default">重置</el-button>
<el-button type="primary" size="default">查询</el-button>
</el-form-item>
</el-form>
<div class="card-box">
<el-table :data="tableData">
<el-table-column prop="ballheadNumber" label="球机编号"></el-table-column>
<el-table-column prop="deviceNumber" label="设备编号"></el-table-column>
<el-table-column prop="purchaseTime" label="采购时间"></el-table-column>
<el-table-column prop="status" label="状态">
<template #default="scope">
<el-tag :type="scope.row.status === '启用' ? 'success' : 'danger'">
{{ scope.row.status }}
</el-tag>
</template>
</el-table-column>
<el-table-column prop="repositoryName" label="所属仓库"></el-table-column>
<el-table-column prop="remark" label="备注"></el-table-column>
<el-table-column label="操作" width="280">
<template #default="scope">
<el-button size="small" type="text">编辑</el-button>
<el-button size="small" type="danger" link>删除</el-button>
</template>
</el-table-column>
</el-table>
<div class="pagination-container">
<span class="total-count">显示第 {{ (pageNum - 1) * pageSize + 1 }} 到 {{ pageNum * pageSize }} 条记录，共 {{
total }}
条</span>
<el-pagination v-model:current-page="pageNum" v-model:page-size="pageSize" :page-sizes="[5, 10, 20]"
:total="total" layout="prev, pager, next"></el-pagination>
</div>
</div>
</div>
</template>
<script setup name="Index">
import { ref, onMounted } from "vue";
import { useRouter } from "vue-router";
const router = useRouter();
// 查询表单数据
const queryForm = ref({
dateRange: [],
unitName: "",
status: "",
repositoryId: ""
});
// 设备状态列表
const statusList = ref([
{
label: "闲置",
value: "0"
},
{
label: "已分配",
value: "1"
},
{
label: "待回收",
value: "2"
},
{
label: "已入库",
value: "3"
}
]);
// 表格数据
const tableData = ref([
{
id: 1,
ballheadNumber: "B001",
deviceNumber: "D001",
purchaseTime: "2023-05-12 14:30",
status: "启用",
repositoryName: "一号仓库",
remark: "备注1"
},
{
id: 2,
ballheadNumber: "B002",
deviceNumber: "D002",
purchaseTime: "2023-05-12 14:30",
status: "禁用",
repositoryName: "二号仓库",
remark: "备注2"
},
{
id: 3,
ballheadNumber: "B003",
deviceNumber: "D003",
purchaseTime: "2023-05-12 14:30",
status: "启用",
repositoryName: "三号仓库",
remark: "备注3"
},
]);
const pageNum = ref(1); // 当前页码
const pageSize = ref(5); // 每页显示条数
const total = ref(20); // 总记录数
// 跳转到账号管理
const handleAccountManagement = (row) => {
console.log("账号管理", row);
router.push(`/accountManagement?enterpriseName=${row.name}`);
}
</script>
<style scoped lang="scss">
.MainBox {
padding: 20px;
height: 100%;
background: #F9FAFB;
}
.button-group {
display: flex;
justify-content: flex-start;
align-items: center;
gap: 10px;
}
.mg-2 {
margin: 20px 0px;
}
.card-box {
background: #fff;
padding: 16px;
border-radius: 4px;
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
overflow: hidden;
}
.pagination-container {
display: flex;
justify-content: space-between;
align-items: center;
margin-top: 16px;
}
.total-count {
color: #606266;
}
</style>