4.2
|
@ -37,7 +37,13 @@ export const deleteNuCustomerServer = (params) => {
|
||||||
return request({
|
return request({
|
||||||
url: `/nuIpadApi/nuBizNuCustomerServer/deleteNuCustomerServer?id=${params.id}`,
|
url: `/nuIpadApi/nuBizNuCustomerServer/deleteNuCustomerServer?id=${params.id}`,
|
||||||
method: 'delete',
|
method: 'delete',
|
||||||
// data: params, // 如果后端需要从请求体中接收参数
|
})
|
||||||
// 如果后端需要通过 query 参数传递数据,可以使用 params: params
|
}
|
||||||
|
// 移动表格
|
||||||
|
export const addBatch = (params) => {
|
||||||
|
return request({
|
||||||
|
url: '/nuIpadApi/nuBizNuCustomerServer/addBatch',
|
||||||
|
method: 'post',
|
||||||
|
data: params,
|
||||||
})
|
})
|
||||||
}
|
}
|
|
@ -4,3 +4,7 @@ export type Link = {
|
||||||
name:string;
|
name:string;
|
||||||
pao:number;
|
pao:number;
|
||||||
};
|
};
|
||||||
|
export type buttonLink = {
|
||||||
|
url : string;
|
||||||
|
name:string;
|
||||||
|
};
|
||||||
|
|
|
@ -36,42 +36,135 @@
|
||||||
</view>
|
</view>
|
||||||
<image class="left-img" :src="index === menuIndex ? item.targetUrl : item.url"
|
<image class="left-img" :src="index === menuIndex ? item.targetUrl : item.url"
|
||||||
@click="changeMenu(index)" />
|
@click="changeMenu(index)" />
|
||||||
<view :class="index === menuIndex ? `left-img-font-target` :`left-img-font`" @click="changeMenu(index)">
|
<view :class="index === menuIndex ? `left-img-font-target` :`left-img-font`"
|
||||||
|
@click="changeMenu(index)">
|
||||||
{{item.name}}
|
{{item.name}}
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
<view class="index-content-other">
|
||||||
|
<view class="index-content-right">
|
||||||
|
<!-- 解决margin重叠问题 -->
|
||||||
|
<view class="index-right-height"></view>
|
||||||
|
<view class="index-right-title">
|
||||||
|
<view class="index-right-name">
|
||||||
|
货品名称
|
||||||
|
</view>
|
||||||
|
<input class="index-right-input" placeholder="请输入货品名称" />
|
||||||
|
<view class="index-right-name">
|
||||||
|
货品编码
|
||||||
|
</view>
|
||||||
|
<input class="index-right-input" placeholder="请输入货品编码" />
|
||||||
|
<view class="index-right-name">
|
||||||
|
拼音检索
|
||||||
|
</view>
|
||||||
|
<input class="index-right-input" placeholder="请输入货品拼音" />
|
||||||
|
<view class="index-right-button-all">
|
||||||
|
<view class="" v-for="(item,index) in buttonList" :key="index">
|
||||||
|
<view class="index-right-button">
|
||||||
|
<image class="index-right-button-img" :src="item.url" />
|
||||||
|
<view class="index-right-button-font">
|
||||||
|
{{item.name}}
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="swiper-contain">
|
||||||
|
<scroll-view scroll-y style="height: 98%;" :show-scrollbar="false">
|
||||||
|
<view class="swiper-flex">
|
||||||
|
<view v-for="(item,index) in [1,1,1,1,1,1,1,1,1,1,1,1,1]" :key="index">
|
||||||
|
<view class="swiper-card">
|
||||||
|
<view class="swiper-card-left">
|
||||||
|
<view class="swiper-card-left-white">
|
||||||
|
<image class="swiper-card-left-white-img"
|
||||||
|
:src="`/static/index/project3.png`" @click="opendetail" />
|
||||||
|
</view>
|
||||||
|
<view class="swiper-left-buttons">
|
||||||
|
<view class="swiper-left-button-blue">
|
||||||
|
请购
|
||||||
|
</view>
|
||||||
|
<view class="swiper-left-button">
|
||||||
|
出入库
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="swiper-card-right">
|
||||||
|
<view class="swiper-right-title">
|
||||||
|
<view class="swiper-title-font">纸尿裤-拉拉裤</view>
|
||||||
|
<view class="swiper-title-mark">ZHYP044</view>
|
||||||
|
</view>
|
||||||
|
<view class="swiper-heng"></view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</scroll-view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="index-content-down">
|
||||||
|
长春市朝阳区久泰开运养老服务有限公司
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
<!-- 表格详情的的弹出层 -->
|
||||||
|
<view v-show="detailisopen" class="popup-detail" @click="detailisopen=false">
|
||||||
|
<view class="popup-detail-content" :style="{ opacity: detailisopacity ? 1 : 0 }" @click.stop>
|
||||||
|
<view class="popup-detail-left">
|
||||||
|
<view class="popup-detail-left-white">
|
||||||
|
<image class="popup-detail-left-white-img" :src="`/static/index/project3.png`"
|
||||||
|
@click="opendetail" />
|
||||||
|
</view>
|
||||||
|
<view class="popup-detail-left-bottom">
|
||||||
|
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="popup-detail-right">
|
||||||
|
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref, onMounted, onBeforeUnmount, computed, nextTick } from 'vue';
|
import { ref, onMounted, onBeforeUnmount, computed, nextTick } from 'vue';
|
||||||
import type { Link } from "./index";
|
import type { Link, buttonLink } from "./index";
|
||||||
import { onLoad } from '@dcloudio/uni-app';
|
import { onLoad } from '@dcloudio/uni-app';
|
||||||
// 暗黑模式
|
// 暗黑模式
|
||||||
const darkFans = ref(false);
|
const darkFans = ref(false);
|
||||||
const menuIndex = ref(0);
|
const menuIndex = ref(0);
|
||||||
|
// 删除表格弹窗
|
||||||
|
const detailisopen = ref(false);
|
||||||
|
const detailisopacity = ref(false)
|
||||||
// 初始化左侧菜单列表
|
// 初始化左侧菜单列表
|
||||||
const iconList = ref<Link[]>([
|
const iconList = ref<Link[]>([
|
||||||
{ url: '/static/index/lefticon/index.png', targetUrl: '/static/index/lefticontarget/blueindex.png', name: '首页',pao:0 },
|
{ url: '/static/index/lefticon/index.png', targetUrl: '/static/index/lefticontarget/blueindex.png', name: '首页', pao: 0 },
|
||||||
{ url: '/static/index/Warehousing/dingdan.png', targetUrl: '/static/index/Warehousing/dingdanblue.png', name: '订单',pao:0 },
|
{ url: '/static/index/Warehousing/dingdan.png', targetUrl: '/static/index/Warehousing/dingdanblue.png', name: '订单', pao: 0 },
|
||||||
{ url: '/static/index/Warehousing/yujing.png', targetUrl: '/static/index/Warehousing/yujingblue.png', name: '预警',pao:200 },
|
{ url: '/static/index/Warehousing/yujing.png', targetUrl: '/static/index/Warehousing/yujingblue.png', name: '预警', pao: 200 },
|
||||||
{ url: '/static/index/Warehousing/chuku.png', targetUrl: '/static/index/Warehousing/chukublue.png', name: '出库',pao:5 },
|
{ url: '/static/index/Warehousing/chuku.png', targetUrl: '/static/index/Warehousing/chukublue.png', name: '出库', pao: 5 },
|
||||||
{ url: '/static/index/Warehousing/pandian.png', targetUrl: '/static/index/Warehousing/pandianblue.png', name: '盘点',pao:0 },
|
{ url: '/static/index/Warehousing/pandian.png', targetUrl: '/static/index/Warehousing/pandianblue.png', name: '盘点', pao: 0 },
|
||||||
{ url: '/static/index/Warehousing/jiankong.png', targetUrl: '/static/index/Warehousing/jiankongblue.png', name: '监控',pao:0 },
|
{ url: '/static/index/Warehousing/jiankong.png', targetUrl: '/static/index/Warehousing/jiankongblue.png', name: '监控', pao: 0 },
|
||||||
{ url: '/static/index/lefticon/back.png', targetUrl: '/static/index/lefticontarget/blueback.png', name: '返回',pao:0 }
|
{ url: '/static/index/lefticon/back.png', targetUrl: '/static/index/lefticontarget/blueback.png', name: '返回', pao: 0 }
|
||||||
]);
|
]);
|
||||||
|
// 初始化左侧菜单列表
|
||||||
|
const buttonList = ref<buttonLink[]>([
|
||||||
|
{ url: '/static/index/Warehousing/zuoce.png', name: '请购单' },
|
||||||
|
{ url: '/static/index/Warehousing/sousuo.png', name: '查询' },
|
||||||
|
{ url: '/static/index/Warehousing/chongzhi.png', name: '重置' },
|
||||||
|
|
||||||
|
]);
|
||||||
|
const opendetail = () => {
|
||||||
|
detailisopen.value = true;
|
||||||
|
detailisopacity.value = false;
|
||||||
|
setTimeout(() => {
|
||||||
|
detailisopacity.value = true
|
||||||
|
}, 200)
|
||||||
|
}
|
||||||
// 变更菜单
|
// 变更菜单
|
||||||
const changeMenu = (index : number) => {
|
const changeMenu = (index : number) => {
|
||||||
// if (index === 3) {
|
|
||||||
// uni.navigateTo({
|
|
||||||
// url: `/pages/somethingmove/index?darkFans=${darkFans.value}`,
|
|
||||||
// animationType: 'slide-in-right',
|
|
||||||
// animationDuration: 400// 设置动画时长为300毫秒, // 动画持续时间,单位为毫秒
|
|
||||||
// });
|
|
||||||
// return
|
|
||||||
// }
|
|
||||||
if (index === 6) {
|
if (index === 6) {
|
||||||
uni.navigateBack()
|
uni.navigateBack()
|
||||||
return
|
return
|
||||||
|
@ -133,6 +226,7 @@
|
||||||
height: 100%;
|
height: 100%;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
margin-top: 20rpx;
|
margin-top: 20rpx;
|
||||||
|
|
||||||
.index-title-left-img {
|
.index-title-left-img {
|
||||||
width: 75rpx;
|
width: 75rpx;
|
||||||
height: 75rpx;
|
height: 75rpx;
|
||||||
|
@ -158,6 +252,7 @@
|
||||||
height: 100%;
|
height: 100%;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
margin-top: 20rpx;
|
margin-top: 20rpx;
|
||||||
|
|
||||||
.index-title-right-circle {
|
.index-title-right-circle {
|
||||||
// margin-top: 20rpx;
|
// margin-top: 20rpx;
|
||||||
width: 60rpx;
|
width: 60rpx;
|
||||||
|
@ -185,6 +280,7 @@
|
||||||
.index-content {
|
.index-content {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: calc(100vh - 150rpx);
|
height: calc(100vh - 150rpx);
|
||||||
|
display: flex;
|
||||||
|
|
||||||
.index-content-leftMenus {
|
.index-content-leftMenus {
|
||||||
height: 100%;
|
height: 100%;
|
||||||
|
@ -232,7 +328,8 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.red-pao{
|
|
||||||
|
.red-pao {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 30rpx;
|
top: 30rpx;
|
||||||
// right: 0;
|
// right: 0;
|
||||||
|
@ -244,4 +341,265 @@
|
||||||
border-radius: 20rpx;
|
border-radius: 20rpx;
|
||||||
z-index: 101;
|
z-index: 101;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.index-content-other {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
// background-color: #FF4C4E;
|
||||||
|
}
|
||||||
|
|
||||||
|
.index-content-right {
|
||||||
|
height: calc(100% - 100rpx);
|
||||||
|
width: calc(100% - 60rpx);
|
||||||
|
background-color: rgba(255, 255, 255, 0.5);
|
||||||
|
/* 白色背景透明度为 10% */
|
||||||
|
background-image: url('/static/index/mountain.png');
|
||||||
|
background-position: 70% 45%;
|
||||||
|
border-radius: 50rpx;
|
||||||
|
box-shadow: 4rpx 8rpx 16rpx 4rpx rgba(0, 0, 0, 0.3);
|
||||||
|
border-radius: 1rpx solid #fff;
|
||||||
|
|
||||||
|
.index-right-height {
|
||||||
|
height: 20rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.index-right-title {
|
||||||
|
margin-left: 30rpx;
|
||||||
|
width: calc(100% - 60rpx);
|
||||||
|
height: 120rpx;
|
||||||
|
background: linear-gradient(to right, #C4E0FD, #D5CDFF, #D9ECFF);
|
||||||
|
border-radius: 35rpx;
|
||||||
|
border: 2rpx solid #fff;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.index-right-name {
|
||||||
|
margin-left: 20rpx;
|
||||||
|
margin-right: 10rpx;
|
||||||
|
color: #19233B;
|
||||||
|
font-size: 30rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.index-right-input {
|
||||||
|
font-size: 27rpx;
|
||||||
|
width: 260rpx;
|
||||||
|
border: 2rpx #a0adc8 solid;
|
||||||
|
padding: 15rpx 0 15rpx 20rpx;
|
||||||
|
background-color: rgb(234, 243, 254);
|
||||||
|
border-radius: 10rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.index-right-button-all {
|
||||||
|
height: 100%;
|
||||||
|
margin-left: auto;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.index-right-button {
|
||||||
|
// width: 160rpx;
|
||||||
|
height: 70rpx;
|
||||||
|
background: linear-gradient(to right bottom, #00c9ff, #0076ff);
|
||||||
|
color: #fff;
|
||||||
|
font-size: 30rpx;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
border-radius: 10rpx;
|
||||||
|
border: 1rpx solid #fff;
|
||||||
|
margin-right: 20rpx;
|
||||||
|
|
||||||
|
.index-right-button-img {
|
||||||
|
width: 45rpx;
|
||||||
|
height: 45rpx;
|
||||||
|
margin: 0 5rpx 0 10rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.index-right-button-font {
|
||||||
|
margin-right: 20rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.index-content-down {
|
||||||
|
width: calc(100% - 60rpx);
|
||||||
|
height: 100rpx;
|
||||||
|
display: flex;
|
||||||
|
justify-content: flex-end;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.swiper-contain {
|
||||||
|
width: 100%;
|
||||||
|
margin-left: 10rpx;
|
||||||
|
// width: calc(100% - 60rpx);
|
||||||
|
height: calc(100% - 140rpx);
|
||||||
|
|
||||||
|
.swiper-flex {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
|
||||||
|
.swiper-card {
|
||||||
|
margin: 20rpx 0 0 20rpx;
|
||||||
|
width: 1007rpx;
|
||||||
|
height: 530rpx;
|
||||||
|
border: 2rpx solid #fff;
|
||||||
|
border-radius: 30rpx;
|
||||||
|
/* 设置背景图和白色背景 */
|
||||||
|
background: url("/static/index/clearmountain.png") center/cover, rgba(255, 255, 255, 0.5);
|
||||||
|
/* 使用 screen 混合模式,让图像与白色混合变淡 */
|
||||||
|
background-blend-mode: screen;
|
||||||
|
isolation: isolate;
|
||||||
|
box-shadow: 2rpx 2rpx 4rpx 0rpx rgba(0, 0, 0, 0.3);
|
||||||
|
display: flex;
|
||||||
|
|
||||||
|
.swiper-card-left {
|
||||||
|
height: 100%;
|
||||||
|
width: 400rpx;
|
||||||
|
|
||||||
|
.swiper-card-left-white {
|
||||||
|
margin: 40rpx 0 35rpx 40rpx;
|
||||||
|
width: 350rpx;
|
||||||
|
height: 350rpx;
|
||||||
|
// background-color: #fff;
|
||||||
|
background-color: rgba(255, 255, 255, 0.3);
|
||||||
|
display: flex;
|
||||||
|
border-radius: 30rpx;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.swiper-card-left-white-img {
|
||||||
|
width: 300rpx;
|
||||||
|
height: 300rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.swiper-left-buttons {
|
||||||
|
display: flex;
|
||||||
|
|
||||||
|
.swiper-left-button {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
width: 165rpx;
|
||||||
|
height: 70rpx;
|
||||||
|
border-radius: 40rpx;
|
||||||
|
background: linear-gradient(to bottom, #D5E0F8, #ECF6FF);
|
||||||
|
border: 1rpx #fff solid;
|
||||||
|
}
|
||||||
|
|
||||||
|
.swiper-left-button-blue {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
width: 165rpx;
|
||||||
|
height: 70rpx;
|
||||||
|
border-radius: 40rpx;
|
||||||
|
background: linear-gradient(to right bottom, #00c9ff, #0076ff);
|
||||||
|
color: #fff;
|
||||||
|
border: 1rpx #fff solid;
|
||||||
|
margin-right: 20rpx;
|
||||||
|
margin-left: 40rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.swiper-card-right {
|
||||||
|
height: 100%;
|
||||||
|
width: 560rpx;
|
||||||
|
margin-left: 40rpx;
|
||||||
|
|
||||||
|
.swiper-right-title {
|
||||||
|
margin-top: 35rpx;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
|
||||||
|
.swiper-title-font {
|
||||||
|
font-weight: 700;
|
||||||
|
font-size: 40rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.swiper-title-mark {
|
||||||
|
background-color: rgb(214, 212, 245);
|
||||||
|
color: #19233B;
|
||||||
|
padding: 5rpx 25rpx;
|
||||||
|
font-size: 30rpx;
|
||||||
|
border-radius: 25rpx;
|
||||||
|
margin-right: 20rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.swiper-heng {
|
||||||
|
width: 100rpx;
|
||||||
|
height: 10rpx;
|
||||||
|
background: linear-gradient(to right, #0EA7DD, #047ADB);
|
||||||
|
border-radius: 30rpx;
|
||||||
|
margin-top: 10rpx;
|
||||||
|
margin-bottom: 30rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.popup-detail {
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
backdrop-filter: blur(1rpx);
|
||||||
|
background-color: rgba(89, 109, 154, 0.4);
|
||||||
|
/* 添加毛玻璃效果 */
|
||||||
|
z-index: 999;
|
||||||
|
|
||||||
|
.popup-detail-content {
|
||||||
|
display: flex;
|
||||||
|
width: 1500rpx;
|
||||||
|
height: 900rpx;
|
||||||
|
background: url("/static/index/lightbgcnew.png") center/cover, rgba(255, 255, 255, 0.5);
|
||||||
|
background-blend-mode: screen;
|
||||||
|
border: 2rpx solid #fff;
|
||||||
|
/* 使用 screen 混合模式,让图像与白色混合变淡 */
|
||||||
|
border-radius: 30rpx;
|
||||||
|
box-shadow: 10rpx 10rpx 20rpx rgba(0, 0, 0, 0.1);
|
||||||
|
transition: opacity 0.4s ease;
|
||||||
|
|
||||||
|
.popup-detail-left {
|
||||||
|
height: 100%;
|
||||||
|
width: 45%;
|
||||||
|
.popup-detail-left-white {
|
||||||
|
margin: 70rpx 0 0rpx 70rpx;
|
||||||
|
width: 600rpx;
|
||||||
|
height: 600rpx;
|
||||||
|
// background-color: #fff;
|
||||||
|
background-color: rgba(255, 255, 255, 0.3);
|
||||||
|
display: flex;
|
||||||
|
border-radius: 30rpx;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.popup-detail-left-white-img {
|
||||||
|
width: 550rpx;
|
||||||
|
height: 550rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.popup-detail-left-bottom{
|
||||||
|
width: calc(100% - 70rpx);
|
||||||
|
margin-left: 70rpx;
|
||||||
|
height: 230rpx;
|
||||||
|
background-color: #fff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.popup-detail-right {
|
||||||
|
height: 100%;
|
||||||
|
width: 55%;
|
||||||
|
// background-color: #0076ff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
</style>
|
</style>
|
|
@ -8,8 +8,7 @@
|
||||||
<view class="doctorsay-container-right">
|
<view class="doctorsay-container-right">
|
||||||
<view class="titlebutton-father">
|
<view class="titlebutton-father">
|
||||||
<view v-for="(item,index) in buttonArray" :key="index">
|
<view v-for="(item,index) in buttonArray" :key="index">
|
||||||
<view :class="getClassItem(index)"
|
<view :class="getClassItem(index)" @click="changeTarget(index)">
|
||||||
@click="changeTarget(index)">
|
|
||||||
{{item}}
|
{{item}}
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
@ -28,11 +27,9 @@
|
||||||
<view class="super-card-container">
|
<view class="super-card-container">
|
||||||
<view class="boom">
|
<view class="boom">
|
||||||
<view :style="{ marginTop: `-${2 *moveDownNumber}rpx` }">
|
<view :style="{ marginTop: `-${2 *moveDownNumber}rpx` }">
|
||||||
<view v-for="(item,index) in timearr[0].children" :key="index">
|
<view v-for="(item,index) in changetimearr[0]?.children" :key="index">
|
||||||
<view
|
<view :class="(clickY === index) ? `boom-son-target`: `boom-son`" v-show="item.typeName">
|
||||||
:class="(clickY === index) ? `boom-son-target`: `boom-son`"
|
{{item.typeName}}
|
||||||
v-show="item.serve">
|
|
||||||
{{item.serve}}
|
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
@ -41,9 +38,9 @@
|
||||||
:show-scrollbar="false">
|
:show-scrollbar="false">
|
||||||
<view
|
<view
|
||||||
style="display: flex;width: 5945rpx; box-shadow: 10rpx 10rpx 20rpx rgba(0, 0, 0, 0.1);background: linear-gradient(to right, #c4dbf4,#c9c2ef, #c6dcf3);">
|
style="display: flex;width: 5945rpx; box-shadow: 10rpx 10rpx 20rpx rgba(0, 0, 0, 0.1);background: linear-gradient(to right, #c4dbf4,#c9c2ef, #c6dcf3);">
|
||||||
<view v-for="(item0,index0) in timearr" :key="index0">
|
<view v-for="(item0,index0) in changetimearr" :key="index0">
|
||||||
<view class="super-card-time">
|
<view class="super-card-time">
|
||||||
{{item0.time}}
|
{{(item0.positioning.length == 1 ? ('0' + item0.positioning) : item0.positioning) + ":00"}}
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
@ -64,29 +61,31 @@
|
||||||
|
|
||||||
<view :class="getClass(item1,index0,index1)"
|
<view :class="getClass(item1,index0,index1)"
|
||||||
style="font-size: 30rpx;overflow: hidden;">
|
style="font-size: 30rpx;overflow: hidden;">
|
||||||
<view class="title-time" v-if="item1.time"
|
<view class="title-time" v-if="item1.startTime"
|
||||||
style="margin-top: 0rpx;">
|
style="margin-top: 0rpx;">
|
||||||
<view class="title-time-time" style="font-size: 25rpx;">
|
<view class="title-time-time" style="font-size: 25rpx;">
|
||||||
{{item1.time}}
|
{{item1.startTime + `-` + item1.endTime}}
|
||||||
</view>
|
</view>
|
||||||
<image class="title-time-button"
|
<image class="title-time-button"
|
||||||
:src="item1.type=='日常'?`/static/index/yellowbian.png`:`/static/index/puoplebian.png`" />
|
:src="item1.cycleType=='日常'?`/static/index/yellowbian.png`:`/static/index/puoplebian.png`" />
|
||||||
<view class="title-time-font">
|
<view class="title-time-font">
|
||||||
{{item1.type}}
|
{{item1.cycleType}}
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<view :style="splitString(item1.value)[1] ? {}:{marginTop:`20rpx`}" style="font-weight: 700;font-size: 24rpx;">
|
<view
|
||||||
{{splitString(item1.value)[0]}}
|
:style="splitString(item1.directiveName)[1] ? {}:{marginTop:`20rpx`}"
|
||||||
|
style="font-weight: 700;font-size: 24rpx;">
|
||||||
|
{{splitString(item1.directiveName)[0]}}
|
||||||
</view>
|
</view>
|
||||||
<view class="down-icons"
|
<view class="down-icons"
|
||||||
:style="item1.type!='日常'?{backgroundColor:`rgb(212,203,255)`}:{}"
|
:style="item1.cycleType!='日常'?{backgroundColor:`rgb(212,203,255)`}:{}"
|
||||||
v-if="splitString(item1.value)[1]">
|
v-if="splitString(item1.directiveName)[1]">
|
||||||
<view class=""
|
<view class=""
|
||||||
v-for="(item,index) in splitString(item1.value).slice(1)"
|
v-for="(item,index) in splitString(item1.directiveName).slice(1)"
|
||||||
:key="index">
|
:key="index">
|
||||||
<view class="icon"
|
<view class="icon"
|
||||||
:style="item1.type!='日常'?{backgroundColor:`rgb(123,97,255)`}:{}">
|
:style="item1.cycleType!='日常'?{backgroundColor:`rgb(123,97,255)`}:{}">
|
||||||
{{splitString(item1.value)[index + 1]}}
|
{{splitString(item1.directiveName)[index + 1]}}
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
@ -128,6 +127,7 @@
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref, onMounted, onBeforeUnmount, computed, nextTick } from 'vue';
|
import { ref, onMounted, onBeforeUnmount, computed, nextTick } from 'vue';
|
||||||
import { onLoad } from '@dcloudio/uni-app';
|
import { onLoad } from '@dcloudio/uni-app';
|
||||||
|
import { getNclist } from "@/component/rightItemssecond/api.js";
|
||||||
// 暗黑模式
|
// 暗黑模式
|
||||||
const darkFans = ref(false);
|
const darkFans = ref(false);
|
||||||
const timearr = ref([]);
|
const timearr = ref([]);
|
||||||
|
@ -138,9 +138,9 @@
|
||||||
const buttonTarget = ref(0);
|
const buttonTarget = ref(0);
|
||||||
// 方法:根据条件返回不同的类名
|
// 方法:根据条件返回不同的类名
|
||||||
const getClass = (item : any, index0 : number, index1 : number) => {
|
const getClass = (item : any, index0 : number, index1 : number) => {
|
||||||
if (item.type === '日常') {
|
if (item.cycleType === '日常') {
|
||||||
return 'title-time-border-yellow';
|
return 'title-time-border-yellow';
|
||||||
} else if (item.type) {
|
} else if (item.cycleType) {
|
||||||
//为啥这么写,是因为动画写行内无效!!!
|
//为啥这么写,是因为动画写行内无效!!!
|
||||||
return 'title-time-border-pouple'
|
return 'title-time-border-pouple'
|
||||||
}
|
}
|
||||||
|
@ -152,11 +152,11 @@
|
||||||
let formattedNum = parseFloat(num.toFixed(2));
|
let formattedNum = parseFloat(num.toFixed(2));
|
||||||
moveDownNumber.value = formattedNum
|
moveDownNumber.value = formattedNum
|
||||||
}
|
}
|
||||||
const getClassItem = (index) =>{
|
const getClassItem = (index) => {
|
||||||
if(buttonTarget.value!==index){
|
if (buttonTarget.value !== index) {
|
||||||
return `titlebutton`
|
return `titlebutton`
|
||||||
}else{
|
} else {
|
||||||
switch(index){
|
switch (index) {
|
||||||
case 0:
|
case 0:
|
||||||
return `titlebutton-target`
|
return `titlebutton-target`
|
||||||
|
|
||||||
|
@ -165,16 +165,15 @@
|
||||||
|
|
||||||
case 2:
|
case 2:
|
||||||
return `titlebutton-target-pouple`
|
return `titlebutton-target-pouple`
|
||||||
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
// 切割bigArray
|
// 切割bigArray
|
||||||
function splitString(str : any) {
|
function splitString(str : any) {
|
||||||
|
if (str) {
|
||||||
// 使用正则表达式找到所有括号的内容
|
// 使用正则表达式找到所有括号的内容
|
||||||
let result = [];
|
let result = [];
|
||||||
let remainingStr = str;
|
let remainingStr = str;
|
||||||
|
|
||||||
// 正则匹配最外层括号(支持全角和半角)
|
// 正则匹配最外层括号(支持全角和半角)
|
||||||
let regex = /([^((]*)[((]([^))]+)[))]/;
|
let regex = /([^((]*)[((]([^))]+)[))]/;
|
||||||
|
|
||||||
|
@ -200,19 +199,19 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
return result;
|
return result;
|
||||||
|
} else {
|
||||||
|
return [];
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
const scrollLeft = ref(0);
|
const scrollLeft = ref(0);
|
||||||
const changetimearr = ref([]);
|
const changetimearr = ref([]);
|
||||||
// 生命周期钩子
|
// 生命周期钩子
|
||||||
onLoad((options) => {
|
onLoad((options) => {
|
||||||
|
getNclist().then((res : any) => {
|
||||||
if (options.currentNumber) {
|
timearr.value = res.result
|
||||||
scrollLeft.value = options.currentNumber * 745
|
if (timearr.value[0].children.length < 8) {
|
||||||
}
|
timearr.value.forEach((element : any) => {
|
||||||
timearr.value = uni.getStorageSync("timearr")
|
|
||||||
|
|
||||||
if(timearr.value[0].children.length < 8){
|
|
||||||
timearr.value.forEach((element: any) => {
|
|
||||||
// 循环直到长度达到 7
|
// 循环直到长度达到 7
|
||||||
while (element.children.length < 8) {
|
while (element.children.length < 8) {
|
||||||
element.children.push({ value: "" });
|
element.children.push({ value: "" });
|
||||||
|
@ -220,6 +219,10 @@
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
changetimearr.value = JSON.parse(JSON.stringify(timearr.value));
|
changetimearr.value = JSON.parse(JSON.stringify(timearr.value));
|
||||||
|
if (options.currentNumber) {
|
||||||
|
scrollLeft.value = options.currentNumber * 745
|
||||||
|
}
|
||||||
|
})
|
||||||
});
|
});
|
||||||
const openX = ref(0);
|
const openX = ref(0);
|
||||||
const openY = ref(0);
|
const openY = ref(0);
|
||||||
|
@ -229,7 +232,7 @@
|
||||||
const clickY = ref(-1);
|
const clickY = ref(-1);
|
||||||
//表格点击开始
|
//表格点击开始
|
||||||
const rulerTouchClick = (item : any, index0 : number, index1 : number, e : any) => {
|
const rulerTouchClick = (item : any, index0 : number, index1 : number, e : any) => {
|
||||||
if (item.value) {
|
if (item.directiveName) {
|
||||||
clickX.value = index0;
|
clickX.value = index0;
|
||||||
clickY.value = index1;
|
clickY.value = index1;
|
||||||
const query = uni.createSelectorQuery()
|
const query = uni.createSelectorQuery()
|
||||||
|
@ -243,7 +246,7 @@
|
||||||
// 表格太靠左侧,修改到右面
|
// 表格太靠左侧,修改到右面
|
||||||
openX.value = Math.floor(res.left) + 510;
|
openX.value = Math.floor(res.left) + 510;
|
||||||
} else {
|
} else {
|
||||||
openX.value = Math.floor(res.left) -10
|
openX.value = Math.floor(res.left) - 10
|
||||||
}
|
}
|
||||||
if (res.top < 300) {
|
if (res.top < 300) {
|
||||||
// 表格太靠上侧,修改到下面
|
// 表格太靠上侧,修改到下面
|
||||||
|
@ -251,7 +254,6 @@
|
||||||
} else {
|
} else {
|
||||||
openY.value = Math.floor(res.top)
|
openY.value = Math.floor(res.top)
|
||||||
}
|
}
|
||||||
// openY.value = Math.floor(res.top)
|
|
||||||
await nextTick()
|
await nextTick()
|
||||||
isopen.value = true;
|
isopen.value = true;
|
||||||
isopacity.value = false;
|
isopacity.value = false;
|
||||||
|
@ -278,7 +280,6 @@
|
||||||
uni.navigateBack()
|
uni.navigateBack()
|
||||||
}
|
}
|
||||||
const closeIsOpen = (event : any) => {
|
const closeIsOpen = (event : any) => {
|
||||||
|
|
||||||
const touch = event.touches[0];
|
const touch = event.touches[0];
|
||||||
let clientX = (Math.floor(touch.clientX))
|
let clientX = (Math.floor(touch.clientX))
|
||||||
let clientY = (Math.floor(touch.clientY))
|
let clientY = (Math.floor(touch.clientY))
|
||||||
|
@ -289,10 +290,8 @@
|
||||||
data.forEach(async (res : any) => {
|
data.forEach(async (res : any) => {
|
||||||
// 根据你的条件筛选元素
|
// 根据你的条件筛选元素
|
||||||
if (res.dataset.index0 == clickX.value && res.dataset.index1 == clickY.value) {
|
if (res.dataset.index0 == clickX.value && res.dataset.index1 == clickY.value) {
|
||||||
// console.log("?????",clientX,clientY)
|
|
||||||
if (clientX >= Math.floor(res.left) && clientX <= Math.floor(res.right) &&
|
if (clientX >= Math.floor(res.left) && clientX <= Math.floor(res.right) &&
|
||||||
clientY >= Math.floor(res.top) && clientY <= Math.floor(res.bottom)) {
|
clientY >= Math.floor(res.top) && clientY <= Math.floor(res.bottom)) {
|
||||||
|
|
||||||
//调用上一个页面中的方法
|
//调用上一个页面中的方法
|
||||||
uni.navigateBack({
|
uni.navigateBack({
|
||||||
delta: 1,
|
delta: 1,
|
||||||
|
@ -314,14 +313,11 @@
|
||||||
clickX.value = -1;
|
clickX.value = -1;
|
||||||
clickY.value = -1
|
clickY.value = -1
|
||||||
}, 100)
|
}, 100)
|
||||||
|
|
||||||
|
|
||||||
}
|
}
|
||||||
const changeTarget = (index : number) => {
|
const changeTarget = (index : number) => {
|
||||||
if (buttonTarget.value !== index) {
|
if (buttonTarget.value !== index) {
|
||||||
changetimearr.value = []
|
changetimearr.value = []
|
||||||
buttonTarget.value = index
|
buttonTarget.value = index
|
||||||
// console.log("????", index, buttonTarget.value)
|
|
||||||
switch (index) {
|
switch (index) {
|
||||||
case 0:
|
case 0:
|
||||||
changetimearr.value = JSON.parse(JSON.stringify(timearr.value));
|
changetimearr.value = JSON.parse(JSON.stringify(timearr.value));
|
||||||
|
@ -330,32 +326,28 @@
|
||||||
changetimearr.value = JSON.parse(JSON.stringify(timearr.value));
|
changetimearr.value = JSON.parse(JSON.stringify(timearr.value));
|
||||||
changetimearr.value.forEach((element0 : any) => {
|
changetimearr.value.forEach((element0 : any) => {
|
||||||
element0.children.forEach((element1 : any) => {
|
element0.children.forEach((element1 : any) => {
|
||||||
if (element1.value && element1.type !== "日常") {
|
if (element1.directiveName && element1.cycleType !== "日常") {
|
||||||
element1.value = "";
|
element1.directiveName = "";
|
||||||
element1.serve = "";
|
element1.cycleType = ""
|
||||||
element1.type = "";
|
element1.startTime = ""
|
||||||
element1.time = "";
|
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
// console.log("chufa", changetimearr.value)
|
|
||||||
break;
|
break;
|
||||||
case 2:
|
case 2:
|
||||||
changetimearr.value = JSON.parse(JSON.stringify(timearr.value));
|
changetimearr.value = JSON.parse(JSON.stringify(timearr.value));
|
||||||
changetimearr.value.forEach((element0 : any) => {
|
changetimearr.value.forEach((element0 : any) => {
|
||||||
element0.children.forEach((element1 : any) => {
|
element0.children.forEach((element1 : any) => {
|
||||||
if (element1.value && element1.type === "日常") {
|
if (element1.directiveName && element1.cycleType === "日常") {
|
||||||
element1.value = "";
|
element1.directiveName = "";
|
||||||
element1.serve = "";
|
element1.cycleType = ""
|
||||||
element1.type = "";
|
element1.startTime = ""
|
||||||
element1.time = "";
|
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
@ -387,7 +379,6 @@
|
||||||
border: 2rpx solid #fff;
|
border: 2rpx solid #fff;
|
||||||
width: calc(100% - 4rpx);
|
width: calc(100% - 4rpx);
|
||||||
height: calc(100vh - 4rpx);
|
height: calc(100vh - 4rpx);
|
||||||
// background-color: rgba(255, 255, 255, 0.7);
|
|
||||||
/* 设置背景图和白色背景 */
|
/* 设置背景图和白色背景 */
|
||||||
background: url("/static/index/lightbgcnew.png") center/cover, rgba(255, 255, 255, 0.3);
|
background: url("/static/index/lightbgcnew.png") center/cover, rgba(255, 255, 255, 0.3);
|
||||||
backdrop-filter: blur(20rpx);
|
backdrop-filter: blur(20rpx);
|
||||||
|
@ -448,8 +439,6 @@
|
||||||
top: 0rpx;
|
top: 0rpx;
|
||||||
right: 0rpx;
|
right: 0rpx;
|
||||||
z-index: 10;
|
z-index: 10;
|
||||||
// background-color: #fff;
|
|
||||||
// background: linear-gradient(to bottom right, #fff 0%, #e5d3fb 50%, #cfd9f6 100%);
|
|
||||||
color: #fff;
|
color: #fff;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -458,9 +447,7 @@
|
||||||
width: 100rpx;
|
width: 100rpx;
|
||||||
height: 100rpx;
|
height: 100rpx;
|
||||||
border-radius: 50%;
|
border-radius: 50%;
|
||||||
// margin-bottom: 5rpx;
|
|
||||||
display: flex;
|
display: flex;
|
||||||
// background-color: #fff;
|
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
|
||||||
|
@ -476,7 +463,6 @@
|
||||||
height: 100rpx;
|
height: 100rpx;
|
||||||
border-radius: 50%;
|
border-radius: 50%;
|
||||||
display: flex;
|
display: flex;
|
||||||
// background-color: #fff;
|
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
animation: shake 0.5s infinite;
|
animation: shake 0.5s infinite;
|
||||||
|
@ -498,7 +484,6 @@
|
||||||
|
|
||||||
.super-end-font-father {
|
.super-end-font-father {
|
||||||
display: flex;
|
display: flex;
|
||||||
// margin: 20rpx 0;
|
|
||||||
margin-top: 20rpx;
|
margin-top: 20rpx;
|
||||||
margin-bottom: 10rpx;
|
margin-bottom: 10rpx;
|
||||||
|
|
||||||
|
@ -620,10 +605,8 @@
|
||||||
.super-card {
|
.super-card {
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
// align-items: center;
|
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: calc(100% - 200rpx);
|
height: calc(100% - 200rpx);
|
||||||
// margin-top: 30rpx;
|
|
||||||
|
|
||||||
.scroll-x {
|
.scroll-x {
|
||||||
height: 100%;
|
height: 100%;
|
||||||
|
@ -649,7 +632,6 @@
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
// background-color: rgb(233, 239, 257);
|
|
||||||
height: 80rpx;
|
height: 80rpx;
|
||||||
width: 247rpx;
|
width: 247rpx;
|
||||||
border-right: 1rpx solid transparent;
|
border-right: 1rpx solid transparent;
|
||||||
|
@ -674,11 +656,9 @@
|
||||||
align-items: center;
|
align-items: center;
|
||||||
height: 153rpx;
|
height: 153rpx;
|
||||||
width: calc(100%);
|
width: calc(100%);
|
||||||
// border-right: 1rpx solid transparent;
|
|
||||||
border-top: 1rpx solid transparent;
|
border-top: 1rpx solid transparent;
|
||||||
border-image: repeating-linear-gradient(90deg, #0184db 0px, #0184db 6rpx, transparent 6rpx, transparent 12rpx) 1;
|
border-image: repeating-linear-gradient(90deg, #0184db 0px, #0184db 6rpx, transparent 6rpx, transparent 12rpx) 1;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
// background-color: #f3f6fc;
|
|
||||||
position: relative;
|
position: relative;
|
||||||
|
|
||||||
|
|
||||||
|
@ -686,9 +666,6 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.title-time-border-blue {
|
.title-time-border-blue {
|
||||||
// display: flex;
|
|
||||||
// align-items: center;
|
|
||||||
// flex-direction: column;
|
|
||||||
z-index: 999;
|
z-index: 999;
|
||||||
background:
|
background:
|
||||||
/* 左上角水平 */
|
/* 左上角水平 */
|
||||||
|
@ -934,7 +911,8 @@
|
||||||
font-size: 27rpx;
|
font-size: 27rpx;
|
||||||
margin-right: 10rpx;
|
margin-right: 10rpx;
|
||||||
}
|
}
|
||||||
.titlebutton-target-yellow{
|
|
||||||
|
.titlebutton-target-yellow {
|
||||||
background: #FFDBA1;
|
background: #FFDBA1;
|
||||||
// color: #fff;
|
// color: #fff;
|
||||||
display: flex;
|
display: flex;
|
||||||
|
@ -945,7 +923,8 @@
|
||||||
font-size: 27rpx;
|
font-size: 27rpx;
|
||||||
margin-right: 10rpx;
|
margin-right: 10rpx;
|
||||||
}
|
}
|
||||||
.titlebutton-target-pouple{
|
|
||||||
|
.titlebutton-target-pouple {
|
||||||
background: #7B61FF;
|
background: #7B61FF;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
display: flex;
|
display: flex;
|
||||||
|
@ -957,16 +936,15 @@
|
||||||
margin-right: 10rpx;
|
margin-right: 10rpx;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.boom {
|
.boom {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 80rpx;
|
top: 80rpx;
|
||||||
left: 0rpx;
|
left: 0rpx;
|
||||||
// background-color: #fff;
|
|
||||||
width: 30rpx;
|
width: 30rpx;
|
||||||
height: 1500rpx;
|
height: 1500rpx;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
// justify-content: center;
|
|
||||||
align-items: center;
|
align-items: center;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
z-index: 10;
|
z-index: 10;
|
||||||
|
@ -976,7 +954,6 @@
|
||||||
width: 100%;
|
width: 100%;
|
||||||
font-size: 22rpx;
|
font-size: 22rpx;
|
||||||
letter-spacing: 5rpx;
|
letter-spacing: 5rpx;
|
||||||
// box-shadow: 5rpx 5rpx 10rpx rgba(0, 0, 0, 0.1);s
|
|
||||||
writing-mode: vertical-rl;
|
writing-mode: vertical-rl;
|
||||||
/* 竖排文字,从右往左 */
|
/* 竖排文字,从右往左 */
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
@ -993,15 +970,12 @@
|
||||||
width: 100%;
|
width: 100%;
|
||||||
font-size: 22rpx;
|
font-size: 22rpx;
|
||||||
letter-spacing: 5rpx;
|
letter-spacing: 5rpx;
|
||||||
// box-shadow: 5rpx 5rpx 10rpx rgba(0, 0, 0, 0.1);
|
|
||||||
writing-mode: vertical-rl;
|
writing-mode: vertical-rl;
|
||||||
/* 竖排文字,从右往左 */
|
/* 竖排文字,从右往左 */
|
||||||
text-align: center;
|
text-align: center;
|
||||||
z-index: 10;
|
z-index: 10;
|
||||||
/* 确保文字在容器内居中 */
|
/* 确保文字在容器内居中 */
|
||||||
background: linear-gradient(to bottom, #ff8a00, #eceaff);
|
background: linear-gradient(to bottom, #ff8a00, #eceaff);
|
||||||
// color: #fff;
|
|
||||||
// z-index: -1;
|
|
||||||
border-bottom-right-radius: 40rpx;
|
border-bottom-right-radius: 40rpx;
|
||||||
border-top-right-radius: 40rpx;
|
border-top-right-radius: 40rpx;
|
||||||
}
|
}
|
||||||
|
|
After Width: | Height: | Size: 2.1 KiB |
After Width: | Height: | Size: 2.8 KiB |
After Width: | Height: | Size: 2.7 KiB |
After Width: | Height: | Size: 2.6 KiB |
After Width: | Height: | Size: 2.0 KiB |
After Width: | Height: | Size: 1.5 KiB |
|
@ -2641,8 +2641,6 @@
|
||||||
.right-container .doctorsay-container-view .doctorsay-container-container .doctorsay-container-title[data-v-337bb5da] {
|
.right-container .doctorsay-container-view .doctorsay-container-container .doctorsay-container-title[data-v-337bb5da] {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 3.28125rem;
|
height: 3.28125rem;
|
||||||
/* 设置背景图和白色背景 */
|
|
||||||
/* 使用 screen 混合模式,让图像与白色混合变淡 */
|
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
|
@ -3033,7 +3031,6 @@
|
||||||
position: absolute;
|
position: absolute;
|
||||||
right: 8.4375rem;
|
right: 8.4375rem;
|
||||||
width: 40.5rem;
|
width: 40.5rem;
|
||||||
/* 设置背景图和白色背景 */
|
|
||||||
background: url("../../static/index/clearmountain.png") center / cover, rgba(255, 255, 255, 0.7);
|
background: url("../../static/index/clearmountain.png") center / cover, rgba(255, 255, 255, 0.7);
|
||||||
/* 使用 screen 混合模式,让图像与白色混合变淡 */
|
/* 使用 screen 混合模式,让图像与白色混合变淡 */
|
||||||
border: 0.0625rem solid #fff;
|
border: 0.0625rem solid #fff;
|
||||||
|
|
|
@ -73,6 +73,7 @@
|
||||||
.index-content[data-v-82a72f7e] {
|
.index-content[data-v-82a72f7e] {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: calc(100vh - 4.6875rem);
|
height: calc(100vh - 4.6875rem);
|
||||||
|
display: flex;
|
||||||
}
|
}
|
||||||
.index-content .index-content-leftMenus[data-v-82a72f7e] {
|
.index-content .index-content-leftMenus[data-v-82a72f7e] {
|
||||||
height: 100%;
|
height: 100%;
|
||||||
|
@ -123,3 +124,229 @@
|
||||||
border-radius: 0.625rem;
|
border-radius: 0.625rem;
|
||||||
z-index: 101;
|
z-index: 101;
|
||||||
}
|
}
|
||||||
|
.index-content-other[data-v-82a72f7e] {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
.index-content-right[data-v-82a72f7e] {
|
||||||
|
height: calc(100% - 3.125rem);
|
||||||
|
width: calc(100% - 1.875rem);
|
||||||
|
background-color: rgba(255, 255, 255, 0.5);
|
||||||
|
/* 白色背景透明度为 10% */
|
||||||
|
background-image: url('../../static/index/mountain.png');
|
||||||
|
background-position: 70% 45%;
|
||||||
|
border-radius: 1.5625rem;
|
||||||
|
box-shadow: 0.125rem 0.25rem 0.5rem 0.125rem rgba(0, 0, 0, 0.3);
|
||||||
|
border-radius: 0.03125rem solid #fff;
|
||||||
|
}
|
||||||
|
.index-content-right .index-right-height[data-v-82a72f7e] {
|
||||||
|
height: 0.625rem;
|
||||||
|
}
|
||||||
|
.index-content-right .index-right-title[data-v-82a72f7e] {
|
||||||
|
margin-left: 0.9375rem;
|
||||||
|
width: calc(100% - 1.875rem);
|
||||||
|
height: 3.75rem;
|
||||||
|
background: linear-gradient(to right, #C4E0FD, #D5CDFF, #D9ECFF);
|
||||||
|
border-radius: 1.09375rem;
|
||||||
|
border: 0.0625rem solid #fff;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.index-content-right .index-right-title .index-right-name[data-v-82a72f7e] {
|
||||||
|
margin-left: 0.625rem;
|
||||||
|
margin-right: 0.3125rem;
|
||||||
|
color: #19233B;
|
||||||
|
font-size: 0.9375rem;
|
||||||
|
}
|
||||||
|
.index-content-right .index-right-title .index-right-input[data-v-82a72f7e] {
|
||||||
|
font-size: 0.84375rem;
|
||||||
|
width: 8.125rem;
|
||||||
|
border: 0.0625rem #a0adc8 solid;
|
||||||
|
padding: 0.46875rem 0 0.46875rem 0.625rem;
|
||||||
|
background-color: #eaf3fe;
|
||||||
|
border-radius: 0.3125rem;
|
||||||
|
}
|
||||||
|
.index-content-right .index-right-title .index-right-button-all[data-v-82a72f7e] {
|
||||||
|
height: 100%;
|
||||||
|
margin-left: auto;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.index-content-right .index-right-title .index-right-button-all .index-right-button[data-v-82a72f7e] {
|
||||||
|
height: 2.1875rem;
|
||||||
|
background: linear-gradient(to right bottom, #00c9ff, #0076ff);
|
||||||
|
color: #fff;
|
||||||
|
font-size: 0.9375rem;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
border-radius: 0.3125rem;
|
||||||
|
border: 0.03125rem solid #fff;
|
||||||
|
margin-right: 0.625rem;
|
||||||
|
}
|
||||||
|
.index-content-right .index-right-title .index-right-button-all .index-right-button .index-right-button-img[data-v-82a72f7e] {
|
||||||
|
width: 1.40625rem;
|
||||||
|
height: 1.40625rem;
|
||||||
|
margin: 0 0.15625rem 0 0.3125rem;
|
||||||
|
}
|
||||||
|
.index-content-right .index-right-title .index-right-button-all .index-right-button .index-right-button-font[data-v-82a72f7e] {
|
||||||
|
margin-right: 0.625rem;
|
||||||
|
}
|
||||||
|
.index-content-down[data-v-82a72f7e] {
|
||||||
|
width: calc(100% - 1.875rem);
|
||||||
|
height: 3.125rem;
|
||||||
|
display: flex;
|
||||||
|
justify-content: flex-end;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.swiper-contain[data-v-82a72f7e] {
|
||||||
|
width: 100%;
|
||||||
|
margin-left: 0.3125rem;
|
||||||
|
height: calc(100% - 4.375rem);
|
||||||
|
}
|
||||||
|
.swiper-contain .swiper-flex[data-v-82a72f7e] {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
}
|
||||||
|
.swiper-contain .swiper-flex .swiper-card[data-v-82a72f7e] {
|
||||||
|
margin: 0.625rem 0 0 0.625rem;
|
||||||
|
width: 31.46875rem;
|
||||||
|
height: 16.5625rem;
|
||||||
|
border: 0.0625rem solid #fff;
|
||||||
|
border-radius: 0.9375rem;
|
||||||
|
/* 设置背景图和白色背景 */
|
||||||
|
background: url("../../static/index/clearmountain.png") center / cover, rgba(255, 255, 255, 0.5);
|
||||||
|
/* 使用 screen 混合模式,让图像与白色混合变淡 */
|
||||||
|
background-blend-mode: screen;
|
||||||
|
isolation: isolate;
|
||||||
|
box-shadow: 0.0625rem 0.0625rem 0.125rem 0 rgba(0, 0, 0, 0.3);
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
.swiper-contain .swiper-flex .swiper-card .swiper-card-left[data-v-82a72f7e] {
|
||||||
|
height: 100%;
|
||||||
|
width: 12.5rem;
|
||||||
|
}
|
||||||
|
.swiper-contain .swiper-flex .swiper-card .swiper-card-left .swiper-card-left-white[data-v-82a72f7e] {
|
||||||
|
margin: 1.25rem 0 1.09375rem 1.25rem;
|
||||||
|
width: 10.9375rem;
|
||||||
|
height: 10.9375rem;
|
||||||
|
background-color: rgba(255, 255, 255, 0.3);
|
||||||
|
display: flex;
|
||||||
|
border-radius: 0.9375rem;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.swiper-contain .swiper-flex .swiper-card .swiper-card-left .swiper-card-left-white .swiper-card-left-white-img[data-v-82a72f7e] {
|
||||||
|
width: 9.375rem;
|
||||||
|
height: 9.375rem;
|
||||||
|
}
|
||||||
|
.swiper-contain .swiper-flex .swiper-card .swiper-card-left .swiper-left-buttons[data-v-82a72f7e] {
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
.swiper-contain .swiper-flex .swiper-card .swiper-card-left .swiper-left-buttons .swiper-left-button[data-v-82a72f7e] {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
width: 5.15625rem;
|
||||||
|
height: 2.1875rem;
|
||||||
|
border-radius: 1.25rem;
|
||||||
|
background: linear-gradient(to bottom, #D5E0F8, #ECF6FF);
|
||||||
|
border: 0.03125rem #fff solid;
|
||||||
|
}
|
||||||
|
.swiper-contain .swiper-flex .swiper-card .swiper-card-left .swiper-left-buttons .swiper-left-button-blue[data-v-82a72f7e] {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
width: 5.15625rem;
|
||||||
|
height: 2.1875rem;
|
||||||
|
border-radius: 1.25rem;
|
||||||
|
background: linear-gradient(to right bottom, #00c9ff, #0076ff);
|
||||||
|
color: #fff;
|
||||||
|
border: 0.03125rem #fff solid;
|
||||||
|
margin-right: 0.625rem;
|
||||||
|
margin-left: 1.25rem;
|
||||||
|
}
|
||||||
|
.swiper-contain .swiper-flex .swiper-card .swiper-card-right[data-v-82a72f7e] {
|
||||||
|
height: 100%;
|
||||||
|
width: 17.5rem;
|
||||||
|
margin-left: 1.25rem;
|
||||||
|
}
|
||||||
|
.swiper-contain .swiper-flex .swiper-card .swiper-card-right .swiper-right-title[data-v-82a72f7e] {
|
||||||
|
margin-top: 1.09375rem;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
.swiper-contain .swiper-flex .swiper-card .swiper-card-right .swiper-right-title .swiper-title-font[data-v-82a72f7e] {
|
||||||
|
font-weight: 700;
|
||||||
|
font-size: 1.25rem;
|
||||||
|
}
|
||||||
|
.swiper-contain .swiper-flex .swiper-card .swiper-card-right .swiper-right-title .swiper-title-mark[data-v-82a72f7e] {
|
||||||
|
background-color: #d6d4f5;
|
||||||
|
color: #19233B;
|
||||||
|
padding: 0.15625rem 0.78125rem;
|
||||||
|
font-size: 0.9375rem;
|
||||||
|
border-radius: 0.78125rem;
|
||||||
|
margin-right: 0.625rem;
|
||||||
|
}
|
||||||
|
.swiper-heng[data-v-82a72f7e] {
|
||||||
|
width: 3.125rem;
|
||||||
|
height: 0.3125rem;
|
||||||
|
background: linear-gradient(to right, #0EA7DD, #047ADB);
|
||||||
|
border-radius: 0.9375rem;
|
||||||
|
margin-top: 0.3125rem;
|
||||||
|
margin-bottom: 0.9375rem;
|
||||||
|
}
|
||||||
|
.popup-detail[data-v-82a72f7e] {
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
-webkit-backdrop-filter: blur(0.03125rem);
|
||||||
|
backdrop-filter: blur(0.03125rem);
|
||||||
|
background-color: rgba(89, 109, 154, 0.4);
|
||||||
|
/* 添加毛玻璃效果 */
|
||||||
|
z-index: 999;
|
||||||
|
}
|
||||||
|
.popup-detail .popup-detail-content[data-v-82a72f7e] {
|
||||||
|
display: flex;
|
||||||
|
width: 46.875rem;
|
||||||
|
height: 28.125rem;
|
||||||
|
background: url("../../static/index/lightbgcnew.png") center / cover, rgba(255, 255, 255, 0.5);
|
||||||
|
background-blend-mode: screen;
|
||||||
|
border: 0.0625rem solid #fff;
|
||||||
|
/* 使用 screen 混合模式,让图像与白色混合变淡 */
|
||||||
|
border-radius: 0.9375rem;
|
||||||
|
box-shadow: 0.3125rem 0.3125rem 0.625rem rgba(0, 0, 0, 0.1);
|
||||||
|
transition: opacity 0.4s ease;
|
||||||
|
}
|
||||||
|
.popup-detail .popup-detail-content .popup-detail-left[data-v-82a72f7e] {
|
||||||
|
height: 100%;
|
||||||
|
width: 45%;
|
||||||
|
}
|
||||||
|
.popup-detail .popup-detail-content .popup-detail-left .popup-detail-left-white[data-v-82a72f7e] {
|
||||||
|
margin: 2.1875rem 0 0 2.1875rem;
|
||||||
|
width: 18.75rem;
|
||||||
|
height: 18.75rem;
|
||||||
|
background-color: rgba(255, 255, 255, 0.3);
|
||||||
|
display: flex;
|
||||||
|
border-radius: 0.9375rem;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.popup-detail .popup-detail-content .popup-detail-left .popup-detail-left-white .popup-detail-left-white-img[data-v-82a72f7e] {
|
||||||
|
width: 17.1875rem;
|
||||||
|
height: 17.1875rem;
|
||||||
|
}
|
||||||
|
.popup-detail .popup-detail-content .popup-detail-left .popup-detail-left-bottom[data-v-82a72f7e] {
|
||||||
|
width: calc(100% - 2.1875rem);
|
||||||
|
margin-left: 2.1875rem;
|
||||||
|
height: 7.1875rem;
|
||||||
|
background-color: #fff;
|
||||||
|
}
|
||||||
|
.popup-detail .popup-detail-content .popup-detail-right[data-v-82a72f7e] {
|
||||||
|
height: 100%;
|
||||||
|
width: 55%;
|
||||||
|
}
|
||||||
|
|
After Width: | Height: | Size: 2.1 KiB |
After Width: | Height: | Size: 2.8 KiB |
After Width: | Height: | Size: 2.7 KiB |
After Width: | Height: | Size: 2.6 KiB |
After Width: | Height: | Size: 2.0 KiB |
After Width: | Height: | Size: 1.5 KiB |