Ana Sayfa Keşfet Yardım
Giriş Yap
CocoRoboLabs
/
pbl-teacher-table
3
0
Çatalla 0
Dosyalar Sorunlar 0 Değişiklik İstekleri 0 Wiki
Kaynağa Gözat

update

lsc 1 yıl önce
ebeveyn
c35058f7e8
işleme
fbf001fff5
12 değiştirilmiş dosya ile 677 ekleme ve 7 silme
Görünümü Böl Farklılık Durumunu Göster
  1. 1 1
      dist/index.html
  2. 0 0
      dist/static/css/app.9244599b68c016c3199a8545e5d7ff1a.css
  3. 0 0
      dist/static/css/app.9244599b68c016c3199a8545e5d7ff1a.css.map
  4. 0 0
      dist/static/js/app.a30f9a1747dde9fe2ba0.js
  5. 0 0
      dist/static/js/app.a30f9a1747dde9fe2ba0.js.map
  6. 0 0
      dist/static/js/manifest.3512a67a6213c2df4180.js.map
  7. 4 4
      src/components/pages/EnglishVoice/component/component/testRole.vue
  8. 131 0
      src/components/pages/test/data/pie1.vue
  9. 131 0
      src/components/pages/test/data/pie2.vue
  10. 135 0
      src/components/pages/test/data/randar1.vue
  11. 138 0
      src/components/pages/test/data/randar2.vue
  12. 137 2
      src/components/pages/test/index.vue

+ 1 - 1
dist/index.html
Dosyayı Görüntüle 

@@ -25,7 +25,7 @@
 
       height: 100%;
 
       width: 100%;
 
       background: #e6eaf0;
 
-    }</style><link href=./static/css/app.50e279f21695bbdaf2b2ee5b042c9b83.css rel=stylesheet></head><body><div id=app></div><script type=text/javascript src=./static/js/manifest.3512a67a6213c2df4180.js></script><script type=text/javascript src=./static/js/vendor.f4313154be2b51e16fef.js></script><script type=text/javascript src=./static/js/app.1c4b80069e647ab90f17.js></script></body></html><script>function stopSafari() {
 
+    }</style><link href=./static/css/app.9244599b68c016c3199a8545e5d7ff1a.css rel=stylesheet></head><body><div id=app></div><script type=text/javascript src=./static/js/manifest.3512a67a6213c2df4180.js></script><script type=text/javascript src=./static/js/vendor.f4313154be2b51e16fef.js></script><script type=text/javascript src=./static/js/app.a30f9a1747dde9fe2ba0.js></script></body></html><script>function stopSafari() {
 
     //阻止safari浏览器双击放大功能
 
     let lastTouchEnd = 0  //更新手指弹起的时间
 
     document.documentElement.addEventListener("touchstart", function (event) {

Dosya farkı çok büyük olduğundan ihmal edildi
+ 0 - 0
dist/static/css/app.9244599b68c016c3199a8545e5d7ff1a.css


Dosya farkı çok büyük olduğundan ihmal edildi
+ 0 - 0
dist/static/css/app.9244599b68c016c3199a8545e5d7ff1a.css.map


Dosya farkı çok büyük olduğundan ihmal edildi
+ 0 - 0
dist/static/js/app.a30f9a1747dde9fe2ba0.js


Dosya farkı çok büyük olduğundan ihmal edildi
+ 0 - 0
dist/static/js/app.a30f9a1747dde9fe2ba0.js.map


Dosya farkı çok büyük olduğundan ihmal edildi
+ 0 - 0
dist/static/js/manifest.3512a67a6213c2df4180.js.map


+ 4 - 4
src/components/pages/EnglishVoice/component/component/testRole.vue
Dosyayı Görüntüle 

@@ -1,7 +1,7 @@
 
 <template>
 
     <el-dialog title="对话测试" width="400px" :visible.sync="dataDialog" :append-to-body="true" :before-close="handleClose"
 
         class="dialog_diy">
 
-        <div v-loading="isloading">
 
+        <div>
 
             <div class="dialog_content">
 
                 <div class="dialog" v-for="(item, index) in answerArray" :key="index" :class="{ dialog_right: item.isY }">
 
                     <div class="d_img">
 
@@ -17,10 +17,10 @@
 
                     </div>
 
                 </div>
 
             </div>
 
-            <div class="dialog_answer">
 
+            <div class="dialog_answer" v-loading="isloading">
 
                 <span v-if="isRecord">正在录音中，再次点击话筒停止录音...</span>
 
-                <!-- @click="startRecorder" -->
 
-                <img src="../../../../../assets/icon/englishVoice/icon_voice.png" alt="" @click="addImg($event)">
 
+                <!-- -->
 
+                <img src="../../../../../assets/icon/englishVoice/icon_voice.png" alt=""  @click="startRecorder">
 
                 <input type="file" style="display: none;" @change="fileChange">
 
             </div>
 
             <iframe allow="camera *; microphone *;display-capture;midi;encrypted-media;"

+ 131 - 0
src/components/pages/test/data/pie1.vue
Dosyayı Görüntüle 

@@ -0,0 +1,131 @@
 
+<template>
 
+    <div class="data_body">
 
+        <div style="width: 100%; height: 100%">
 
+            <div id="charts_canvas" class="echart" style="width: 100%; height: 100%"></div>
 
+        </div>
 
+    </div>
 
+</template>
 
+  
+<script>
 
+export default {
 
+    props: {
 
+        loginArray: {
 
+            type: Array
 
+        },
 
+    },
 
+    data() {
 
+        return {
 
+            chartObj: null,
 
+            ooption: {
 
+                xdata: [],
 
+                type: [],
 
+            },
 
+            option: {
 
+                tooltip: {
 
+                    trigger: 'item'
 
+                },
 
+                series: [
 
+                    {
 
+                        type: 'pie',
 
+                        radius: ['80%', '100%'],
 
+                        avoidLabelOverlap: false,
 
+                        itemStyle: {
 
+                            borderRadius: 10,
 
+                            borderColor: '#fff',
 
+                            borderWidth: 2
 
+                        },
 
+                        label: {
 
+                            show: false,
 
+                            position: 'center',
 
+                            formatter: '{b}\n{c}'
 
+                        },
 
+                        emphasis: {
 
+                            label: {
 
+                                show: true,
 
+                                fontSize: 25,
 
+                                formatter: '{c}'
 
+                            }
 
+                        },
 
+                        labelLine: {
 
+                            show: false
 
+                        },
 
+                        hoverOffset: 0, // 设置鼠标悬停时不放大
 
+                        data: [
 
+                            { value: 10, name: '进行中', itemStyle: { normal: { color: '#3673e8' } } },
 
+                            { value: 8, name: '未发布', itemStyle: { normal: { color: '#61b8ff' } } },
 
+                            { value: 6, name: '已完成', itemStyle: { normal: { color: '#96d8a8' } } },
 
+                            { value: 7, name: '逾期', itemStyle: { normal: { color: '#f5b763' } } },
 
+                        ]
 
+                    }
 
+                ]
 
+            },
 
+        };
 
+    },
 
+    methods: {
 
+        setChart(array) {
 
+            // 雷达图显示的标签
 
+            let newPromise = new Promise((resolve) => {
 
+                resolve();
 
+            });
 
+            //然后异步执行echarts的初始化函数
 
+            newPromise.then(() => {
 
+                const chartObj = this.$echarts.init(
 
+                    this.$el.querySelector("#charts_canvas")
 
+                );
 
+                //   this.option.series[0].data = array;
 
+                // 初始化雷达图
 
+                this.chartObj = chartObj;
 
+                this.chartObj.setOption(this.option);
 
+            });
 
+        },
 
+        setJson(array) {
 
+            this.ooption = {
 
+                xdata: [],
 
+                sdata: [],
 
+                max: 0
 
+            }
 
+
 
+            if (!this.chartObj) {
 
+                this.setChart(array);
 
+            } else {
 
+                this.option.series[0].data = array;
 
+                this.chartObj.setOption(this.option);
 
+            }
 
+        }
 
+    },
 
+    watch: {
 
+        loginArray: {
 
+            immediate: true,
 
+            deep: true,
 
+            handler(newValue, oldValue) {
 
+                this.setJson(newValue)
 
+                this.$forceUpdate();
 
+            },
 
+        },
 
+    },
 
+    mounted() {
 
+        this.setJson(this.loginArray)
 
+        var _this = this;
 
+        window.addEventListener("resize", () => {
 
+            if (_this.chartObj) {
 
+                _this.chartObj.resize();
 
+            }
 
+        });
 
+    },
 
+};
 
+</script>
 
+  
+<style scoped>
 
+.data_body {
 
+    height: 100%;
 
+    /* display: flex; */
 
+    position: relative;
 
+    border-radius: 5px;
 
+    /* border: 1px solid #eee; */
 
+    margin: 0 auto;
 
+    box-sizing: border-box;
 
+    padding: 0;
 
+    width: 100%;
 
+    /* background: #fff; */
 
+}
 
+</style>

+ 131 - 0
src/components/pages/test/data/pie2.vue
Dosyayı Görüntüle 

@@ -0,0 +1,131 @@
 
+<template>
 
+    <div class="data_body">
 
+        <div style="width: 100%; height: 100%">
 
+            <div id="charts_canvas" class="echart" style="width: 100%; height: 100%"></div>
 
+        </div>
 
+    </div>
 
+</template>
 
+  
+<script>
 
+export default {
 
+    props: {
 
+        loginArray: {
 
+            type: Array
 
+        },
 
+    },
 
+    data() {
 
+        return {
 
+            chartObj: null,
 
+            ooption: {
 
+                xdata: [],
 
+                type: [],
 
+            },
 
+            option: {
 
+                tooltip: {
 
+                    trigger: 'item'
 
+                },
 
+                series: [
 
+                    {
 
+                        type: 'pie',
 
+                        radius: ['80%', '100%'],
 
+                        avoidLabelOverlap: false,
 
+                        itemStyle: {
 
+                            borderRadius: 10,
 
+                            borderColor: '#fff',
 
+                            borderWidth: 2
 
+                        },
 
+                        label: {
 
+                            show: false,
 
+                            position: 'center',
 
+                            formatter: '{b}\n{c}'
 
+                        },
 
+                        emphasis: {
 
+                            label: {
 
+                                show: true,
 
+                                fontSize: 25,
 
+                                formatter: '{c}'
 
+                            }
 
+                        },
 
+                        labelLine: {
 
+                            show: false
 
+                        },
 
+                        hoverOffset: 0, // 设置鼠标悬停时不放大
 
+                        data: [
 
+                            { value: 10, name: '未完成', itemStyle: { normal: { color: '#3673e8' } } },
 
+                            { value: 8, name: '进行中', itemStyle: { normal: { color: '#61b8ff' } } },
 
+                            { value: 6, name: '已完成', itemStyle: { normal: { color: '#96d8a8' } } },
 
+                            { value: 7, name: '逾期', itemStyle: { normal: { color: '#f5b763' } } },
 
+                        ]
 
+                    }
 
+                ]
 
+            },
 
+        };
 
+    },
 
+    methods: {
 
+        setChart(array) {
 
+            // 雷达图显示的标签
 
+            let newPromise = new Promise((resolve) => {
 
+                resolve();
 
+            });
 
+            //然后异步执行echarts的初始化函数
 
+            newPromise.then(() => {
 
+                const chartObj = this.$echarts.init(
 
+                    this.$el.querySelector("#charts_canvas")
 
+                );
 
+                //   this.option.series[0].data = array;
 
+                // 初始化雷达图
 
+                this.chartObj = chartObj;
 
+                this.chartObj.setOption(this.option);
 
+            });
 
+        },
 
+        setJson(array) {
 
+            this.ooption = {
 
+                xdata: [],
 
+                sdata: [],
 
+                max: 0
 
+            }
 
+
 
+            if (!this.chartObj) {
 
+                this.setChart(array);
 
+            } else {
 
+                this.option.series[0].data = array;
 
+                this.chartObj.setOption(this.option);
 
+            }
 
+        }
 
+    },
 
+    watch: {
 
+        loginArray: {
 
+            immediate: true,
 
+            deep: true,
 
+            handler(newValue, oldValue) {
 
+                this.setJson(newValue)
 
+                this.$forceUpdate();
 
+            },
 
+        },
 
+    },
 
+    mounted() {
 
+        this.setJson(this.loginArray)
 
+        var _this = this;
 
+        window.addEventListener("resize", () => {
 
+            if (_this.chartObj) {
 
+                _this.chartObj.resize();
 
+            }
 
+        });
 
+    },
 
+};
 
+</script>
 
+  
+<style scoped>
 
+.data_body {
 
+    height: 100%;
 
+    /* display: flex; */
 
+    position: relative;
 
+    border-radius: 5px;
 
+    /* border: 1px solid #eee; */
 
+    margin: 0 auto;
 
+    box-sizing: border-box;
 
+    padding: 0;
 
+    width: 100%;
 
+    /* background: #fff; */
 
+}
 
+</style>

+ 135 - 0
src/components/pages/test/data/randar1.vue
Dosyayı Görüntüle 

@@ -0,0 +1,135 @@
 
+<template>
 
+    <div class="data_body">
 
+        <div style="width: 100%; height: 100%">
 
+            <div id="charts_canvas" class="echart" style="width: 100%; height: 100%"></div>
 
+        </div>
 
+    </div>
 
+</template>
 
+  
+<script>
 
+export default {
 
+    props: {
 
+        loginArray: {
 
+            type: Array
 
+        },
 
+    },
 
+    data() {
 
+        return {
 
+            chartObj: null,
 
+            ooption: {
 
+                xdata: [],
 
+                type: [],
 
+            },
 
+            option: {
 
+                tooltip: {},
 
+                radar: {
 
+                    indicator: [
 
+                        { name: '煜煜星光', max: 100 },
 
+                        { name: '个人写真', max: 100 },
 
+                        { name: '明灯导航', max: 100 },
 
+                        { name: '教师耕耘', max: 100 },
 
+                        { name: '其他', max: 100 }
 
+                    ],
 
+                    axisName: {
 
+                        color: '#000',
 
+                        fontSize: 12
 
+                    },
 
+                    radius: ['0%', '70%'],
 
+                    center: ['50%', '55%'],
 
+                    nameGap: 5,
 
+                },
 
+                series: [
 
+                    {
 
+                        name: '综合平均分',
 
+                        type: 'radar',
 
+                        data: [
 
+                            {
 
+                                value: [86, 76, 35, 85, 80, 86],
 
+                                itemStyle: {
 
+                                    color: '#3673E8' // 设置数据点的颜色
 
+                                },
 
+                                lineStyle: {
 
+                                    normal: {
 
+                                        color: '#3673E8' // 
+                                    }
 
+                                },
 
+                                areaStyle: {
 
+                                    normal: {
 
+                                        color: '#3673E833' // 
+                                    }
 
+                                }
 
+                            }
 
+                        ]
 
+                    }
 
+                ]
 
+            },
 
+        };
 
+    },
 
+    methods: {
 
+        setChart(array) {
 
+            // 雷达图显示的标签
 
+            let newPromise = new Promise((resolve) => {
 
+                resolve();
 
+            });
 
+            //然后异步执行echarts的初始化函数
 
+            newPromise.then(() => {
 
+                const chartObj = this.$echarts.init(
 
+                    this.$el.querySelector("#charts_canvas")
 
+                );
 
+                //   this.option.series[0].data = array;
 
+                // 初始化雷达图
 
+                this.chartObj = chartObj;
 
+                this.chartObj.setOption(this.option);
 
+            });
 
+        },
 
+        setJson(array) {
 
+            this.ooption = {
 
+                xdata: [],
 
+                sdata: [],
 
+                max: 0
 
+            }
 
+
 
+            if (!this.chartObj) {
 
+                this.setChart(array);
 
+            } else {
 
+                this.option.series[0].data = array;
 
+                this.chartObj.setOption(this.option);
 
+            }
 
+        }
 
+    },
 
+    watch: {
 
+        loginArray: {
 
+            immediate: true,
 
+            deep: true,
 
+            handler(newValue, oldValue) {
 
+                this.setJson(newValue)
 
+                this.$forceUpdate();
 
+            },
 
+        },
 
+    },
 
+    mounted() {
 
+        this.setJson(this.loginArray)
 
+        var _this = this;
 
+        window.addEventListener("resize", () => {
 
+            if (_this.chartObj) {
 
+                _this.chartObj.resize();
 
+            }
 
+        });
 
+    },
 
+};
 
+</script>
 
+  
+<style scoped>
 
+.data_body {
 
+    height: 100%;
 
+    /* display: flex; */
 
+    position: relative;
 
+    border-radius: 5px;
 
+    /* border: 1px solid #eee; */
 
+    margin: 0 auto;
 
+    box-sizing: border-box;
 
+    padding: 0;
 
+    width: 100%;
 
+    /* background: #fff; */
 
+}
 
+</style>

+ 138 - 0
src/components/pages/test/data/randar2.vue
Dosyayı Görüntüle 

@@ -0,0 +1,138 @@
 
+<template>
 
+    <div class="data_body">
 
+        <div style="width: 100%; height: 100%">
 
+            <div id="charts_canvas" class="echart" style="width: 100%; height: 100%"></div>
 
+        </div>
 
+    </div>
 
+</template>
 
+  
+<script>
 
+export default {
 
+    props: {
 
+        loginArray: {
 
+            type: Array
 
+        },
 
+    },
 
+    data() {
 
+        return {
 
+            chartObj: null,
 
+            ooption: {
 
+                xdata: [],
 
+                type: [],
 
+            },
 
+            option: {
 
+                tooltip: {},
 
+                radar: {
 
+                    indicator: [
 
+                        { name: '煜煜星光', max: 100 },
 
+                        { name: '个人写真', max: 100 },
 
+                        { name: '明灯导航', max: 100 },
 
+                        { name: '教师耕耘', max: 100 },
 
+                        { name: '其他', max: 100 }
 
+                    ],
 
+                    axisName: {
 
+                        color: '#000'
 
+                    },
 
+                    axisName: {
 
+                        color: '#000',
 
+                        fontSize: 12
 
+                    },
 
+                    radius: ['0%', '70%'],
 
+                    center: ['50%', '55%'],
 
+                    nameGap: 5,
 
+                },
 
+                series: [
 
+                    {
 
+                        name: '综合平均分',
 
+                        type: 'radar',
 
+                        data: [
 
+                            {
 
+                                value: [86, 76, 35, 85, 80, 86],
 
+                                itemStyle: {
 
+                                    color: '#F5B763' // 设置数据点的颜色
 
+                                },
 
+                                lineStyle: {
 
+                                    normal: {
 
+                                        color: '#F5B763' // 
+                                    }
 
+                                },
 
+                                areaStyle: {
 
+                                    normal: {
 
+                                        color: '#F5B76333' // 
+                                    }
 
+                                }
 
+                            }
 
+                        ]
 
+                    }
 
+                ]
 
+            },
 
+        };
 
+    },
 
+    methods: {
 
+        setChart(array) {
 
+            // 雷达图显示的标签
 
+            let newPromise = new Promise((resolve) => {
 
+                resolve();
 
+            });
 
+            //然后异步执行echarts的初始化函数
 
+            newPromise.then(() => {
 
+                const chartObj = this.$echarts.init(
 
+                    this.$el.querySelector("#charts_canvas")
 
+                );
 
+                //   this.option.series[0].data = array;
 
+                // 初始化雷达图
 
+                this.chartObj = chartObj;
 
+                this.chartObj.setOption(this.option);
 
+            });
 
+        },
 
+        setJson(array) {
 
+            this.ooption = {
 
+                xdata: [],
 
+                sdata: [],
 
+                max: 0
 
+            }
 
+
 
+            if (!this.chartObj) {
 
+                this.setChart(array);
 
+            } else {
 
+                this.option.series[0].data = array;
 
+                this.chartObj.setOption(this.option);
 
+            }
 
+        }
 
+    },
 
+    watch: {
 
+        loginArray: {
 
+            immediate: true,
 
+            deep: true,
 
+            handler(newValue, oldValue) {
 
+                this.setJson(newValue)
 
+                this.$forceUpdate();
 
+            },
 
+        },
 
+    },
 
+    mounted() {
 
+        this.setJson(this.loginArray)
 
+        var _this = this;
 
+        window.addEventListener("resize", () => {
 
+            if (_this.chartObj) {
 
+                _this.chartObj.resize();
 
+            }
 
+        });
 
+    },
 
+};
 
+</script>
 
+  
+<style scoped>
 
+.data_body {
 
+    height: 100%;
 
+    /* display: flex; */
 
+    position: relative;
 
+    border-radius: 5px;
 
+    /* border: 1px solid #eee; */
 
+    margin: 0 auto;
 
+    box-sizing: border-box;
 
+    padding: 0;
 
+    width: 100%;
 
+    /* background: #fff; */
 
+}
 
+</style>

+ 137 - 2
src/components/pages/test/index.vue
Dosyayı Görüntüle 

@@ -24,6 +24,58 @@
 
             <span class="active">个人总览</span>
 
         </div>
 
         <div class="bbox">
 
+            <div class="test_data_box">
 
+                <div class="data_box">
 
+                    <div class="left">
 
+                        <div class="title">表单状态总览</div>
 
+                        <div class="box">
 
+                            <span class="color1">{{ 10 }}个进行中</span>
 
+                            <span class="color2">{{ 8 }}个未发布</span>
 
+                            <span class="color3">{{ 6 }}个已完成</span>
 
+                            <span class="color4">{{ 7 }}个逾期</span>
 
+                        </div>
 
+                    </div>
 
+                    <div class="right">
 
+                        <pie-1></pie-1>
 
+                    </div>
 
+                </div>
 
+                <div class="data_box">
 
+                    <div class="left">
 
+                        <div class="title">教师完成情况</div>
 
+                        <div class="box">
 
+                            <span class="color1">{{ 10 }}个未完成</span>
 
+                            <span class="color2">{{ 8 }}个进行中</span>
 
+                            <span class="color3">{{ 6 }}个已完成</span>
 
+                            <span class="color4">{{ 7 }}个逾期</span>
 
+                        </div>
 
+                    </div>
 
+                    <div class="right">
 
+                        <pie-2></pie-2>
 
+                    </div>
 
+                </div>
 
+                <div class="data_box">
 
+                    <div class="left">
 
+                        <div class="title">综合平均分</div>
 
+                        <div class="box2">
 
+                            <span>{{ 85 }}</span>
 
+                        </div>
 
+                    </div>
 
+                    <div class="right">
 
+                        <randar-1></randar-1>
 
+                    </div>
 
+                </div>
 
+                <div class="data_box">
 
+                    <div class="left">
 
+                        <div class="title">逾期情况</div>
 
+                        <div class="box2">
 
+                            <span>{{ 12 }}%</span>
 
+                        </div>
 
+                    </div>
 
+                    <div class="right">
 
+                        <randar-2></randar-2>
 
+                    </div>
 
+                </div>
 
+            </div>
 
             <div class="search_nav">
 
                 <div class="right">
 
                     <span :class="{active: stype == 1}">按问卷查看</span>
 
@@ -201,9 +253,13 @@
 
 import "../../../common/aws-sdk-2.235.1.min";
 
 import EditorBar from "../../../components/tools/wangEnduit";
 
 import CourseProblem from "../components/courseProblem";
 
+import pie2 from "./data/pie2.vue";
 
+import pie1 from "./data/pie1.vue";
 
+import randar1 from "./data/randar1.vue";
 
+import randar2 from "./data/randar2.vue";
 
 export default {
 
     name: 'test',
 
-    components: { EditorBar, CourseProblem },
 
+    components: { EditorBar, CourseProblem, pie1, pie2, randar1, randar2 },
 
     data() {
 
         return {
 
             itemCount: 1,
 
@@ -1194,7 +1250,7 @@ export default {
 
 }
 
 
 .choose>div {
 
-    margin-left: 10px;
 
+    /* margin-left: 10px; */
 
     width: 180px;
 
     /* margin-top: 15px; */
 
 }
 
@@ -1643,5 +1699,84 @@ export default {
 
 .student_input >>> .el-input__inner{
 
     padding-right: 35px;
 
 }
 
+
 
+
 
+.test_data_box{
 
+    display: flex;
 
+    width: calc(100% - 20px);
 
+    margin: 0 auto 15px;
 
+    flex-wrap: wrap;
 
+}
 
+.test_data_box > .data_box{
 
+    width: calc(100% / 4 - (45px / 4));
 
+    height: 150px;
 
+    border: 1px solid #e7e7e7;
 
+    border-radius: 5px;
 
+    box-sizing: border-box;
 
+    padding: 10px;
 
+    display: flex;
 
+    align-items: center;
 
+}
 
+
 
+.test_data_box > .data_box + .data_box{
 
+    margin-left: 15px;
 
+}
 
+.test_data_box > .data_box > .left{
 
+    /* width: 110px; */
 
+    min-width: fit-content;
 
+    height: 100%;
 
+}
 
+.test_data_box > .data_box > .left > .title{
 
+    font-size: 16px;
 
+    color: #00000099;
 
+    margin-bottom: 10px;
 
+}
 
+.test_data_box > .data_box > .left > .box{
 
+    display: flex;
 
+    flex-direction: column;
 
+    font-size: 14px;
 
+    height: calc(100% - 30px);
 
+    justify-content: space-between;
 
+}
 
+.test_data_box > .data_box > .left > .box2{
 
+    display: flex;
 
+    flex-direction: column;
 
+    font-size: 30px;
 
+    font-weight: 600;
 
+    height: calc(100% - 60px);
 
+    /* align-items:center; */
 
+    justify-content: center;
 
+}
 
+.test_data_box > .data_box > .left > .box > span{
 
+    display: flex;
 
+    align-items: center;
 
+}
 
+.test_data_box > .data_box > .left > .box > span::before{
 
+    content: '';
 
+    width: 10px;
 
+    height: 10px;
 
+    border-radius: 50%;
 
+    /* background: #000; */
 
+    margin-right: 5px;
 
+}
 
+
 
+.test_data_box > .data_box > .left > .box > .color1::before{
 
+    background: #3673e8;
 
+}
 
+.test_data_box > .data_box > .left > .box > .color2::before{
 
+    background: #61b8ff;
 
+}
 
+.test_data_box > .data_box > .left > .box > .color3::before{
 
+    background: #96d8a8;
 
+}
 
+.test_data_box > .data_box > .left > .box > .color4::before{
 
+    background: #f5b763;
 
+}
 
+.test_data_box > .data_box > .right{
 
+    /* width: calc(100% - 110px); */
 
+    width: calc(100%);
 
+    height: 100%;
 
+}
 
+
 
 </style>

Bu fark içinde çok fazla dosya değişikliği olduğu için bazı dosyalar gösterilmiyor