From dff404a76987de5b632ae635a6dea6c95dc37a4d Mon Sep 17 00:00:00 2001
From: licp <lichunping@guanfang.com.cn>
Date: 星期三, 17 四月 2024 16:58:59 +0800
Subject: [PATCH] 合并冲突
---
src/components/view/index-index.vue | 520 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 516 insertions(+), 4 deletions(-)
diff --git a/src/components/view/index-index.vue b/src/components/view/index-index.vue
index 479fcde..4743c4e 100644
--- a/src/components/view/index-index.vue
+++ b/src/components/view/index-index.vue
@@ -1,16 +1,528 @@
<style scoped>
+ .index {
+ width: 100%;
+ height: calc(100% - 50px);
+ overflow-y: auto;
+ padding: 25px 0;
+ }
+
+ .left-1 {
+ background-image: url("../../../static/img/棣栭〉鍥剧墖1.png");
+ background-size: 100% 100%;
+ height: 118px;
+ margin-bottom: 16px;
+ border-radius: 16px;
+ }
+
+ .left-1 .say {
+ height: 100%;
+ display: flex;
+ align-items: center;
+ margin-left: 15%;
+ width: 45%;
+ }
+
+ .left-1 .say div {
+ color: #fff;
+ margin: 4px 0;
+ }
+
+ .left-1 .say-1 {
+ font-size: 18px;
+ }
+
+ .left-1 .say-2 {
+ font-size: 17px;
+ }
+
+ ::-webkit-scrollbar {
+ width: 0px;
+ }
+
+ ::-webkit-scrollbar-thumb {
+ background-color: transparent;
+ border-radius: 3px;
+ }
+
+ .card{
+ background: #FFFFFF;
+ border-radius: 16px;
+ width: 100%;
+ box-sizing: border-box;
+ }
+
+ .right-1{
+ padding: 14px 10px 4px;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ margin-bottom: 16px;
+ }
+
+ .right-1-item{
+ width: 25%;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ }
+
+ .right-1-item .mun{
+ margin-left: 6px;
+ color: #0166E2;
+ }
+
+ .right-2{
+ padding: 13px 20px;
+ margin-bottom: 16px;
+ }
+
+ .right-2-title{
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ }
+
+ .right-2-body{
+ width: 100%;
+ margin-top: 20px;
+ display: flex;
+ align-items: start;
+ justify-content: space-between;
+ }
+ >>>.el-calendar__header {
+ display: none;
+ }
+ >>>.el-calendar__body{
+ padding: 0;
+ }
+ >>>.el-calendar-table:not(.is-range) td.next {
+ /*闅愯棌涓嬩釜鏈堢殑鏃ユ湡*/
+ display: none;
+ }
+ >>>.el-calendar-day{
+ height: 40px;
+ }
+ >>>.el-calendar-table td{
+ border: 0;
+ font-size: 14px;
+ }
+ >>>.el-calendar-table tr td:first-child{
+ border-left: 0;
+ }
+ .control{
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ box-sizing: border-box;
+ padding: 0px 0 10px;
+ }
+ .control .el-button{
+ width: 32px;
+ height: 32px;
+ border-radius: 8px;
+ border: 1px solid #E8E8E8;
+ background: #fff;
+ padding: 0;
+ color: #0166E2;
+ font-size: 20px;
+ }
+ .list2-item{
+ line-height: 22px;
+ display: flex;
+ margin-bottom: 13px;
+ font-size: 14px;
+ }
+ .right-3{
+ }
+ .right-3-tab{
+ display: flex;
+ align-items: center;
+ margin-bottom: 16px;
+ }
+ .tab-item{
+ width: 50%;
+ box-sizing: border-box;
+ text-align: center;
+ padding: 16px 0;
+ font-size: 20px;
+ background: #F5F7FB;
+ color: #333333;
+ }
+ .tab-item.active{
+ background: #fff;
+ color: #FF3838;
+ }
+ .right-3-list{
+ padding: 0 12px 16px;
+ }
+ .list3-item{
+ padding: 6px 4px;
+ margin: 8px 0;
+ }
+ .list3-item:hover{
+ background: rgba(58, 123, 250,0.05);
+ }
+ .list3-item-title{
+ display: flex;
+ align-items: start;
+ margin-bottom: 10px;
+ }
+ .list3-item-info{
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ color: #666666;
+ font-size: 14px;
+ }
+ .left-2{
+ display: flex;
+ align-items: flex-start;
+ margin-bottom: 16px;
+ }
+ .left-2-item{
+ width: 14.1%;
+ border-right: 1px solid #F1F1F1;
+ }
+ .left-2-item:nth-last-child(1){
+ border-right: 0;
+ }
+ .left-2-item:hover{
+ background: rgba(58,123,250,0.05);
+ }
+ .left-2-item:hover .left-item-title span{
+ color: #3A7BFA !important;
+ }
+ .left-item-title{
+ border-bottom: 1px solid #F1F1F1;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ padding: 20px 0;
+ }
+ .left-item-body{
+ box-sizing: border-box;
+ padding: 5px;
+ max-height: 711px;
+ overflow-y: auto;
+ }
+ .body-item{
+ background: #70A090;
+ border-radius: 16px;
+ overflow: hidden;
+ margin-bottom: 8px;
+ }
+ .body-item>div{
+ height: calc(100% - 16px);
+ margin-top: 16px;
+ background: rgba(255, 255, 255,0.9);
+ padding: 8px 8px 16px;
+ display: flex;
+ flex-direction: column;
+ }
+ .search_thing {
+ height: 50px;
+ margin-bottom: 26px;
+ }
+
+ .search_label {
+ width: 120px;
+ font-size: 14px;
+ text-align: left;
+ margin-bottom: 10px;
+ }
+
</style>
<template>
- <div class="index">棣栭〉</div>
+ <div class="index">
+ <el-row :gutter="25">
+ <el-col :xs="24" :sm="24" :md="14" :lg="14" :xl="14">
+ <div class="left-1">
+ <div class="say">
+ <div style="display: flex;align-items: center;flex-wrap: wrap;">
+ <div class="say-1">{{user.name}} 鎮ㄥソ锛佺鎮ㄥ紑蹇冩瘡涓�澶�</div>
+ <div class="say-2">褰撳墠鏃堕棿锛� {{now}}</div>
+ </div>
+ </div>
+ </div>
+ <div class="left-2 card">
+ <div class="left-2-item" v-for="(item,index) in 7" :key="index">
+ <div class="left-item-title">
+ <span style="font-size: 18px;">25</span>
+ <span style="font-size: 14px;color: #999999;">鏄熸湡鍥�</span>
+ </div>
+ <div class="left-item-body">
+ <div class="body-item" v-for="(m,i) in 8" :key="i">
+ <div>
+ <span style="font-size: 12px;margin-bottom: 17px;">濮旀墭璁㈠崟WT20230101 -001妫�娴�</span>
+ <el-image style="height: 24px;width: 24px;border-radius: 50%;">
+ <div slot="error" class="image-slot">
+ <i class="el-icon-picture-outline"></i>
+ </div>
+ </el-image>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </el-col>
+ <el-col :xs="24" :sm="24" :md="10" :lg="10" :xl="10">
+ <div class="right-1 card">
+ <div class="right-1-item">
+ <div class="img">
+ <img src="../../../static/img/index-0.svg" alt="">
+ </div>
+ <div class="mun">
+ <p style="font-size: 20px;">254</p>
+ <p style="font-size: 14px;margin-bottom: 10px;">鎴戠殑浠ｅ姙</p>
+ </div>
+ </div>
+ <div class="right-1-item">
+ <div class="img">
+ <img src="../../../static/img/index-1.svg" alt="">
+ </div>
+ <div class="mun">
+ <p style="font-size: 20px;">254</p>
+ <p style="font-size: 14px;margin-bottom: 10px;">宸插姙浜嬪疁</p>
+ </div>
+ </div>
+ <div class="right-1-item">
+ <div class="img">
+ <img src="../../../static/img/index-2.svg" alt="">
+ </div>
+ <div class="mun">
+ <p style="font-size: 20px;">254</p>
+ <p style="font-size: 14px;margin-bottom: 10px;">鍓╀綑寰呭姙</p>
+ </div>
+ </div>
+ <div class="right-1-item">
+ <div class="img">
+ <img src="../../../static/img/index-3.svg" alt="">
+ </div>
+ <div class="mun">
+ <p style="font-size: 20px;">254</p>
+ <p style="font-size: 14px;margin-bottom: 10px;">杩戞湡浜嬪疁</p>
+ </div>
+ </div>
+ </div>
+ <div class="right-2 card">
+ <div class="right-2-title">
+ <span style="color: #333333;font-size: 16px;">鎴戠殑鏃ョ▼</span>
+ <span style="cursor: pointer;font-size: 12px;
+color: #3A7BFA;" @click="dialogVisible=true">娣诲姞鎴戠殑鏃ョ▼</span>
+ </div>
+ <div class="right-2-body">
+ <div class="calendar" style="width: 49%;">
+ <div class="control">
+ <el-button class="prevm" @click="prevMonth(calendarValue)" icon="el-icon-arrow-left"></el-button>
+ <span>{{ calendarValue.getFullYear()+'骞�'+(calendarValue.getMonth() + 1)+'鏈�' }}</span>
+ <el-button class="nextm" @click="nextMonth(calendarValue)" icon="el-icon-arrow-right"></el-button>
+ </div>
+ <el-calendar v-model="calendarValue">
+ <template
+ slot="dateCell"
+ slot-scope="{date, data}">
+ <span>
+ {{ data.day.split('-').slice(2)+'' }}
+ </span>
+ <el-badge v-if="data.isSelected" is-dot class="item">
+ </el-badge>
+ </template>
+ </el-calendar>
+ </div>
+ <div class="right-2-list" style="width: 49%;">
+ <div class="list2-item" v-for="(m,i) in 5" :key="i">
+ <span>14:00</span>
+ <el-tooltip style="margin-left: 10px;" effect="dark" content="鍙傚姞LIMS绯荤粺鍩硅浼氳锛屽苟绛句笂绾夸笂绾夸笂绾夸笂绾夸笂绾夸笂绾�" placement="top">
+ <p class="ellipsis-multiline" >鍙傚姞LIMS绯荤粺鍩硅浼氳锛屽苟绛句笂绾夸笂绾夸笂绾夸笂绾夸笂绾夸笂绾�</p>
+ </el-tooltip>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="right-3 card" style="overflow: hidden;">
+ <div class="right-3-tab">
+ <div class="tab-item" style="cursor: pointer;" :class="{active:currentIndex==0}" @click="currentIndex=0">棰勮鎻愰啋 10</div>
+ <div class="tab-item" style="cursor: pointer;" :class="{active:currentIndex==1}" @click="currentIndex=1">閫氱煡閫氬憡 12</div>
+ </div>
+ <div class="right-3-list">
+ <div class="list3-item" v-for="(m,i) in 5" :key="i">
+ <div class="list3-item-title">
+ <img src="../../../static/img/index-tip.svg" alt="">
+ <p>璁惧鍒版湡鎻愰啋</p>
+ </div>
+ <div class="list3-item-info">
+ <p>缂栧彿<span style="color:#3A7BFA;"> SB20240101-001 </span>鐨勮澶囧皢浜�2023-09-09 11:11:11杩囨湡</p>
+ <p>2023-09-09 09:09:09</p>
+ </div>
+ </div>
+ </div>
+ </div>
+ </el-col>
+ </el-row>
+ <el-dialog title="鏃ョ▼娣诲姞" :visible.sync="dialogVisible" width="400px">
+ <div class="body" style="max-height: 60vh;">
+ <el-row>
+ <el-col class="search_thing" :span="22">
+ <div class="search_label">鏃堕棿锛�</div>
+ <div class="search_input">
+ <el-date-picker
+ v-model="query.time"
+ type="datetime"
+ placeholder="閫夋嫨鏃ユ湡鏃堕棿"
+ size="small"
+ style="width:100%">
+ </el-date-picker>
+ </div>
+ </el-col>
+ <el-col class="search_thing" :span="22">
+ <div class="search_label">鍐呭锛�</div>
+ <div class="search_input">
+ <el-input v-model="query.content" size="small" placeholder="璇疯緭鍏ュ唴瀹�"></el-input>
+ </div>
+ </el-col>
+ </el-row>
+ </div>
+ <span slot="footer" class="dialog-footer">
+ <el-row>
+ <el-button @click="handleCancel">鍙� 娑�</el-button>
+ <el-button type="primary" @click="submit" :loading="loading">纭� 瀹�</el-button>
+ </el-row>
+ </span>
+ </el-dialog>
+ </div>
</template>
<script>
- export default{
+ export default {
data() {
- return{}
+ return {
+ user: {},
+ now: null,
+ calendarValue: new Date(),
+ currentIndex:0,
+ dialogVisible:false,
+ query:{
+ time:'',
+ content:''
+ },
+ loading:false
+ }
},
mounted() {
+ this.user = JSON.parse(localStorage.getItem('user'))
+ this.nowTime()
+ // this.getDataList()
+ setInterval(() => {
+ this.nowTime()
+ }, 1000)
+ },
+ methods: {
+ nowTime() {
+ var date = new Date();
+ var y = date.getFullYear();
+ var m = date.getMonth() + 1;
+ var d = date.getDate();
+ var h = date.getHours();
+ this.timeH = h
+ var min = date.getMinutes();
+ var s = date.getSeconds();
+ if (s < 10) {
+ s = "0" + s;
+ }
+ if (min < 10) {
+ min = "0" + min;
+ }
+ if (h < 10) {
+ h = "0" + h;
+ }
+ if (d < 10) {
+ d = "0" + d;
+ }
+ if (m < 10) {
+ m = "0" + m;
+ }
+ this.now = y + "-" + m + "-" + d + " " + h + ":" + min + ":" + s;
+ },
+ getDataList() {
+ this.$axios.get(this.$api.dataReporting.getDataList).then(res => {
+ this.data = res.data
+ })
+ },
+ nextMonth(value) {
+ let year = this.calendarValue.getFullYear();// 褰撳墠骞翠唤
+ let month = this.calendarValue.getMonth() + 1;// 褰撳墠鏈堜唤
+ let day = this.calendarValue.getDate();// 褰撳墠澶╂暟
+ let nextyear = year;
+ let nextmonth = parseInt(month) + 1;
+ // 鍒ゆ柇涓嬩竴鏈堟槸鍚︿細杩涘叆涓嬩竴骞�
+ if (nextmonth === 13) {
+ nextyear = parseInt(year) + 1;
+ nextmonth = 1;
+ }
+ // 璁＄畻涓嬩竴骞翠笅涓�涓湀鏈夊灏戝ぉ
+ let nextday = new Date(nextyear, nextmonth, 0);
+ let nextdays = nextday.getDate();
+ if (day > nextdays) {
+ day = nextdays;
+ if (day < 10) {
+ day = '0' + day;
+ }
+ }
+ if (nextmonth < 10) {
+ nextmonth = '0' + nextmonth;
+ }
+ let nexttime = nextyear + '-' + nextmonth + '-' + day;
+
+ // 灏嗗緱鍒扮殑骞存湀鏃ユ牸寮忚浆鎹负鏍囧噯鏃堕棿锛屼笌楗夸簡涔堟椂闂存牸寮忕浉鍚屾墠鑳借仈鍔�
+ this.calendarValue = new Date(nexttime);
+ },
+ prevMonth(time) {
+ let year = this.calendarValue.getFullYear();// 褰撳墠骞翠唤
+ let month = this.calendarValue.getMonth() + 1;// 褰撳墠鏈堜唤
+ let day = this.calendarValue.getDate();// 褰撳墠澶╂暟
+ let prevyear = year;
+ let prevmonth = parseInt(month) - 1;
+ // 鍒ゆ柇涓婁竴鏈堟槸鍚︿細杩涘叆涓婁竴骞�
+ if (prevmonth === 0) {
+ prevyear = parseInt(year) - 1;
+ prevmonth = 12;
+ }
+ // 璁＄畻涓婁竴骞翠笂涓�涓湀鏈夊灏戝ぉ
+ let prevday = new Date(prevyear, prevmonth, 0);
+ let prevdays = prevday.getDate();
+ if (day > prevdays) {
+ day = prevdays;
+ if (day < 10) {
+ day = '0' + day;
+ }
+ }
+ if (prevmonth < 10) {
+ prevmonth = '0' + prevmonth;
+ }
+ let prevtime = prevyear + '-' + prevmonth + '-' + day;
+
+ // 灏嗗緱鍒扮殑骞存湀鏃ユ牸寮忚浆鎹负鏍囧噯鏃堕棿锛屼笌楗夸簡涔堟椂闂存牸寮忕浉鍚屾墠鑳借仈鍔�
+ this.calendarValue = new Date(prevtime);
+ },
+ handleCancel(){
+ this.dialogVisible = false;
+ this.query = {
+ time:'',
+ content:''
+ }
+ },
+ submit(){
+ if(!this.query.time){
+ this.$message.error('鏃堕棿鏈～鍐�')
+ return
+ }
+ if(!this.query.content){
+ this.$message.error('鍐呭鏈～鍐�')
+ return
+ }
+ }
}
}
-</script>
\ No newline at end of file
+</script>
--
Gitblit v1.9.3