Merge remote-tracking branch 'origin/master'

src/views/xjc-integratedmachine/wakeup/career_example/index.vue

@@ -6,12 +6,11 @@
         <p>{{exampleInfo.shortIntroduce}}</p>
         <p>{{exampleInfo.name}}：{{exampleInfo.type}}</p>
         <div class="left-main">
-          <div class="img-box">
-<!--            <img src="@/assets/images/wakeup/float-box.png" />-->
-            <img :src= "`${baseUrl}`+ exampleInfo.picPath" />
-          </div>
+<!--          <div class="img-box">-->
+<!--&lt;!&ndash;            <img src="@/assets/images/wakeup/float-box.png" />&ndash;&gt;-->
+<!--&lt;!&ndash;            <img :src= "`${baseUrl}`+ exampleInfo.picPath" />&ndash;&gt;-->
+<!--          </div>-->
           <div class="text-box" v-html="exampleInfo.introduce">
-
           </div>
         </div>
       </div>
@@ -167,12 +166,14 @@ p{
         color: #333333;
         line-height: 52px;
         margin-top: 28px;
+        background: #EAFAFF;
         margin-left: 52px;
       }
       p:nth-child(2){
         font-weight: bold;
         font-size: 32px;
         color: #333333;
+        //background: #EAFAFF;
         line-height: 52px;
         margin-left: 52px;
       }
@@ -182,7 +183,7 @@ p{
         .img-box{
           width: 361px;
           height: 459px;
-          border: 1px solid;
+          //border: 1px solid;
           margin-top: 26px;
           margin-left: 26px;
           img{
@@ -191,15 +192,17 @@ p{
           }
         }
         .text-box{
-          width: 789px;
+          width: 1290px;
           height: 777px;
           font-weight: 400;
           font-size: 30px;
           color: #333333;
           line-height: 52px;
-          border: 1px solid;
+          //border: 1px solid;
           text-indent: 2em;
           overflow: auto;
+          padding-right: 52px;
+          padding-left: 52px;
         }
       }
     }
@@ -231,6 +234,7 @@ p{
           color: #333333;
           line-height: 52px;
           padding-left: 10px;
+          //background: #EAFAFF;
         }
         div{
           font-weight: bold;

src/views/xjc-integratedmachine/wakeup/career_maturity/evaluation.vue

@@ -8,11 +8,11 @@
           <img src="@/assets/images/wakeup/maturity/shadow-bg.png" >
         </div>
         <div>
-          <img src="@/assets/images/wakeup/maturity/shadow-bg.png" >
-          <img src="@/assets/images/wakeup/maturity/shadow-bg.png" >
-          <img src="@/assets/images/wakeup/maturity/shadow-bg.png" >
-          <img src="@/assets/images/wakeup/maturity/shadow-bg.png" >
-          <img src="@/assets/images/wakeup/maturity/shadow-bg.png" >
+          <img src="@/assets/images/wakeup/maturity/btn1.png" >
+          <img src="@/assets/images/wakeup/maturity/btn2.png" >
+          <img src="@/assets/images/wakeup/maturity/btn3.png" >
+          <img src="@/assets/images/wakeup/maturity/btn4.png" >
+<!--          <img src="@/assets/images/wakeup/maturity/btn5.png" >-->
         </div>
       </div>
       <div></div>
@@ -93,13 +93,15 @@ onMounted(() => {
     position: absolute;
     top: 123px;
     bottom: 0;
+    display: flex;
+    justify-content: center;
    .content-img{
      width: 1187px;
-     height: 345px;
+     height: 424px;
      border: 1px solid;
      img{
        width: 1187px;
-       height: 345px;
+       height: 424px;
      }
    }
   }

src/views/xjc-integratedmachine/wakeup/index.vue

@@ -36,17 +36,8 @@
 <!--          <img  src="@/assets/images/wakeup/ai-rabit.png" />-->
 <!--        </div>-->
 <!--      </div>-->
-      <div class="container">
-        <div
-            class="draggable"
-            draggable="true"
-            @dragstart="dragStart"
-            @dragover.prevent
-            @drop="drop"
-        >
-          拖拽我
-        </div>
-      </div>
+<!--      <div id="draggable" style="width: 100px; height: 100px; background-color: red; position: absolute; top: 0; left: 0;">Drag me!</div>-->
+      <div id="draggable" style="width: 100px; height: 100px; background-color: red; position: absolute;">拖拽我</div>
     </div>
   </div>
 
@@ -101,58 +92,32 @@
         })
     }
 
+    // onMounted(() => {
+    //
+    // })
     onMounted(() => {
-        setHeadinfo()
-    })
-
-    import { reactive, onMounted } from 'vue';
-
-    const position = reactive({ x: 100, y: 10 });
-    let isDragging = false;
-    let originX, originY;
-
-    const startDrag = (e) => {
-      console.log("e",e);
-      // let chartDiv = document.getElementById("ring-chart");
-
-      isDragging = true;
-      originX = e.clientX - position.x;
-      originY = e.clientY - position.y;
-      document.addEventListener('touchmove', onMouseMove);
-      document.addEventListener('touchend', stopDrag);
-    };
-
-    const onMouseMove = (e) => {
-      if (isDragging) {
-        position.x = e.clientX - originX;
-        position.y = e.clientY - originY;
-      }
-    };
-
-    const stopDrag = () => {
-      isDragging = false;
-      document.removeEventListener('touchmove', onMouseMove);
-      document.removeEventListener('touchend', stopDrag);
-    };
-    const draggableBox = ref(null);
-    let startX = 0;
-    let startY = 0;
-    let currentX = 0;
-    let currentY = 0;
-    const handleTouchStart = (event) => {
-      startX = event.touches[0].clientX - draggableBox.value.offsetLeft;
-      startY = event.touches[0].clientY - draggableBox.value.offsetTop;
-    };
-
-    const handleTouchMove = (event) => {
-      currentX = event.touches[0].clientX - startX;
-      currentY = event.touches[0].clientY - startY;
-      draggableBox.value.style.transform = `translate3D(${currentX}px, ${currentY}px, 0)`;
-    };
-
-    const handleTouchEnd = () => {
-      // 可以添加触摸结束后的处理逻辑，比如设置一个最终的拖拽位置等
-    };
+      setHeadinfo()
+      // let startPosX, startPosY, startTouchX, startTouchY;
+      //
+      // $('#draggable').on('touchstart', function(e) {
+      //   startPosX = $(this).position().left;
+      //   startPosY = $(this).position().top;
+      //   startTouchX = e.originalEvent.touches[0].pageX;
+      //   startTouchY = e.originalEvent.touches[0].pageY;
+      // });
+      //
+      // $('#draggable').on('touchmove', function(e) {
+      //   e.preventDefault(); // 阻止默认的滚动行为
+      //   const touchX = e.originalEvent.touches[0].pageX;
+      //   const touchY = e.originalEvent.touches[0].pageY;
+      //   const deltaX = touchX - startTouchX;
+      //   const deltaY = touchY - startTouchY;
+      //   $(this).css({
+      //     left: startPosX + deltaX,
+      //     top: startPosY + deltaY,
+      //   });
+      // });
+    });
 </script>
 
 

src/views/xjc-integratedmachine/wakeup/rainbow/FollowRingChart.vue

@@ -1,6 +1,6 @@
 <template>
     <div class="chart-container">
-        <div id="ring-chart" ref="chart" class="ring-chart"></div>
+        <div id="ring-chart"  ref="chart" class="ring-chart"></div>
 
 
 
@@ -38,12 +38,13 @@
     const initChart = () => {
         if (!chart.value) return
 
-        myChart = echarts.init(chart.value)
+        myChart = echarts.init(chart.value,null,{width:width,height:height})
 
         option.value = {
+
             series: [{
                 type: 'pie',
-                radius: ['80%', '85%'],
+                radius: [radiusMax,radiusMin],
                 startAngle: 180,
                 endAngle: 360,
                 avoidLabelOverlap: false,
@@ -133,6 +134,7 @@
         const deltaY = y - centerY
         const angle = Math.atan2(deltaY, deltaX) * 180 / Math.PI
         return (angle + 450) % 360 // 调整为0-360度
+
     }
 
     onMounted(() => {
@@ -155,6 +157,8 @@
     const height = props.chartProps.height
     const left = props.chartProps.left
     const top = props.chartProps.top
+    const radiusMax = props.chartProps.radiusMax
+    const radiusMin = props.chartProps.radiusMin
     const center_x = left + width / 2
     const center_y = top + height / 2
 
@@ -232,7 +236,7 @@
             isBegin.value = false
         })
 
-        alert("绘制完成")
+
     }
 
 
@@ -264,8 +268,8 @@
 <style scoped>
     .chart-container {
         position: relative;
-        width: 100%;
-        height: 400px;
+        width: 1832px;
+        height: 910px;
         display: flex;
         flex-direction: column;
         align-items: center;
@@ -273,10 +277,11 @@
     }
 
     .ring-chart {
-        width: 100%;
-        height: 100%;
+        width: 1704px;
+        height: 910px;
         cursor: pointer;
          border: 1px solid white;
+         margin-top: 219px;
     }
 
     .instructions {

src/views/xjc-integratedmachine/wakeup/rainbow/index.vue

@@ -2,9 +2,12 @@
   <div class="development_stage">
     <head-component :headinfo=headinfo></head-component>
     <div class="page-content">
-      <div class="page-box">
-        <FollowRingChart id="ring-chart1" class="ring-chart1" :chartProps="chartPrpps1"/>
+      <div style="display: flex;justify-content: center;width: 1890px;height: 912px;margin-top: 13px">
+        <div class="page-box">
+          <FollowRingChart id="ring-chart1" class="ring-chart1" :chartProps="chartPrpps1"/>
+        </div>
       </div>
+
     </div>
   </div>
 
@@ -29,15 +32,15 @@ function setHeadinfo(){
 }
 
 const chartPrpps1 = ref({
-  left : 0,
-  top : 0,
-  width : 800,
-  height : 800,
+  // left : 100,
+  top : 106,
+  width : 1700,
+  height : 1700,
   borderColor : "#998877",
   color :"#ff00ff",
   bncolor : "#ffffff",
-  radiusMax : '85%',
-  radiusMin : '80%',
+  radiusMax : '100%',
+  radiusMin : '96%',
   isFinish : false
 })
 const position = reactive({ x: 10, y: 10 });
@@ -83,6 +86,9 @@ onMounted(() => {
 </script>
 
 <style scoped lang="scss">
+//body,html{
+//  overflow: hidden;
+//}
 p{
   margin: 0;
   padding: 0;
@@ -94,10 +100,12 @@ p{
   width: 100%;
   height: 1080px;
   .page-content {
-    width: 100%;
+    width: 1832px;
     height: 980px;
     position: absolute;
     top: 100px;
+    //display: flex;
+    //justify-content: ;
     bottom: 0;
   }
   .page-box{
@@ -105,8 +113,8 @@ p{
     height: 910px;
     background: black;
     border-radius: 35px 35px 35px 35px;
-    margin: 13px auto 0;
-    padding-top: 25px;
+    //margin: 13px auto 0;
+    /*padding-top: 25px;*/
     position: relative;
 
     .text-info{
@@ -162,7 +170,7 @@ p{
             .box-left{
               width: 53px;
               height: 25px;
-              background: #FFC300;
+              //background: #FFC300;
               border-radius: 10px 10px 10px 10px;
               //border: 1px solid white;
             }
@@ -226,7 +234,7 @@ p{
   }
   .content-bottom{
     width: 100%;
-    height: 270px;
+    height: 100%;
     display: flex;
     justify-content: space-between;
     position: relative;
@@ -268,6 +276,14 @@ p{
     cursor: pointer;
     user-select: none; /* 防止拖拽时选中文字 */
   }
+  .ring-chart1 {
+    width: 1832px;
+    height: 800px;
+    position: absolute;
+    left: 0px;
+    top : 0px;
+    //background: #ffff00;
+  }
 }
 
 </style>