Skip to content

D
dd_zhxy
Commit 81d6bfa6 by duxingshan
Options

2023-08-09 DXS 

1、新增校产管理模块
2、物品借用前端样式页面编写
3、物品归还前端样式页面编写
4、物品领用前端样式页面编写
5、设备报修前端样式页面编写
6、物品借用新增、编辑、查看表单
parent 7cc6b51b
Showing with 638 additions and 29 deletions
src/assets/style/common.css 0 → 100644
/**
* Describe:公共样式
* Date:2023-08-08
*/
.flexBLock {
display: flex;
flex-direction: row;
align-items: center;
}
.searchBlock {
justify-content: space-between;
background-color: #FFF;
padding-right: 2%;
overflow-x: hidden;
}
.searchInput {
width: 93%;
}
.listBlock {
background: #FFFFFF;
padding: 15px;
font-size: 13px;
color: #333;
line-height: 25px;
position: relative;
border-radius: 8px;
margin: 10px;
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
}
.listBlock .flexBLock {
justify-content: space-between;
}
.formBlock {
background: #FFFFFF;
margin: 15px;
padding: 15px 0px;
border-radius: 8px;
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
}
src/main.js
...@@ -3,7 +3,7 @@ import App from "./App.vue"; ...@@ -3,7 +3,7 @@ import App from "./App.vue";
import router from "./router"; import router from "./router";
import store from "./store"; import store from "./store";
// import { Button } from "vant"; // import { Button } from "vant";
// // import { DatePicker } from 'vant'; // import { DatePicker } from 'vant';
// import { NavBar } from "vant"; // import { NavBar } from "vant";
// import { Rate } from "vant"; // import { Rate } from "vant";
// import { Search } from "vant"; // import { Search } from "vant";
...@@ -13,7 +13,7 @@ import store from "./store"; ...@@ -13,7 +13,7 @@ import store from "./store";
// import { Sticky } from "vant"; // import { Sticky } from "vant";
// import { Image as VanImage } from "vant"; // import { Image as VanImage } from "vant";
// import { Cell, CellGroup } from "vant"; // import { Cell, CellGroup } from "vant";
import { Form, Field, Uploader } from "vant"; import { Form, Field, Uploader,DatetimePicker,Calendar } from "vant";
// import { Picker } from "vant"; // import { Picker } from "vant";
// import { Popup } from "vant"; // import { Popup } from "vant";
// import { Toast } from "vant"; // import { Toast } from "vant";
...@@ -36,6 +36,8 @@ import "vue3-hash-calendar/es/index.css"; ...@@ -36,6 +36,8 @@ import "vue3-hash-calendar/es/index.css";
import "amfe-flexible/index.min.js"; import "amfe-flexible/index.min.js";
import "../rem.js"; import "../rem.js";
import "./assets/style/common.css"
const app = createApp(App); const app = createApp(App);
app.config.globalProperties.$imgUrl = "http://43.143.63.140:8095/"; app.config.globalProperties.$imgUrl = "http://43.143.63.140:8095/";
// process.env.NODE_ENV == "development" // process.env.NODE_ENV == "development"
...@@ -77,7 +79,7 @@ app ...@@ -77,7 +79,7 @@ app
// .use(ContactCard) // .use(ContactCard)
// .use(Calendar) // .use(Calendar)
// .use(Divider) // .use(Divider)
.use(Calendar)
.use(VueHashCalendar) .use(VueHashCalendar)
.use(Uploader); .use(Uploader).use(DatetimePicker);
// .use(DatePicker)
app.use(store).use(router).mount("#app"); app.use(store).use(router).mount("#app");
src/router/index.js
...@@ -223,30 +223,6 @@ const routes = [ ...@@ -223,30 +223,6 @@ const routes = [
name: "TeacherListTeac", name: "TeacherListTeac",
component: () => import("../views/teacher/TeacherListTeac.vue"), component: () => import("../views/teacher/TeacherListTeac.vue"),
}, },
/* 后勤报修 教师端的 */
{
path: "/logisticsRepair",
name: "logisticsRepair",
component: () => import("../views/teacher/logisticsRepair/index"),
},
/* 后勤报修新增 教师端的 */
{
path: "/addRepair",
name: "addRepair",
component: () => import("../views/teacher/logisticsRepair/addRepair"),
},
/* 后勤报修查看 教师端的 */
{
path: "/checkRepair",
name: "checkRepair",
component: () => import("../views/teacher/logisticsRepair/checkRepair"),
},
/* 后勤报修反馈 教师端的 */
{
path: "/feedbackRepair",
name: "feedbackRepair",
component: () => import("../views/teacher/logisticsRepair/feedbackRepair"),
},
// /* 课程表 */ // /* 课程表 */
// { // {
// path: "/gradeSchedule", // path: "/gradeSchedule",
...@@ -520,6 +496,81 @@ const routes = [ ...@@ -520,6 +496,81 @@ const routes = [
component: () => import("../views/parent/InforCollection/apply.vue"), component: () => import("../views/parent/InforCollection/apply.vue"),
}, },
/**
* Type：教师端
* Describe：后勤报修、校产管理
* Date：2023-08-08
**/
/* 后勤报修 */
{
path: "/logisticsRepair",
name: "logisticsRepair",
component: () => import("../views/teacher/logisticsRepair/index"),
},
/* 后勤报修新增 */
{
path: "/addRepair",
name: "addRepair",
component: () => import("../views/teacher/logisticsRepair/addRepair"),
},
/* 后勤报修查看 */
{
path: "/checkRepair",
name: "checkRepair",
component: () => import("../views/teacher/logisticsRepair/checkRepair"),
},
/* 后勤报修反馈 */
{
path: "/feedbackRepair",
name: "feedbackRepair",
component: () => import("../views/teacher/logisticsRepair/feedbackRepair"),
},
/** 校产管理 schoolProperty 管理员权限 教师权限 **/
// 管理员 首页
{
path: "/schoolProperty",
name: "adminIndex",
component: () => import("../views/teacher/schoolProperty"),
},
// 管理员 物品借用列表页
{
path: "/schoolProperty/borrow",
name: "adminBorrowList",
component: () => import("../views/teacher/schoolProperty/borrowList"),
},
// 管理员 物品借用 新增、编辑、查看页面
{
path: "/schoolProperty/borrow/detail",
name: "adminBorrowDetail",
component: () => import("../views/teacher/schoolProperty/borrowDetail"),
},
// 管理员 归还列表页
{
path: "/schoolProperty/return",
name: "adminReturnList",
component: () => import("../views/teacher/schoolProperty/returnList"),
},
// 管理员 物品领用列表页
{
path: "/schoolProperty/use",
name: "adminUseList",
component: () => import("../views/teacher/schoolProperty/useList"),
},
// 管理员 物品领用 新增
{
path: "/schoolProperty/use/add",
name: "adminUseAdd",
component: () => import("../views/teacher/schoolProperty/useAdd"),
},
// 管理员 设备报修列表页
{
path: "/schoolProperty/device",
name: "adminDeviceList",
component: () => import("../views/teacher/schoolProperty/deviceList"),
},
]; ];
const router = createRouter({ const router = createRouter({
...@@ -530,7 +581,7 @@ const router = createRouter({ ...@@ -530,7 +581,7 @@ const router = createRouter({
}); });
router.beforeEach((to, from, next) => { router.beforeEach((to, from, next) => {
console.log(to,from); // console.log(to,from);
if (to.name == "development") { if (to.name == "development") {
Toast("开发中"); Toast("开发中");
return; return;
......
src/views/tabbar/main/index.vue
...@@ -411,6 +411,14 @@ ...@@ -411,6 +411,14 @@
/> />
<span class="item_text">后勤报修</span> <span class="item_text">后勤报修</span>
</van-grid-item> </van-grid-item>
<!-- 2023-08-08 新增校产管理模块 -->
<van-grid-item icon="photo-o" text="校产管理" url="#/schoolProperty">
<van-image style="width: 48px" :src="require('@/assets/index/dcwj.png')"/>
<span class="item_text">校产管理</span>
</van-grid-item>
<!-- 2023-08-08 新增校产管理模块 -->
<!-- <van-grid-item icon="photo-o" text="我的领用" url=" #/myUse"> <!-- <van-grid-item icon="photo-o" text="我的领用" url=" #/myUse">
<van-image <van-image
style="width: 24px" style="width: 24px"
......
src/views/teacher/schoolProperty/borrowDetail.vue 0 → 100644
<template>
<van-nav-bar :title=title left-text="返回" left-arrow @click-left="goback"></van-nav-bar>
<van-form @submit="onSubmit" class="formBlock" label-align="right" label-width="110px">
<van-cell-group inset>
<van-field v-model="borrowForm.code" label="自编码" placeholder="请输入自编码"/>
<van-field v-model="borrowForm.code" label="设备名称" placeholder="请输入设备名称"/>
<van-field v-model="borrowForm.code" label="型号" placeholder="请输入型号"/>
<van-field is-link readonly v-model="dateChoose" label="借用日期" @click="showPicker = true"
placeholder="请选择借用日期"/>
<van-calendar v-model:show="showPicker" @confirm="onConfirm" />
<van-field v-model="borrowForm.code" label="借用人" placeholder="请输入借用人"/>
<van-field v-model="borrowForm.code" label="用途" placeholder="请输入用途"/>
<van-field v-model="borrowForm.code" label="借用期限(天)" placeholder="请输入借用期限"/>
<van-field is-link readonly v-model="dateChoose" label="归还时间" @click="showPicker = true"
placeholder="请选择归还时间"/>
<van-calendar v-model:show="showPicker" @confirm="onConfirm" />
<van-field v-model="borrowForm.code" label="归还时设备情况" placeholder="请输入归还时设备情况"/>
</van-cell-group>
<div>
<van-button class="sureBtn" round block type="primary" native-type="submit">确 定</van-button>
</div>
</van-form>
</template>
<script setup>
import { reactive, ref } from "vue";
import { useRouter } from "vue-router";
const router = useRouter();
let title = ref('物品借用新增') // 页面标题
let borrowForm = reactive({ // 表单数据
code:'',
dateChoose:'',
})
let dateChoose = ref('') // 借用日期
let showPicker = ref(false) //是否显示日历选择
const onConfirm = (date) => {
dateChoose.value = `${date.getFullYear()}-${date.getMonth() + 1}-${date.getDate()}`
showPicker.value = false;
};
//返回上一页
const goback = () => {
router.back();
};
//表单提交
const onSubmit = () => {
}
</script>
<style scoped>
.sureBtn {
margin: 30px auto;
width: 80%;
}
.van-cell-group--inset {
margin: 0px;
}
</style>
src/views/teacher/schoolProperty/borrowList.vue 0 → 100644
<template>
<van-nav-bar title="物品借用" left-text="返回" left-arrow @click-left="goback"></van-nav-bar>
<div class="flexBLock searchBlock">
<van-search class="searchInput" v-model="searchKey" placeholder="请输入搜索关键词" />
<van-icon name="scan" />
</div>
<van-pull-refresh v-model="pullLoading" @refresh="onRefresh">
<van-list v-model:loading="loading" :finished="finished" finished-text="没有更多了" @load="getList">
<div v-for="(item,index) in list" :key="index" class="listBlock" @click="toDetailPage">
<div class="flexBLock">
<div>
<div>型号：联想Y0079</div>
<div>自编码：202308081101</div>
<div>设备名称：笔记本</div>
<div>借用人：张蔷</div>
<div>借用日期：2023-08-08 12:32:30</div>
<div>用途：用于课上办公</div>
</div>
<div class="listLeft">
<div>7</div>
<div>借用期限（天）</div>
</div>
</div>
<div class="waitReturn">待归还</div>
<div class="endReturn">已归还</div>
</div>
</van-list>
</van-pull-refresh>
</template>
<script setup>
import { useRouter } from "vue-router";
import { ref } from "vue";
const router = useRouter();
let searchKey = ref('')
const loading = ref(false)
const list = ref([1,2,3,4,5]);
const pullLoading = ref(false);
const finished = ref(false);
//获取列表数据
const getList = () => {
}
//跳转详情页面
const toDetailPage = () => {
router.push({
path: "/schoolProperty/borrow/detail",
})
}
//返回上一页
const goback = () => {
router.back();
};
//下拉刷新
const onRefresh = () => {
};
</script>
<style scoped>
.listLeft {
text-align: center;
}
.listLeft div:first-child {
color: rgb(57, 190, 254);
font-weight: bold;
font-size: 50px;
padding-bottom: 20px;
}
.waitReturn,.endReturn {
position: absolute;
width: 80px;
color: #FFFFFF;
text-align: center;
top: 10px;
right: 0px;
border-bottom-left-radius: 18px;
border-top-left-radius: 18px;
}
.waitReturn {
background-color: #D5003A;
}
.endReturn {
background-color: #FEAF00;
}
</style>
src/views/teacher/schoolProperty/deviceList.vue 0 → 100644
<template>
<van-nav-bar title="设备报修" left-text="返回" left-arrow @click-left="goback"></van-nav-bar> <div class="flexBLock searchBlock">
<van-search class="searchInput" v-model="searchKey" placeholder="请输入搜索关键词" />
<van-icon name="scan" />
</div>
<van-pull-refresh v-model="pullLoading" @refresh="onRefresh">
<van-list v-model:loading="loading" :finished="finished" finished-text="没有更多了" @load="getList">
<div v-for="(item,index) in list" :key="index" class="listBlock">
<div>自编码：202308081101</div>
<div>设备名称：笔记本</div>
<div>型号：联想Y0079</div>
<div>投产日期：2023-08-08 12:32:30</div>
<div>地点：教学楼603</div>
<div>报修日期：2023-08-08 12:32:30</div>
<div>报修人：张蔷</div>
<div>问题：笔记本无法打开</div>
<div class="flexBLock btnBlock">
<van-button size="small" round type="primary" class="btn">修 改</van-button>
<van-button size="small" round type="success" class="btn">反 馈</van-button>
<van-button size="small" round type="default" class="btn">查 看</van-button>
<van-button size="small" round type="danger" class="btn">删 除</van-button>
</div>
</div>
</van-list>
</van-pull-refresh>
</template>
<script setup>
import { useRouter } from "vue-router";
import {ref} from "vue";
const router = useRouter();
let searchKey = ref('')
const loading = ref(false)
const list = ref([1,2,3,4,5]);
const pullLoading = ref(false);
const finished = ref(false);
//获取列表数据
const getList = () => {
}
//返回上一页
const goback = () => {
router.back();
};
//下拉刷新
const onRefresh = () => {
};
</script>
<style scoped>
.btnBlock {
flex-wrap: wrap;
}
.btn {
width: 75px;
margin-top: 10px;
}
</style>
src/views/teacher/schoolProperty/index.vue 0 → 100644
<template>
<van-nav-bar title="校产管理" left-text="返回" left-arrow @click-left="goback"></van-nav-bar>
<div class="borrowBlock" @click="toPage(3)">
<van-image class="leftImg" :src="require('../../../assets/icon/wallet.png')"/>
<div>物品借用</div>
</div>
<div class="returnBlock" @click="toPage(0)">
<van-image class="leftImg" :src="require('../../../assets/icon/return.png')"/>
<div>物品归还</div>
</div>
<div class="useBlock" @click="toPage(1)">
<van-image class="leftImg" :src="require('../../../assets/icon/use.png')"/>
<div>物品领用</div>
</div>
<div class="deviceBlock" @click="toPage(2)">
<van-image class="leftImg" :src="require('../../../assets/icon/device.png')"/>
<div>设备报修</div>
</div>
</template>
<script setup>
import { useRouter } from "vue-router";
const router = useRouter();
const toPage = (type) => {
if(type == 0){
// 归还管理
router.push({
path: "/schoolProperty/return",
});
}else if (type == 1){
// 物品领用
router.push({
path: "/schoolProperty/use",
});
}else if (type == 2){
// 设备报修
router.push({
path: "/schoolProperty/device",
});
}else {
// 物品借用
router.push({
path: "/schoolProperty/borrow",
});
}
}
//返回上一页
const goback = () => {
router.back();
}
</script>
<style scoped>
.returnBlock,.deviceBlock,.useBlock,.borrowBlock {
padding: 20px 30px;
border-radius: 12px;
color: #FFFFFF;
margin: 15px;
display: flex;
flex-direction: row;
align-items: center;
font-size: 23px;
font-weight: bold;
}
.borrowBlock {
background: linear-gradient(to right, #F4F484, #89C7CB);
}
.returnBlock {
background: linear-gradient(to right, #89C7CB, #7271C1);
}
.deviceBlock {
background: linear-gradient(to right, #F4F484, #FDAE86);
}
.useBlock {
background: linear-gradient(to right, #FDAE86, #EA4A6B);
}
.leftImg {
width: 56px;
height: 56px;
margin-right: 13%;
}
</style>
src/views/teacher/schoolProperty/returnList.vue 0 → 100644
<template>
<van-nav-bar title="归还管理" left-text="返回" left-arrow @click-left="goback"></van-nav-bar>
<div class="flexBLock searchBlock">
<van-search class="searchInput" v-model="searchKey" placeholder="请输入搜索关键词" />
<van-icon name="scan" />
</div>
<van-pull-refresh v-model="pullLoading" @refresh="onRefresh">
<van-list v-model:loading="loading" :finished="finished" finished-text="没有更多了" @load="getList">
<div v-for="(item,index) in list" :key="index" class="listBlock">
<div class="flexBLock">
<div>
<div>型号：联想Y0079</div>
<div>自编码：202308081101</div>
<div>借用人：张蔷</div>
<div>借用日期：2023-08-08 12:32:30</div>
<div>接收人：张蔷</div>
<div>归还日期：2023-08-08 12:32:30</div>
<div>归还时设备情况：良好</div>
</div>
<div class="listLeft">
<div>7</div>
<div>借用期限（天）</div>
</div>
</div>
<div>备注：已借用取回，暂不外借，设备换修。已借用取回，暂不外借，设备换修。</div>
<div class="waitReturn">待归还</div>
<div class="endReturn">已归还</div>
</div>
</van-list>
</van-pull-refresh>
</template>
<script setup>
import { useRouter } from "vue-router";
import { ref } from "vue";
const router = useRouter();
let searchKey = ref('')
const loading = ref(false)
const list = ref([1,2,3,4,5]);
const pullLoading = ref(false);
const finished = ref(false);
//获取列表数据
const getList = () => {
}
//返回上一页
const goback = () => {
router.back();
};
//下拉刷新
const onRefresh = () => {
};
</script>
<style scoped>
.listLeft {
text-align: center;
}
.listLeft div:first-child {
color: rgb(57, 190, 254);
font-weight: bold;
font-size: 50px;
padding-bottom: 20px;
}
.waitReturn,.endReturn {
position: absolute;
width: 80px;
color: #FFFFFF;
text-align: center;
top: 10px;
right: 0px;
border-bottom-left-radius: 18px;
border-top-left-radius: 18px;
}
.waitReturn {
background-color: #D5003A;
}
.endReturn {
background-color: #FEAF00;
}
</style>
src/views/teacher/schoolProperty/useAdd.vue 0 → 100644
<template>
<van-nav-bar title="新增物品领用" left-text="返回" left-arrow @click-left="goback"></van-nav-bar>
</template>
<script setup>
import { useRouter } from "vue-router";
const router = useRouter();
//返回上一页
const goback = () => {
router.back();
};
</script>
<style scoped>
</style>
src/views/teacher/schoolProperty/useList.vue 0 → 100644
<template>
<van-nav-bar title="物品领用" left-text="返回" left-arrow @click-left="goback"></van-nav-bar>
<div class="flexBLock searchBlock">
<van-search class="searchInput" v-model="searchKey" placeholder="请输入搜索关键词" />
<van-icon @click="sacnClick" name="scan" />
</div>
<van-pull-refresh v-model="pullLoading" @refresh="onRefresh">
<van-list v-model:loading="loading" :finished="finished" finished-text="没有更多了" @load="getList">
<div v-for="(item,index) in list" :key="index" class="listBlock">
<div class="flexBLock useBlock">
<div>
<div>型号：联想Y0079</div>
<div>自编码：202308081101</div>
<div>领用人：张蔷</div>
<div>设备名称：笔记本</div>
</div>
<div class="listLeft">
<div>2023-08-08</div>
<div>领用日期</div>
</div>
</div>
<div class="ywxBlock">已接单 — 已维修</div>
<div class="wfwxBlock">已接单 — 无法维修</div>
<div class="wjdBlock">未接单</div>
</div>
</van-list>
</van-pull-refresh>
</template>
<script setup>
import { useRouter } from "vue-router";
import {ref} from "vue";
const router = useRouter();
let searchKey = ref('')
const loading = ref(false)
const list = ref([1,2,3,4,5]);
const pullLoading = ref(false);
const finished = ref(false);
//获取列表数据
const getList = () => {
}
//扫码
const sacnClick = () =>{
router.push({
path: "/schoolProperty/use/add",
})
}
//返回上一页
const goback = () => {
router.back();
};
//下拉刷新
const onRefresh = () => {
};
</script>
<style scoped>
.ywxBlock,.wfwxBlock,.wjdBlock {
position: absolute;
font-size: 12px;
font-weight: 500;
width: 120px;
color: #FFFFFF;
text-align: center;
top: 20px;
right: 0px;
border-bottom-left-radius: 18px;
border-top-left-radius: 18px;
}
.ywxBlock {
background-color: #D3DD18;
}
.wfwxBlock {
background-color: #0191B4;
}
.wjdBlock {
width: 80px!important;
background-color: #B0B5B5;
}
.useBlock {
align-items: flex-end!important;
}
.listLeft {
text-align: center;
}
.listLeft div:first-child {
color: rgb(57, 190, 254);
font-weight: bold;
font-size: 18px;
}
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment