From ebce136ebb10c8a1fa9859994e6ba1b992eee953 Mon Sep 17 00:00:00 2001
From: gaosp <gaosp>
Date: 星期五, 08 三月 2024 08:49:06 +0800
Subject: [PATCH] 更新某些样式
---
src/container/workshop/device.vue | 20 +++++++++++++++++---
1 files changed, 17 insertions(+), 3 deletions(-)
diff --git a/src/container/workshop/device.vue b/src/container/workshop/device.vue
index e91f3f8..ca3bcb2 100644
--- a/src/container/workshop/device.vue
+++ b/src/container/workshop/device.vue
@@ -1,7 +1,7 @@
<!--
* @Date: 2024-01-13 20:46:33
* @LastEditors: Sneed
- * @LastEditTime: 2024-01-31 22:07:47
+ * @LastEditTime: 2024-03-06 09:51:37
* @FilePath: /belleson-frontend/Users/mache/Documents/demo/mdc/src/container/workshop/device.vue
-->
<template>
@@ -76,6 +76,7 @@
data() {
return {
devicePng,
+ scale: 1,
concern: false,
item: {}
}
@@ -138,6 +139,15 @@
},
mounted () {
this.concern = !!this.info.concern
+ console.log(this.$el.getBoundingClientRect().width,'/////',this.$el.getBoundingClientRect().width / 200)
+ this.$nextTick(() => {
+ if (this.$el.getBoundingClientRect().width < 400) {
+ this.$el.querySelector('.device-item-box').style = `transform:scale(${this.$el.getBoundingClientRect().width / 400})`
+ }
+ })
+
+
+
},
methods: {
toDetail () {
@@ -157,8 +167,10 @@
</script>
<style lang="scss" scoped>
.device-item {
- width: 394px;
- height: 321px;
+ width: 100%;
+ height: 100%;
+ // min-width: 394px;
+ // min-height: 321px;
border-radius: 10px;
border: 1px solid #3C4249;
padding: 20px;
@@ -210,6 +222,7 @@
}
&>div.device-item-box {
+ min-width: 100px;
flex: 1 1 auto;
margin-top: 20px;
display: flex;
@@ -219,6 +232,7 @@
overflow: hidden;
.img {
+ // min-width: 100px;
width: 50%;
height: 100%;
border: 1px solid #444C55;
--
Gitblit v1.9.3