修改图片和跳转

cirs-ui/src/views/index.vue

@@ -2,240 +2,225 @@
 
   <div class="app-container home">
     <el-carousel :interval="5000" type="card" height="380px">
-      <el-carousel-item >
-          <img src='@/assets/images/img4.png' @click="recommend" alt="图片无法加载" style="width:100%;height:100%" class="image"/>
-        <span style="position: absolute; bottom: 10px;right: 300px;font-size: 30px;font-family: 新宋体;color: #3A71A8;font-weight: bold">元器件推荐</span>
+      <el-carousel-item>
+        <img src="@/assets/images/img4.png" alt="图片无法加载" style="width:100%;height:100%" class="image" @click="recommend">
+        <span style="position: absolute; bottom: 10px;right: 250px;font-size: 30px;font-family: 新宋体;color: rgb(84 242 161);font-weight: bold">元器件推荐</span>
       </el-carousel-item>
-      <el-carousel-item >
-        <img src='@/assets/images/img6.png' @click="task" alt="图片无法加载" style="width:100%;height:100%" class="image"/>
-        <span style="position: absolute; bottom: 10px;right: 300px;font-size: 30px;font-family: 新宋体;color: #3A71A8;font-weight: bold">验证任务</span>
+      <el-carousel-item>
+        <img src="@/assets/images/img7.png" alt="图片无法加载" style="width:100%;height:100%" class="image" @click="task">
+        <span style="position: absolute; bottom: 10px;right: 250px;font-size: 30px;font-family: 新宋体;color: rgb(84 242 161);font-weight: bold">长稳评分</span>
       </el-carousel-item>
-
-      <el-carousel-item >
+      <el-carousel-item>
         <span v-if="ac===null" style="color:#FFFFFF">该任务还没有运行得到准确率和召回率</span>
-        <div style="width: 640px;height:400px;" id="piechart" >
-
-        </div>
-
+        <div id="piechart" style="width: 640px;height:400px;" />
       </el-carousel-item>
     </el-carousel>
 
-    <div align="center"  style="font-size: 18px;">
+    <div align="center" style="font-size: 18px;">
       <div style="margin: 10px;color:rgb(255 0 0)">评分最高的10个元器件</div>
-    <el-row>
-      <el-col :span="11" v-for="(idx,index) in topten.length" :key="idx" :offset="index%2 > 0 ? 1 : 0">
-        <el-card class="bgimg" :body-style="{ padding: '0px' }" style="font-size: 20px;background-color: revert;margin-bottom: 20px;">
-
-          <div style="padding: 34px;">
-            <p>
-              <span>
-                <el-button
-                  type="text"
-                  style="font-size:20px;color: wheat;"
-                  @click="handleDetail(topten[idx-1].componentId)"
-                >{{ topten[idx-1].componentName}} </el-button>
-              </span>
-            </p>
-            <p>
-              <div class="block">
+      <el-row>
+        <el-col v-for="(idx,index) in topten.length" :key="idx" :span="11" :offset="index%2 > 0 ? 1 : 0">
+          <el-card class="bgimg" :body-style="{ padding: '0px' }" style="font-size: 20px;background-color: revert;margin-bottom: 20px;">
+
+            <div style="padding: 34px;">
+              <p>
+                <span>
+                  <el-button
+                    type="text"
+                    style="font-size:20px;color: wheat;"
+                    @click="handleDetail(topten[idx-1].componentId)"
+                  >{{ topten[idx-1].componentName }} </el-button>
+                </span>
+              </p>
+              <p/></p><div class="block">
                 <span style="font-size: 14px;color: wheat;"> 评分：</span>
                 <el-rate
                   v-model="topten[idx-1].score"
                   disabled
                   show-score
                   text-color="#ff9900"
-                >
-                </el-rate>
+                />
               </div>
-
-          </div>
-        </el-card>
-      </el-col>
-    </el-row>
+            </div>
+          </el-card>
+        </el-col>
+      </el-row>
 
     </div>
-    <el-dialog v-loading="loading" :title="title" :visible.sync="open" width="800px" append-to-body @close="closedialog" >
+    <el-dialog v-loading="loading" :title="title" :visible.sync="open" width="800px" append-to-body @close="closedialog">
 
-      <el-form style="border:1px solid #C0C0C0;padding: 5px;margin: auto" ref="form" :model="form" label-width="200px">
+      <el-form ref="form" style="border:1px solid #C0C0C0;padding: 5px;margin: auto" :model="form" label-width="200px">
         <h2><b>元器件基本信息</b></h2>
         <el-form-item label="元器件名称" prop="componentName">
-          <el-input v-model="form.componentName" readonly='true' />
+          <el-input v-model="form.componentName" readonly="true" />
         </el-form-item>
         <el-form-item label="生产厂家" prop="manufacturer">
-          <el-input v-model="form.manufacturer" readonly='true' />
+          <el-input v-model="form.manufacturer" readonly="true" />
         </el-form-item>
         <el-form-item label="型号规格" prop="componentModel">
-          <el-input v-model="form.componentModel" readonly='true' />
+          <el-input v-model="form.componentModel" readonly="true" />
         </el-form-item>
         <el-form-item label="国产替代型号" prop="replaceDomesticModel">
-          <el-input v-model="form.replaceDomesticModel" readonly='true' />
+          <el-input v-model="form.replaceDomesticModel" readonly="true" />
         </el-form-item>
         <el-form-item label="质量等级" prop="qualityGrade">
-          <el-input v-model="form.qualityGrade" readonly='true' />
+          <el-input v-model="form.qualityGrade" readonly="true" />
         </el-form-item>
         <el-form-item label="供货周期" prop="deliveryCycle">
-          <el-input v-model="form.deliveryCycle" readonly='true' />
+          <el-input v-model="form.deliveryCycle" readonly="true" />
         </el-form-item>
         <el-form-item label="供货量(个/年）" prop="supplyQuantity">
-          <el-input v-model="form.supplyQuantity" readonly='true' />
+          <el-input v-model="form.supplyQuantity" readonly="true" />
         </el-form-item>
         <el-form-item label="价格" prop="unitPrice">
-          <el-input v-model="form.unitPrice" readonly='true' />
+          <el-input v-model="form.unitPrice" readonly="true" />
         </el-form-item>
         <el-form-item label="ZZKK等级" prop="zzkkLevel">
-          <el-input v-model="form.zzkkLevel" readonly='true' />
+          <el-input v-model="form.zzkkLevel" readonly="true" />
         </el-form-item>
         <el-form-item label="是否在优选目录内" prop="inPreference">
-          <el-input v-model="form.inPreference" readonly='true' />
+          <el-input v-model="form.inPreference" readonly="true" />
         </el-form-item>
         <el-form-item label="停产断档日期" prop="shutdownDate">
-          <el-date-picker clearable
-                          v-model="form.shutdownDate"
-                          type="date"
-                          value-format="yyyy-MM-dd"
-                          readonly='true'>
-          </el-date-picker>
+          <el-date-picker
+            v-model="form.shutdownDate"
+            clearable
+            type="date"
+            value-format="yyyy-MM-dd"
+            readonly="true"
+          />
         </el-form-item>
         <el-form-item label="封装形式" prop="encapsulationMode">
-          <el-input v-model="form.encapsulationMode" readonly='true' />
+          <el-input v-model="form.encapsulationMode" readonly="true" />
         </el-form-item>
-        <el-form-item label="最大正向电流IFM" prop="paramIfm" v-if="form.paramIfm!==null && form.paramIfm!==''">
-          <el-input v-model="form.paramIfm" readonly='true' />
+        <el-form-item v-if="form.paramIfm!==null && form.paramIfm!==''" label="最大正向电流IFM" prop="paramIfm">
+          <el-input v-model="form.paramIfm" readonly="true" />
         </el-form-item>
-        <el-form-item label="最大反向工作电压VRRM" prop="paramVrrm" v-if="form.paramVrrm!==null && form.paramVrrm!==''">
-          <el-input v-model="form.paramVrrm" readonly='true' />
+        <el-form-item v-if="form.paramVrrm!==null && form.paramVrrm!==''" label="最大反向工作电压VRRM" prop="paramVrrm">
+          <el-input v-model="form.paramVrrm" readonly="true" />
         </el-form-item>
-        <el-form-item label="最大浪涌电流IFSM" prop="paramIfsm" v-if="form.paramIfsm!==null && form.paramIfsm!==''">
-          <el-input v-model="form.paramIfsm" readonly='true' />
+        <el-form-item v-if="form.paramIfsm!==null && form.paramIfsm!==''" label="最大浪涌电流IFSM" prop="paramIfsm">
+          <el-input v-model="form.paramIfsm" readonly="true" />
         </el-form-item>
-        <el-form-item label="稳压状态下的动态电阻ZZ" prop="paramZz" v-if="form.paramZz!==null && form.paramZz!==''">
-          <el-input v-model="form.paramZz" readonly='true' />
+        <el-form-item v-if="form.paramZz!==null && form.paramZz!==''" label="稳压状态下的动态电阻ZZ" prop="paramZz">
+          <el-input v-model="form.paramZz" readonly="true" />
         </el-form-item>
-        <el-form-item label="最大额定功率PCM" prop="paramPcm" v-if="form.paramPcm!==null && form.paramPcm!==''">
-          <el-input v-model="form.paramPcm" readonly='true' />
+        <el-form-item v-if="form.paramPcm!==null && form.paramPcm!==''" label="最大额定功率PCM" prop="paramPcm">
+          <el-input v-model="form.paramPcm" readonly="true" />
         </el-form-item>
-        <el-form-item label="最大集电极电流ICM" prop="paramIcm" v-if="form.paramIcm!==null && form.paramIcm!==''">
-          <el-input v-model="form.paramIcm" readonly='true' />
+        <el-form-item v-if="form.paramIcm!==null && form.paramIcm!==''" label="最大集电极电流ICM" prop="paramIcm">
+          <el-input v-model="form.paramIcm" readonly="true" />
         </el-form-item>
-        <el-form-item label="最大集电极-基极电压VCBO" prop="paramVcbo" v-if="form.paramVcbo!==null && form.paramVcbo!==''">
-          <el-input v-model="form.paramVcbo" readonly='true' />
+        <el-form-item v-if="form.paramVcbo!==null && form.paramVcbo!==''" label="最大集电极-基极电压VCBO" prop="paramVcbo">
+          <el-input v-model="form.paramVcbo" readonly="true" />
         </el-form-item>
-        <el-form-item label="集电极-发射极电压VCEO" prop="paramVceo" v-if="form.paramVceo!==null && form.paramVceo!==''">
-          <el-input v-model="form.paramVceo" readonly='true' />
+        <el-form-item v-if="form.paramVceo!==null && form.paramVceo!==''" label="集电极-发射极电压VCEO" prop="paramVceo">
+          <el-input v-model="form.paramVceo" readonly="true" />
         </el-form-item>
-        <el-form-item label="发射极-基极电压VEBO" prop="paramVebo" v-if="form.paramVebo!==null && form.paramVebo!==''">
-          <el-input v-model="form.paramVebo" readonly='true' />
+        <el-form-item v-if="form.paramVebo!==null && form.paramVebo!==''" label="发射极-基极电压VEBO" prop="paramVebo">
+          <el-input v-model="form.paramVebo" readonly="true" />
         </el-form-item>
-        <el-form-item label="漏源电压VDSS" prop="paramVdss" v-if="form.paramVdss!==null && form.paramVdss!==''">
-          <el-input v-model="form.paramVdss" readonly='true' />
+        <el-form-item v-if="form.paramVdss!==null && form.paramVdss!==''" label="漏源电压VDSS" prop="paramVdss">
+          <el-input v-model="form.paramVdss" readonly="true" />
         </el-form-item>
-        <el-form-item label="漏极直流电流ID" prop="paramId" v-if="form.paramId!==null && form.paramId!==''">
-          <el-input v-model="form.paramId" readonly='true' />
+        <el-form-item v-if="form.paramId!==null && form.paramId!==''" label="漏极直流电流ID" prop="paramId">
+          <el-input v-model="form.paramId" readonly="true" />
         </el-form-item>
-        <el-form-item label="漏-源通态电阻RDS(on)" prop="paramRdsOn" v-if="form.paramRdsOn!==null && form.paramRdsOn!==''">
-          <el-input v-model="form.paramRdsOn" readonly='true' />
+        <el-form-item v-if="form.paramRdsOn!==null && form.paramRdsOn!==''" label="漏-源通态电阻RDS(on)" prop="paramRdsOn">
+          <el-input v-model="form.paramRdsOn" readonly="true" />
         </el-form-item>
         <el-form-item label="抗静电能力" prop="antistaticCapacity">
-          <el-input v-model="form.antistaticCapacity" readonly='true' />
+          <el-input v-model="form.antistaticCapacity" readonly="true" />
         </el-form-item>
         <el-form-item label="抗辐照能力" prop="radiationResistance">
-          <el-input v-model="form.radiationResistance" readonly='true' />
+          <el-input v-model="form.radiationResistance" readonly="true" />
         </el-form-item>
         <el-form-item label="材料" prop="materials">
-          <el-input v-model="form.materials" type="textarea" readonly='true'/>
+          <el-input v-model="form.materials" type="textarea" readonly="true" />
         </el-form-item>
         <el-form-item label="工艺" prop="craft">
-          <el-input v-model="form.craft" type="textarea" readonly='true' />
+          <el-input v-model="form.craft" type="textarea" readonly="true" />
         </el-form-item>
         <el-form-item label="重量" prop="weight">
-          <el-input v-model="form.weight" readonly='true' />
+          <el-input v-model="form.weight" readonly="true" />
         </el-form-item>
         <el-form-item label="备注" prop="remark">
-          <el-input v-model="form.remark" type="textarea" readonly='true' />
+          <el-input v-model="form.remark" type="textarea" readonly="true" />
         </el-form-item>
       </el-form>
 
-
-
     </el-dialog>
 
   </div>
 </template>
 
 <script>
-import { get_top10} from "@/api/biz/evaluation";
-import { getComponent,getBycomponentId,addTime } from "@/api/biz/recommend";
-import {getLastTask} from '@/api/biz/task'
+import { get_top10 } from '@/api/biz/evaluation'
+import { getComponent, getBycomponentId, addTime } from '@/api/biz/recommend'
+import { getLastTask } from '@/api/biz/task'
 import * as echarts from 'echarts'
 
 export default {
-  name: "Index",
+  name: 'Index',
   data() {
     return {
       // 版本号
-      currentTime:0,
-      startTime:0,
-      version: "1.0.0",
+      currentTime: 0,
+      startTime: 0,
+      version: '1.0.0',
       form: {},
-      title:'',
-      topten:[],
+      title: '',
+      topten: [],
       currentDate: new Date(),
-      open:false,
-      ac:'',
-      callback:'',
-      pageviewTime:{},
-      loading:false,
+      open: false,
+      ac: '',
+      callback: '',
+      pageviewTime: {},
+      loading: false
 
-    };
+    }
   },
   created() {
-
     this.get_top_ten()
-
-
   },
   mounted() {
-
     this.myEcharts()
-
   },
   methods: {
-    task(){
-      this.$router.push('/task')
+    task() {
+      this.$router.push('/marking')
     },
     goTarget(href) {
-      window.open(href, "_blank");
+      window.open(href, '_blank')
     },
 
-    get_top_ten(){
-      get_top10().then(res=>{
-        this.topten = res.data;
+    get_top_ten() {
+      get_top10().then(res => {
+        this.topten = res.data
         console.log(this.topten)
       })
     },
-    recommend(){
+    recommend() {
       this.$router.push('/recommend')
     },
     handleDetail(id) {
-
       this.loading = true
       getComponent(id).then(response => {
-        this.form = response.data;
-        this.title = "元器件详情";
-
-      });
-      getBycomponentId(id).then(res=>{
+        this.form = response.data
+        this.title = '元器件详情'
+      })
+      getBycomponentId(id).then(res => {
         this.useInfoList = res.data
       })
-      this.open = true;
+      this.open = true
       this.startTime = Date.now()
       this.pageviewTime.componentId = id
       // this.pageviewTime.usedBy = row.applications.toString()
       this.loading = false
     },
 
-    //监听元器件详情dialog关闭
-    closedialog(){
+    // 监听元器件详情dialog关闭
+    closedialog() {
       // this.currentTime = Date.now()
       // this.pageviewTime.viewTime = this.currentTime - this.startTime
       // // this.pageviewTime.useScene = this.use_scene
@@ -246,27 +231,27 @@ export default {
       // })
       this.open = false
     },
-    myEcharts(){
-      getLastTask().then(res=>{
-        this.ac = res.data.accuracyRate;
-        this.callback = res.data.recallRate;
-        let chartDom = document.getElementById('piechart');
-        let myChart = echarts.init(chartDom);
-        let ac = 0;
-        let callback = 0;
-        if(this.ac!==null&&this.callback!==null){
+    myEcharts() {
+      getLastTask().then(res => {
+        this.ac = res.data.accuracyRate
+        this.callback = res.data.recallRate
+        const chartDom = document.getElementById('piechart')
+        const myChart = echarts.init(chartDom)
+        let ac = 0
+        let callback = 0
+        if (this.ac !== null && this.callback !== null) {
           let endidx = this.ac.indexOf('%')
 
-          ac = endidx!==-1 ? parseFloat(this.ac)/100.0 : parseFloat(this.ac);
+          ac = endidx !== -1 ? parseFloat(this.ac) / 100.0 : parseFloat(this.ac)
           endidx = this.callback.indexOf('%')
-          callback = endidx!==-1 ? parseFloat(this.callback)/100.0 : parseFloat(this.callback);
+          callback = endidx !== -1 ? parseFloat(this.callback) / 100.0 : parseFloat(this.callback)
         }
 
-        let option;
+        let option
         option = {
           title: [
             {
-              text: '任务：'+res.data.taskName,
+              text: '任务：' + res.data.taskName,
               left: 'center',
               top: '6%'
             },
@@ -282,7 +267,7 @@ export default {
               top: '75%',
               textAlign: 'center'
 
-            },
+            }
           ],
           tooltip: {
             trigger: 'item'
@@ -298,8 +283,8 @@ export default {
               radius: '50%',
               center: ['30%', '50%'],
               data: [
-                {value: (1 - ac).toFixed(4),name:'Error Rate'},
-                { value: ac.toFixed(4), name: 'Accuracy Rate' },
+                { value: (1 - ac).toFixed(4), name: 'Error Rate' },
+                { value: ac.toFixed(4), name: 'Accuracy Rate' }
 
               ],
               emphasis: {
@@ -308,7 +293,7 @@ export default {
                   shadowOffsetX: 0,
                   shadowColor: 'rgba(0, 0, 0, 0.5)'
                 }
-              },
+              }
 
             },
             {
@@ -318,8 +303,7 @@ export default {
               center: ['75%', '50%'],
               data: [
                 { value: callback.toFixed(4), name: 'Recall Rate' },
-                {value: (1 - callback).toFixed(4),name:'Other...'},
-
+                { value: (1 - callback).toFixed(4), name: 'Other...' }
 
               ],
               emphasis: {
@@ -328,25 +312,20 @@ export default {
                   shadowOffsetX: 0,
                   shadowColor: 'rgba(0, 0, 0, 0.5)'
                 }
-              },
+              }
 
             }
           ]
 
+        }
 
-        };
-
-        myChart.setOption(option);
-
-
-
+        myChart.setOption(option)
       })
-
     }
 
-  },
+  }
 
-};
+}
 </script>
 
 <style scoped lang="scss">
@@ -421,7 +400,6 @@ export default {
     }
   }
 
-
   .el-carousel__item:nth-child(2n) {
     background-color: #99a9bf;
   }
@@ -432,7 +410,5 @@ export default {
 
 }
 
-
 </style>
 
-