|
@@ -1,8 +1,213 @@
|
|
|
<template>
|
|
|
<view class="home">
|
|
|
<view class="detail-area">
|
|
|
- <u-list>
|
|
|
- </u-list>
|
|
|
+ <view class="layout-row">
|
|
|
+ <u-row
|
|
|
+ justify="space-between"
|
|
|
+ gutter="10">
|
|
|
+ <u-col span="4">
|
|
|
+ <view class="demo-layout">
|
|
|
+ 资产编号
|
|
|
+ </view>
|
|
|
+ </u-col>
|
|
|
+ <u-col span="8" >
|
|
|
+ <view class="demo-layout">001077-00007335</view>
|
|
|
+ </u-col>
|
|
|
+ </u-row>
|
|
|
+ </view>
|
|
|
+ <view class="layout-row">
|
|
|
+ <u-row
|
|
|
+ justify="space-between"
|
|
|
+ gutter="10">
|
|
|
+ <u-col span="4">
|
|
|
+ <view class="demo-layout">资产名称</view>
|
|
|
+ </u-col>
|
|
|
+ <u-col span="8">
|
|
|
+ <view class="demo-layout">放免防护屏</view>
|
|
|
+ </u-col>
|
|
|
+ </u-row>
|
|
|
+ </view>
|
|
|
+ <view class="layout-row">
|
|
|
+ <u-row
|
|
|
+ justify="space-between"
|
|
|
+ gutter="10">
|
|
|
+ <u-col span="4">
|
|
|
+ <view class="demo-layout">资产种类</view>
|
|
|
+ </u-col>
|
|
|
+ <u-col span="8">
|
|
|
+ <view class="demo-layout">固定资产</view>
|
|
|
+ </u-col>
|
|
|
+ </u-row>
|
|
|
+ </view>
|
|
|
+ <view class="layout-row">
|
|
|
+ <u-row
|
|
|
+ justify="space-between"
|
|
|
+ gutter="10">
|
|
|
+ <u-col span="4">
|
|
|
+ <view class="demo-layout">资产分类</view>
|
|
|
+ </u-col>
|
|
|
+ <u-col span="8">
|
|
|
+ <view class="demo-layout">[3220399]其他医用电子仪器</view>
|
|
|
+ </u-col>
|
|
|
+ </u-row>
|
|
|
+ </view>
|
|
|
+ <view class="layout-row">
|
|
|
+ <u-row
|
|
|
+ justify="space-between"
|
|
|
+ gutter="10">
|
|
|
+ <u-col span="4">
|
|
|
+ <view class="demo-layout">使用部门</view>
|
|
|
+ </u-col>
|
|
|
+ <u-col span="8">
|
|
|
+ <view class="demo-layout">生物医学工程系实验中心</view>
|
|
|
+ </u-col>
|
|
|
+ </u-row>
|
|
|
+ </view>
|
|
|
+ <view class="layout-row">
|
|
|
+ <u-row
|
|
|
+ justify="space-between"
|
|
|
+ gutter="10">
|
|
|
+ <u-col span="4">
|
|
|
+ <view class="demo-layout">资产原值(元)</view>
|
|
|
+ </u-col>
|
|
|
+ <u-col span="8">
|
|
|
+ <view class="demo-layout">1820.00</view>
|
|
|
+ </u-col>
|
|
|
+ </u-row>
|
|
|
+ </view>
|
|
|
+ <view class="layout-row">
|
|
|
+ <u-row
|
|
|
+ justify="space-between"
|
|
|
+ gutter="10">
|
|
|
+ <u-col span="4">
|
|
|
+ <view class="demo-layout">数量</view>
|
|
|
+ </u-col>
|
|
|
+ <u-col span="8">
|
|
|
+ <view class="demo-layout">1</view>
|
|
|
+ </u-col>
|
|
|
+ </u-row>
|
|
|
+ </view>
|
|
|
+ <view class="layout-row">
|
|
|
+ <u-row
|
|
|
+ justify="space-between"
|
|
|
+ gutter="10">
|
|
|
+ <u-col span="4">
|
|
|
+ <view class="demo-layout">存放地点</view>
|
|
|
+ </u-col>
|
|
|
+ <u-col span="8">
|
|
|
+ <view class="demo-layout">番禺A1-512</view>
|
|
|
+ </u-col>
|
|
|
+ </u-row>
|
|
|
+ </view>
|
|
|
+ <view class="layout-row">
|
|
|
+ <u-row
|
|
|
+ justify="space-between"
|
|
|
+ gutter="10">
|
|
|
+ <u-col span="4">
|
|
|
+ <view class="demo-layout">登记人</view>
|
|
|
+ </u-col>
|
|
|
+ <u-col span="8">
|
|
|
+ <view class="demo-layout">超级用户</view>
|
|
|
+ </u-col>
|
|
|
+ </u-row>
|
|
|
+ </view>
|
|
|
+ <view class="layout-row">
|
|
|
+ <u-row
|
|
|
+ justify="space-between"
|
|
|
+ gutter="10">
|
|
|
+ <u-col span="4">
|
|
|
+ <view class="demo-layout">取得日期</view>
|
|
|
+ </u-col>
|
|
|
+ <u-col span="8">
|
|
|
+ <view class="demo-layout">2022-12-14</view>
|
|
|
+ </u-col>
|
|
|
+ </u-row>
|
|
|
+ </view>
|
|
|
+ <view class="layout-row">
|
|
|
+ <u-row
|
|
|
+ justify="space-between"
|
|
|
+ gutter="10">
|
|
|
+ <u-col span="4">
|
|
|
+ <view class="demo-layout">资产用途</view>
|
|
|
+ </u-col>
|
|
|
+ <u-col span="8">
|
|
|
+ <view class="demo-layout">培训教学</view>
|
|
|
+ </u-col>
|
|
|
+ </u-row>
|
|
|
+ </view>
|
|
|
+ <view class="layout-row">
|
|
|
+ <u-row
|
|
|
+ justify="space-between"
|
|
|
+ gutter="10">
|
|
|
+ <u-col span="4">
|
|
|
+ <view class="demo-layout">规格型号</view>
|
|
|
+ </u-col>
|
|
|
+ <u-col span="8">
|
|
|
+ <view class="demo-layout">RKD-01</view>
|
|
|
+ </u-col>
|
|
|
+ </u-row>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="borrow-date" v-if="status==1">
|
|
|
+ <view class="layout-row">
|
|
|
+ <u-row
|
|
|
+ justify="space-between"
|
|
|
+ gutter="10">
|
|
|
+ <u-col span="4">
|
|
|
+ <view class="demo-layout">借用日期</view>
|
|
|
+ </u-col>
|
|
|
+ <u-col span="8">
|
|
|
+ <view class="demo-layout">
|
|
|
+ <u--input
|
|
|
+ placeholder="请输入内容"
|
|
|
+ border="none"
|
|
|
+ v-model="borrowDate"
|
|
|
+ @focus="borrowShow = true"
|
|
|
+ ></u--input>
|
|
|
+ <u-datetime-picker
|
|
|
+ :show="borrowShow"
|
|
|
+ v-model="borrowValue"
|
|
|
+ mode="datetime"
|
|
|
+ @confirm="changeDate"
|
|
|
+ @cancel="borrowShow = false"
|
|
|
+ ></u-datetime-picker>
|
|
|
+ </view>
|
|
|
+ </u-col>
|
|
|
+ </u-row>
|
|
|
+ </view>
|
|
|
+ <view class="layout-row">
|
|
|
+ <u-row
|
|
|
+ justify="space-between"
|
|
|
+ gutter="10">
|
|
|
+ <u-col span="4">
|
|
|
+ <view class="demo-layout">归还日期</view>
|
|
|
+ </u-col>
|
|
|
+ <u-col span="8">
|
|
|
+ <view class="demo-layout">
|
|
|
+ <u--input
|
|
|
+ placeholder="请输入内容"
|
|
|
+ border="none"
|
|
|
+ v-model="returnDate"
|
|
|
+ @focus="returnShow = true"
|
|
|
+ ></u--input>
|
|
|
+ <u-datetime-picker
|
|
|
+ :show="returnShow"
|
|
|
+ v-model="returnValue"
|
|
|
+ mode="datetime"
|
|
|
+ @confirm="returnChange"
|
|
|
+ @cancel="returnShow = false"
|
|
|
+ ></u-datetime-picker>
|
|
|
+ </view>
|
|
|
+ </u-col>
|
|
|
+ </u-row>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="btn-area">
|
|
|
+ <u-button text="借用" color="#000" v-if="status==1">借用</u-button>
|
|
|
+ <u-button text="归还" color="#000" v-else-if="status==2">归还</u-button>
|
|
|
+ </view>
|
|
|
+ <view class="repair-btn">
|
|
|
+ <i class="iconfont icon-a-shezhi2"></i>
|
|
|
</view>
|
|
|
</view>
|
|
|
</template>
|
|
@@ -11,11 +216,29 @@
|
|
|
export default {
|
|
|
data() {
|
|
|
return {
|
|
|
-
|
|
|
+ borrowDate:this.$core.dateToString(new Date()),
|
|
|
+ returnDate:this.$core.dateToString(new Date()),
|
|
|
+ borrowShow:false,
|
|
|
+ borrowValue:Number(new Date()),
|
|
|
+ returnShow:false,
|
|
|
+ returnValue:Number(new Date()),
|
|
|
+ status:1
|
|
|
};
|
|
|
},
|
|
|
onLoad:function(option){
|
|
|
console.log(option.number)
|
|
|
+ },
|
|
|
+ methods:{
|
|
|
+ changeDate(val){
|
|
|
+ let date = this.$core.dateToString(val.value);
|
|
|
+ this.borrowDate = date
|
|
|
+ this.borrowShow = false
|
|
|
+ },
|
|
|
+ returnChange(val){
|
|
|
+ let date = this.$core.dateToString(val.value);
|
|
|
+ this.returnDate = date
|
|
|
+ this.returnShow = false
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
</script>
|
|
@@ -29,8 +252,45 @@
|
|
|
box-sizing: border-box;
|
|
|
}
|
|
|
.detail-area{
|
|
|
- height: 65%;
|
|
|
- background-color: $uni-bg-color-grey;
|
|
|
+ height: 72%;
|
|
|
border: 1px solid $uni-border-black;
|
|
|
+ padding: 0 20rpx;
|
|
|
+ overflow-y: scroll;
|
|
|
+}
|
|
|
+.borrow-date{
|
|
|
+ border: 1px solid $uni-border-black;
|
|
|
+ padding: 0 20rpx;
|
|
|
+ margin-top: 20rpx;
|
|
|
+}
|
|
|
+.layout-row{
|
|
|
+ border-top: 2rpx solid #999999;
|
|
|
+ padding: 20rpx 0 ;
|
|
|
+}
|
|
|
+.demo-layout {
|
|
|
+ height: 25px;
|
|
|
+}
|
|
|
+.btn-area{
|
|
|
+ margin-top: 20rpx;
|
|
|
+ padding: 0 250rpx;
|
|
|
+}
|
|
|
+.repair-btn{
|
|
|
+ width: 80rpx;
|
|
|
+ height: 80rpx;
|
|
|
+ color: rgba(80, 80, 80, 1);
|
|
|
+ border-radius: 21px;
|
|
|
+ line-height: 150%;
|
|
|
+ box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.5);
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ text-align: center;
|
|
|
+ flex-direction: column;
|
|
|
+ font-size: 36rpx;
|
|
|
+ position: fixed;
|
|
|
+ bottom: 20rpx;
|
|
|
+ right: 20rpx;
|
|
|
+ .iconfont{
|
|
|
+ font-size: 42rpx;
|
|
|
+ }
|
|
|
}
|
|
|
</style>
|