Merge remote-tracking branch 'origin/master'

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

@@ -6,10 +6,6 @@
         <p>{{exampleInfo.shortIntroduce}}</p>
         <p>{{exampleInfo.name}}：{{exampleInfo.type}}</p>
         <div class="left-main">
-<!--          <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>
@@ -18,26 +14,13 @@
       <div class="content-right">
           <div v-for="(item,index) in exampleData" class="item-box" :class="{ 'active-button': isActive }" @click="showInfo(item,index)">
             <img :src= "`${baseUrl}`+ item.picPath" />
-          {{exampleId===item.id}}---
+          {{exampleId===item.id}}
             {{item.id}}
             <div>{{item.name}}</div>
             <p >{{item.type}}</p>
             <p >{{item.shortIntroduce}}</p>
           </div>
       </div>
-      <!--      <div class="content-box">-->
-<!--      </div>-->
-      <!--      <div class="content-bottom">-->
-      <!--        <div class="draw draggable-ball" @mousedown="startDrag" :style="{ left: position.x + 'px', top: position.y + 'px' }">-->
-      <!--          <img src="@/assets/images/wakeup/float-box.png" />-->
-      <!--        </div>-->
-      <!--        <div class="ai-rabit">-->
-      <!--          <div class="ai-rabit-text">-->
-      <!--            你好，同学欢迎进入生涯学习系统-->
-      <!--          </div>-->
-      <!--          <img  src="@/assets/images/wakeup/ai-rabit.png" />-->
-      <!--        </div>-->
-      <!--      </div>-->
     </div>
 
     <el-dialog

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

@@ -19,12 +19,15 @@
             综合来看，你对生涯发展有一定认知，但心理准备不足，缺乏系统规划，面对生涯选择时容易迷茫，易受周围同学或家长影响，尚未形成稳定的生涯发展思路。
           </p>
           <div class="table-box">
-
+            <div class="main">
+              <div ref="chartContainer" class="chart-container"></div>
+            </div>
           </div>
         </div>
         <div class="two-page" v-show="twoPage">112</div>
         <div class="three-page" v-show="threePage">11112</div>
       </div>
+
     </div>
     <el-dialog v-model="centerDialogVisible" :show-close="false" width="500" center>
     <span>
@@ -45,11 +48,13 @@
 <script setup>
 import headComponent from '@/views/xjc-integratedmachine/components/head_component.vue'
 import {Calendar} from '@element-plus/icons-vue'
-import {onMounted, reactive} from "vue";
+import {ref,onMounted} from "vue";
 import {maturityReport} from "@/api/xjc-integratedmachine/wakeup/index.js";
+import * as echarts from 'echarts';
 
 const headinfo = ref({})
 const describeInfo = ref('')
+const evaluationList =  ref([])
 let pageLoading = ref(false)
 
 function setHeadinfo() {
@@ -68,65 +73,27 @@ const onePage = ref(true)
 const twoPage = ref(false)
 const threePage = ref(false)
 
-const position = reactive({x: 10, y: 10});
-let isDragging = false;
-let originX, originY;
-
-const startDrag = (e) => {
-  console.log("e", e)
-  isDragging = true;
-  originX = e.clientX - position.x;
-  originY = e.clientY - position.y;
-  console.log("originX", originX, originY, "originY")
-  document.addEventListener('mousemove', onMouseMove);
-  document.addEventListener('mouseup', stopDrag);
-};
-
-const onMouseMove = (e) => {
-  if (isDragging) {
-    position.x = e.clientX - originX;
-    position.y = e.clientY - originY;
-    console.log("position.x", position.x, "position.y", position.y)
-  }
-};
-
-const stopDrag = () => {
-  isDragging = false;
-  document.removeEventListener('mousemove', onMouseMove);
-  document.removeEventListener('mouseup', stopDrag);
-};
 const describe = (val) => {
   describeInfo.value = val;
   centerDialogVisible.value = true;
 };
-const showPage = (val) => {
-  if (val === 1) {
-    onePage.value = true;
-    twoPage.value = false;
-    threePage.value = false;
-  } else if (val === 2) {
-    onePage.value = false;
-    twoPage.value = true;
-    threePage.value = false;
-  } else if (val === 3) {
-    onePage.value = false;
-    twoPage.value = false;
-    threePage.value = true;
-  }
-}
 //请求页面数据
 function getMaturityReport() {
-  pageLoading = true;
+  // pageLoading = true;
   let id = "60f384a7-4970-44cb-a9da-0ce00519eee9"
   maturityReport({id :id }).then(res => {
-    // console
-    if(res.exampleList.length > 0){
-      exampleInfo.value = res.exampleList[0];
-    }
-    exampleData.value = res.exampleList;
+
+    //
     pageLoading = false;
+    // if(res.data.eval.length > 0){
+    evaluationList.value = res.data.eval;
+    console.log("evaluationList.value",evaluationList.value)
+    // }
+    // exampleData.value = res.data.exampleList;
+
   }).catch((err)=>{
     console.log("error")
+    alert("111111111")
     pageLoading = false;
   })
 }
@@ -135,6 +102,45 @@ onMounted(() => {
   getMaturityReport()
 })
 
+// 定义一个ref来引用图表的容器
+const chartContainer = ref(null);
+let chartInstance = null;
+
+// 图表配置和数据
+const chartOptions = {
+  title: {
+    text: 'ECharts 横向柱状图示例',
+  },
+  tooltip: {},
+  xAxis: {
+    type: 'value', // 修改为数值轴，用于显示柱状图的高度
+  },
+  yAxis: {
+    type: 'category', // 修改为类目轴，用于显示柱状图的类别
+    data: ['衬衫', '羊毛衫', '雪纺衫', '裤子', '高跟鞋', '袜子','11','23','34','34'],
+  },
+  series: [
+    {
+      name: '销量',
+      type: 'bar', // 仍然使用柱状图，但方向会由ECharts根据xAxis和yAxis的配置自动调整
+      data: [5, 20, 36, 10, 10, 20,23,33,33,44],
+    },
+  ],
+};
+
+// 初始化图表
+const initChart = () => {
+  if (chartContainer.value) {
+    chartInstance = echarts.init(chartContainer.value);
+    chartInstance.setOption(chartOptions);
+  }
+};
+
+// 组件挂载时初始化图表
+onMounted(() => {
+  initChart();
+});
+
 </script>
 
 <style scoped lang="scss">
@@ -219,9 +225,10 @@ p {
       .table-box{
         width: 1525px;
         height: 720px;
-        background: #C0E7FF;
-        opacity: 0.2;
+        background:rgba(192, 231, 255, 0.20);
+        //opacity: 0.2;
         margin-top: 26px;
+        z-index:10;
       }
 
     }
@@ -320,5 +327,9 @@ p {
     color: #266EFF;
   }
 }
-
+.chart-container {
+  width: 1040px;
+  height: 620px; /* 可以根据需要调整高度 */
+  border: 1px solid;
+}
 </style>

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

@@ -2,7 +2,7 @@
     <div class="chart-container">
         <div id="ring-chart" ref="chart" class="ring-chart"></div>
         <!--      //圆心-->
-        <!--        <div id="cc" style="position: absolute;width: 5px;height: 5px;background: #ff0000"></div>-->
+                <!--<div id="cc" style="position: absolute;width: 5px;height: 5px;background: #ff0000"></div>-->
 
 
         <!--<div id="ring-chart" ref="chart" class="ring-chart"-->
@@ -15,6 +15,12 @@
     import * as echarts from 'echarts'
 
     // document.body.style.overflow = 'hidden';
+    document.oncontextmenu = function (event) {
+        event.preventDefault(); // 阻止默认右键菜单
+    };
+
+
+    // document.body.style.overflow = 'hidden';
     const props = defineProps({
         chartProps: {}
     })
@@ -163,6 +169,8 @@
     const center_x = left + width / 2
     const center_y = top + height / 2
 
+    console.log("共用圆心",center_x,center_y)
+
     function init() {
         //
         // var cc = document.getElementById("cc");
@@ -170,10 +178,11 @@
         // cc.style.top = center_y + "px"
         // cc.style.left = center_x + "px"
 
-        let chartDiv = document.getElementById("ring-chart");
-        chartDiv.addEventListener('touchstart', begin)
-        chartDiv.addEventListener('touchmove', moving)
-        chartDiv.addEventListener('touchend', stopMoving)
+        //单独注册事件
+        // let chartDiv = document.getElementById("ring-chart");
+        // chartDiv.addEventListener('touchstart', begin)
+        // chartDiv.addEventListener('touchmove', moving)
+        // chartDiv.addEventListener('touchend', stopMoving)
     }
 
     function testMove(e) {
@@ -231,52 +240,51 @@
     // }
 
     function begin(event) {
-        console.log("=====", props.chartProps.status)
+        console.log("2222")
+        if (!props.chartProps.power) return;
         if (!event.targetTouches || event.targetTouches.length === 0) return;
         //鼠标按下，取点
         let mouse_x = event.targetTouches[0].pageX;
         let mouse_y = event.targetTouches[0].pageY;
         if (props.chartProps.status == 'edit' && isFinish.value == true) {
             //
-            console.log(mouse_x,"11111",mouse_x)
-            //
             //计算一下离谁比较近
-            let d_begin = Math.pow((beginPoint.value.x - mouse_x),2)+ Math.pow((beginPoint.value.y - mouse_y),2)
-            let d_end = Math.pow((endPoint.value.x - mouse_x),2)+ Math.pow((endPoint.value.y - mouse_y),2)
-            if(d_begin <= d_end){
+            let d_begin = Math.pow((beginPoint.value.x - mouse_x), 2) + Math.pow((beginPoint.value.y - mouse_y), 2)
+            let d_end = Math.pow((endPoint.value.x - mouse_x), 2) + Math.pow((endPoint.value.y - mouse_y), 2)
+            if (d_begin <= d_end) {
                 let ang = calculateAngleDegrees(mouse_x, mouse_y, center_x, center_y)
                 option.value.series[0].startAngle = 180 - ang
                 beginCorner.value = ang
-                beginPoint.value ={
-                    x : mouse_x,
-                    y : mouse_y
+                beginPoint.value = {
+                    x: mouse_x,
+                    y: mouse_y
                 }
                 //
-            }else{
+            } else {
                 let eang = calculateAngleDegrees(mouse_x, mouse_y, center_x, center_y)
                 option.value.series[0].data[0].value = (eang - beginCorner.value) * 5 / 9 + beginCorner.value / 30
                 option.value.series[0].data[1].value = 100 - (eang - beginCorner.value) * 5 / 9 - beginCorner.value / 30
                 endCorner.value = eang
-                endPoint.value ={
-                    x : mouse_x,
-                    y : mouse_y
+                endPoint.value = {
+                    x: mouse_x,
+                    y: mouse_y
                 }
             }
-        } else if (props.chartProps.status == 'new') {
+        } else if (props.chartProps.status == 'new' && !isFinish.value) {
             let ang = calculateAngleDegrees(mouse_x, mouse_y, center_x, center_y)
             beginCorner.value = ang
             beginPoint.value = {
                 x: mouse_x,
                 y: mouse_y
             }
-            console.log("ssss",beginPoint.value.x,beginPoint.value.y)
             option.value.series[0].startAngle = 180 - ang
             isBegin.value = true
         }
         myChart.setOption(option.value)
     }
 
-    function stopMoving() {
+    function stopMoving(event) {
+        if (!props.chartProps.power) return;
         nextTick(() => {
             isFinish.value = true
             isBegin.value = false
@@ -287,9 +295,11 @@
 
     function finish() {
         //alert("绘制完成!")
+        console.log("ffffffffffffffffffffff")
     }
 
     function moving(event) {
+        if (!props.chartProps.power) return;
         let mouse_x = event.targetTouches[0].pageX;
         let mouse_y = event.targetTouches[0].pageY;
         let eang = calculateAngleDegrees(mouse_x, mouse_y, center_x, center_y)
@@ -329,6 +339,13 @@
     //
     // }
 
+    defineExpose({
+        finish,
+        begin,
+        moving,
+        stopMoving
+    })
+
 </script>
 
 <style scoped>
@@ -340,6 +357,7 @@
         flex-direction: column;
         align-items: center;
         justify-content: center;
+        /*border: 1px solid white;*/
     }
 
     .ring-chart {
@@ -347,6 +365,13 @@
         height: 910px;
         cursor: pointer;
         margin-top: 219px;
+        border: 1px solid white;
+
+    }
+
+    body {
+        overscroll-behavior: none; /* 禁用滑动返回 */
+        touch-action: pan-y; /* 仅允许垂直滚动 */
     }
 
 

vite.config.js

@@ -46,8 +46,8 @@ export default defineConfig(({ mode, command }) => {
       proxy: {
         // https://cn.vitejs.dev/config/#server-proxy
         '/dev-api': {
-          target: 'http://localhost:8080',
-          // target: 'http://192.168.3.100:8080',//临时11
+          // target: 'http://localhost:8080',
+          target: 'http://192.168.3.100:8080',//临时11
           changeOrigin: true,
           rewrite: (p) => p.replace(/^\/dev-api/, '')
         }