feat: 添加个人成果展示

package.json

@@ -16,7 +16,8 @@
     "dev": "cross-env NODE_ENV=development webpack-dev-server --open --hot",
     "build": "cross-env NODE_ENV=production webpack --progress --hide-modules",
     "lint": "eslint src/ --ext .js,.vue ",
-    "fix": "eslint --fix ./src --ext .js,.vue "
+    "fix": "eslint --fix ./src --ext .js,.vue ",
+    "ii": "npm install --registry https://registry.npm.taobao.org"
   },
   "dependencies": {
     "echarts": "^5.1.2",
@@ -52,6 +53,7 @@
     "url-loader": "^1.0.1",
     "vue-loader": "^13.0.5",
     "vue-template-compiler": "^2.4.4",
+    "style-loader": "^1.0.0",
     "webpack": "^3.6.0",
     "webpack-dev-server": "^2.11.5"
   },

src/App.vue

@@ -8,6 +8,7 @@
     <XrkBi
       :mobile="isMobile"
       :print="isPrint"
+      :achievements="isAchievements"
       :projectType="projectType"
     ></XrkBi>
   </div>
@@ -39,6 +40,7 @@ export default {
     return {
       isMobile: getQueryVariable('mobile') == 1,
       isPrint: getQueryVariable('print') == 1,
+      isAchievements: getQueryVariable('achievements') == 1,
       projectType: getQueryVariable('projectType') || 6
     };
   },

src/packages/bi/src/components/mobile/base-info.vue

@@ -4,7 +4,7 @@
 -->
 <template>
   <div class="bi-mobile-base-info">
-    <BiMobileTitle index="1" title="基础信息"></BiMobileTitle>
+    <BiMobileTitle index="1" title="任务基础信息"></BiMobileTitle>
     <div class="bi-mobile-base-info_content">
       <div
         class="bi-mobile-base-info_content_item"

src/packages/bi/src/components/mobile/task-content.vue

+<!--
+ * @Description: 
+ * @Date: 2021-06-16 16:52:35
+-->
+<template>
+  <div class="bi-mobile-base-info">
+    <BiMobileTitle index="2" title="任务内容信息"></BiMobileTitle>
+    <div class="bi-mobile-base-info_content">
+      <div
+        class="bi-mobile-base-info_content_item"
+        v-for="(item, index) in info"
+        :key="index"
+      >
+        <div class="bi-mobile-base-info_content_item_label">
+          {{ item.label }}
+        </div>
+        <div class="bi-mobile-base-info_content_item_value">
+          {{ item.value }}
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import BiMobileTitle from './title.vue';
+export default {
+  name: 'bi-mobile-task-content',
+  components: { BiMobileTitle },
+  data() {
+    return {
+      info: [
+        {
+          label: '项目参与人：',
+          value: '张三'
+        },
+        {
+          label: '发起方：',
+          value: '葵花医疗集团'
+        },
+        {
+          label: '服务商：',
+          value: '杭州大江工作室'
+        },
+        {
+          label: '提交日期：',
+          value: '2021-05-30'
+        },
+        {
+          label: '可供采购量：',
+          value: '100'
+        },
+        {
+          label: '本期采购量：',
+          value: '20'
+        },
+        {
+          label: '数据收集：',
+          value: '20'
+        },
+        {
+          label: '报表成时间：',
+          value: '2021-05-21 22:21:12'
+        }
+      ]
+    };
+  }
+};
+</script>
+<style lang="scss" scoped>
+.bi-mobile-base-info {
+  page-break-before: always;
+  &_content {
+    width: 9.15rem;
+    border: 0.03rem solid #e8e8e8;
+    border-radius: 0.2rem;
+    margin: 0.34rem auto 0.6rem auto;
+    padding: 0.57rem 0.32rem;
+    &_item {
+      font-size: 0.35rem;
+      color: #9d9d9d;
+      & > div {
+        display: inline-block;
+      }
+      &_value {
+        float: right;
+        color: #2d2d2d;
+      }
+      & + .bi-mobile-base-info_content_item {
+        margin-top: 0.5rem;
+      }
+    }
+  }
+}
+</style>

src/packages/bi/src/main.vue

@@ -3,10 +3,12 @@
  * @Author: jml
  * @Date: 2021-02-26 15:38:10
  * @LastEditors: Please set LastEditors
- * @LastEditTime: 2021-07-05 18:15:51
+ * @LastEditTime: 2021-07-22 14:34:33
 -->
 <template>
   <div class="xrk-components-bi bi" :class="{ 'bi-print': print }">
+    <BiPersonalAchievements v-if="achievements" />
+    <template v-else>
       <template v-if="[5, 7, 20].includes(+projectType)">
         <BiConfigurableMobile v-if="mobile"></BiConfigurableMobile>
         <BiConfigurable v-else></BiConfigurable>
@@ -15,6 +17,7 @@
         <BiZoneMobile v-if="mobile"></BiZoneMobile>
         <BiZone v-else></BiZone>
       </template>
+    </template>
   </div>
 </template>
 
@@ -24,6 +27,7 @@ import BiConfigurable from './project/20-configurable.vue';
 import BiConfigurableMobile from './project/20-configurable-mobile.vue';
 import BiZone from './project/6-zone.vue';
 import BiZoneMobile from './project/6-zone-mobile.vue';
+import BiPersonalAchievements from './personal-achievements/index.vue';
 
 export default {
   name: 'XrkBi',
@@ -34,6 +38,7 @@ export default {
     };
   },
   props: {
+    achievements: [Boolean], // 是否展示个人成果
     mobile: [Number, String, Boolean],
     print: [Number, String, Boolean],
     cantEdit: [Number, String],
@@ -71,7 +76,8 @@ export default {
     BiConfigurable,
     BiConfigurableMobile,
     BiZone,
-    BiZoneMobile
+    BiZoneMobile,
+    BiPersonalAchievements
   },
   methods: {
     setFontSize() {

src/packages/bi/src/personal-achievements/index.vue

+<!--
+ * @Description: 
+ * @Date: 2021-06-17 20:27:04
+-->
+<template>
+  <div class="bi-configurable">
+    <BiMobileBaseInfo
+      class="bi-block"
+      :class="{ mobile: isMobile }"
+    ></BiMobileBaseInfo>
+    <BiMobileTaskContent class="bi-block" :class="{ mobile: isMobile }" />
+  </div>
+</template>
+
+<script>
+import BiMobileBaseInfo from '../components/mobile/base-info.vue';
+import BiMobileTaskContent from '../components/mobile/task-content.vue';
+
+import mixin from '../mixin/index';
+
+export default {
+  name: 'bi-configurable',
+  mixins: [mixin],
+  components: {
+    // 移动端模块
+    BiMobileBaseInfo,
+    BiMobileTaskContent
+  },
+  data() {
+    return {
+      page1: 0,
+      page2: 0,
+      page3Info: [],
+      singleChoice: [],
+      baseInfo: [
+        [
+          {
+            name: '项目名称',
+            value: '在山西地区的零售药店巡店项目'
+          },
+          {
+            name: '服务商',
+            value: '北京医洋科技有限公司'
+          },
+          {
+            name: '任务月度',
+            value: '2020-03'
+          }
+        ],
+        [
+          {
+            name: '任务量',
+            value: '222'
+          },
+          {
+            name: '项目执行人数',
+            value: '2131人'
+          },
+          {
+            name: '数据收集',
+            value: '415条'
+          }
+        ],
+        [
+          {
+            name: '参与调研人数',
+            value: '213123'
+          },
+          {
+            name: '报表生成时间',
+            value: '2020-10-2'
+          }
+        ]
+      ]
+    };
+  },
+  computed: {},
+  methods: {},
+  created() {
+    window.status = 'completed';
+  }
+};
+</script>
+<style lang="scss" scoped>
+.bi-block {
+  margin-top: 8px;
+}
+</style>

webpack.config.js

@@ -5,6 +5,27 @@
  */
 var path = require('path');
 var webpack = require('webpack');
+const os = require('os');
+
+///获取本机ipV4地址
+function getIPAdress() {
+  var interfaces = os.networkInterfaces();
+  for (var devName in interfaces) {
+    var iface = interfaces[devName];
+    for (var i = 0; i < iface.length; i++) {
+      var alias = iface[i];
+      if (
+        alias.family === 'IPv4' &&
+        alias.address !== '127.0.0.1' &&
+        !alias.internal
+      ) {
+        return alias.address;
+      }
+    }
+  }
+}
+const ipv4 = getIPAdress();
+
 var entry =
   process.env.NODE_ENV === 'development'
     ? './src/main.js'
@@ -61,7 +82,7 @@ module.exports = {
     extensions: ['*', '.js', '.vue', '.json']
   },
   devServer: {
-    host: '0.0.0.0',
+    host: ipv4,
     historyApiFallback: true,
     noInfo: true,
     overlay: true,