look-ui 1.0.11 → 1.1.12

package/README.md

@@ -0,0 +1,16 @@
+# look-ui
+
+# 鹿鸣前端组件包
+
+## 如何新建组件?
+1. 在 packages 目录下新建组件文件夹, 名字为 look-xxx, 目录结构参考现有组件
+2. 在 packages/index.js 文件中引入该组件即可
+
+## 如何打包成组件库?
+1. 在终端执行 `npm run lib` 命令即可
+
+## 如何发布到 npm ?
+1. 修改 package.json 中的 version 版本号
+2. 修改 npm 源为 npm 官方源, 否则在第3步会报错, 在终端执行 `npm config set registry https://registry.npmjs.org/`
+3. 执行 `npm login` , 登录 npm 账号
+4. 执行 `npm publish` 发布到 npm 官方源

package/jsconfig.json

@@ -0,0 +1,19 @@
+{
+  "compilerOptions": {
+    "target": "es5",
+    "module": "esnext",
+    "baseUrl": "./",
+    "moduleResolution": "node",
+    "paths": {
+      "@/*": [
+        "src/*"
+      ]
+    },
+    "lib": [
+      "esnext",
+      "dom",
+      "dom.iterable",
+      "scripthost"
+    ]
+  }
+}

package/package.json

@@ -1,11 +1,28 @@
 {
   "name": "look-ui",
-  "version": "1.0.11",
+  "version": "1.1.12",
   "description": "a ui library which is based on element-ui",
-  "main": "src/index.js",
+  "main": "./dist/look-ui.common.js",
   "scripts": {
+    "serve": "vue-cli-service serve",
+    "build": "vue-cli-service build",
+    "lib": "vue-cli-service build --target lib --name look-ui --dest dist packages/index.js",
     "test": "echo \"Error: no test specified\" && exit 1"
   },
+  "dependencies": {
+    "axios": "^1.5.1",
+    "core-js": "^3.8.3",
+    "element-ui": "^2.15.14",
+    "qs": "^6.11.2",
+    "sass": "^1.63.6",
+    "sass-loader": "^13.3.2",
+    "vue": "^2.6.14"
+  },
+  "devDependencies": {
+    "@vue/cli-plugin-babel": "~5.0.0",
+    "@vue/cli-service": "~5.0.0",
+    "vue-template-compiler": "^2.6.14"
+  },
   "repository": {
     "type": "git",
     "url": "https://github.com/cyan0714/look-ui"

package/src/App.vue

@@ -0,0 +1,197 @@
+<template>
+  <div class="app">
+    <look-dulplicate-checking
+      :loadingCheckResultList="loadingCheckResultList"
+      :noDealSimilarList="noDealSimilarList"
+      :noDealDissimilarList="noDealDissimilarList"
+      :hadDealSimilarList="hadDealSimilarList"
+      :hadDealDissimilarList="hadDealDissimilarList"
+      :checkingResultList="checkingResultList"
+      @mission-click="handleMissionClick"
+      @toggle-source="toggleSource"
+      @detail-click="handleDetailClick"
+      @subscription-click="handleSubscribe"
+      @merging-click="handleMerge"
+      @insertion-click="handleInsert"
+      @onClickNoDealSimilar="onClickNoDealSimilar" />
+  </div>
+</template>
+
+<script>
+import { searchRepeated } from '../utils/api.js';
+export default {
+  data() {
+    return {
+      loadingCheckResultList: false,
+      allCheckingResultList: [],
+      // 未处理任务-存在相似任务列表
+      noDealSimilarList: [
+        {
+          taskId: '1',
+          name: '三亚市第一艘海洋休闲渔船',
+          checked: false,
+          tenantId: '4602000038',
+          checkResultListLength: 0,
+        },
+        {
+          taskId: '2',
+          name: '事项工作内容',
+          checked: false,
+          tenantId: '4602000038',
+          checkResultListLength: 0,
+        },
+      ],
+      // 未处理任务-不存在相似任务列表
+      noDealDissimilarList: [
+        {
+          taskId: '1',
+          name: '三亚市第一艘海洋休闲渔船',
+          checked: false,
+          tenantId: '4602000038',
+          checkResultListLength: 0,
+        },
+        {
+          taskId: '2',
+          name: '事项工作内容',
+          checked: false,
+          tenantId: '4602000038',
+          checkResultListLength: 0,
+        },
+      ],
+      // 已处理任务-存在相似任务列表
+      hadDealSimilarList: [
+        {
+          title:
+            '春风验荡。历经百年沧桑的南非比勒陀利亚总统府，习近平主席同拉马福萨总统并肩而立，俯瞰欣欣向荣的城。',
+          checked: false,
+          matchingResultCount: 8,
+          checkResultList: [
+            { name: '省政府督查', count: 3 },
+            { name: '省委督查', count: 3 },
+            { name: '深改办(自贸办)', count: 2 },
+          ],
+          status: 3,
+          relation:
+            '《习近平主席出席金砖国家领导人第十五次会晤并对南非进行国事访问。立足南非和金砖，放眼非洲和世 界。》',
+        },
+        {
+          title:
+            '春风验荡。历经百年沧桑的南非比勒陀利亚总统府，习近平主席同拉马福萨总统并肩而立，俯瞰欣欣向荣的城。',
+          checked: false,
+          matchingResultCount: 8,
+          checkResultList: [
+            { name: '省政府督查', count: 3 },
+            { name: '省委督查', count: 3 },
+            { name: '深改办(自贸办)', count: 2 },
+          ],
+          status: 3,
+          relation:
+            '《习近平主席出席金砖国家领导人第十五次会晤并对南非进行国事访问。立足南非和金砖，放眼非洲和世 界。》',
+        },
+      ],
+      // 已处理任务-不存在相似任务列表
+      hadDealDissimilarList: [
+        {
+          title:
+            '春风验荡。历经百年沧桑的南非比勒陀利亚总统府，习近平主席同拉马福萨总统并肩而立，俯瞰欣欣向荣的城。',
+          checked: false,
+          status: 3,
+          relation:
+            '《习近平主席出席金砖国家领导人第十五次会晤并对南非进行国事访问。立足南非和金砖，放眼非洲和世 界。》',
+        },
+        {
+          title:
+            '春风验荡。历经百年沧桑的南非比勒陀利亚总统府，习近平主席同拉马福萨总统并肩而立，俯瞰欣欣向荣的城。',
+          checked: false,
+          status: 3,
+          relation:
+            '《习近平主席出席金砖国家领导人第十五次会晤并对南非进行国事访问。立足南非和金砖，放眼非洲和世 界。》',
+        },
+        {
+          title:
+            '春风验荡。历经百年沧桑的南非比勒陀利亚总统府，习近平主席同拉马福萨总统并肩而立，俯瞰欣欣向荣的城。',
+          checked: false,
+          status: 3,
+          relation:
+            '《习近平主席出席金砖国家领导人第十五次会晤并对南非进行国事访问。立足南非和金砖，放眼非洲和世 界。》',
+        },
+      ],
+      checkingResultList: [],
+    };
+  },
+  created() {
+    searchRepeated(this.paramsData).then(res => {
+      this.allCheckingResultList = res.data.data;
+      this.allCheckingResultList.forEach(item => {
+        this.noDealSimilarList.forEach(iten => {
+          if (item.keyId == iten.taskId) {
+            iten.checkResultListLength = item.size;
+          }
+        });
+      });
+      this.getCurrMissionCheckingResultList(0);
+    });
+  },
+  computed: {
+    paramsData() {
+      return {
+        from: 0,
+        jsonStr: JSON.stringify(this.noDealSimilarList),
+        keyId: 'taskId',
+        modelIndex: 'common_task',
+        modelType: 'task',
+        names: 'name',
+        size: 10000,
+      }
+    }
+  },
+  methods: {
+    fetchCheckingResultList(index) {
+      this.loadingCheckResultList = true
+      searchRepeated(this.paramsData).then(res => {
+        this.allCheckingResultList = res.data.data;
+        this.getCurrMissionCheckingResultList(index)
+      })
+    },
+    handleDetailClick() {
+
+    },
+    onClickNoDealSimilar(index) {
+      this.getCurrMissionCheckingResultList(index)
+    },
+    getCurrMissionCheckingResultList(index) {
+      this.loadingCheckResultList = true
+      setTimeout(() => {
+        const currentMissionKeyId = this.noDealSimilarList[index].taskId;
+        const resObj = this.allCheckingResultList.find(item => item.keyId == currentMissionKeyId) || {};
+        this.checkingResultList = resObj.hitRes || [];
+        this.loadingCheckResultList = false;
+      }, 500)
+    },
+    handleMissionClick(row) {
+      console.log('row', row);
+    },
+    toggleSource(val, index) {
+      this.paramsData.names = val.toString()
+      this.fetchCheckingResultList(index)
+    },
+    // 关注
+    handleSubscribe(row) {
+      console.log('row', row);
+    },
+    // 归并
+    handleMerge(row) {
+      console.log('row', row);
+    },
+    // 插入
+    handleInsert(row) {
+      console.log('row', row);
+    },
+  },
+};
+</script>
+<style>
+.app {
+  height: 100%;
+}
+</style>

package/src/main.js

@@ -0,0 +1,14 @@
+import Vue from 'vue';
+import App from './App.vue';
+import ElementUI from 'element-ui';
+import 'element-ui/lib/theme-chalk/index.css';
+import LookUI from '../packages/index.js';
+import '../style/index.scss';
+import './normalize.css'
+
+Vue.config.productionTip = false;
+Vue.use(ElementUI);
+Vue.use(LookUI);
+new Vue({
+  render: h => h(App),
+}).$mount('#app');

package/src/normalize.css

@@ -0,0 +1,9 @@
+html,body {
+  margin: 0;
+  padding: 0;
+}
+
+html,body {
+  width: 100%;
+  height: 100%;
+}

package/utils/api.js

@@ -0,0 +1,13 @@
+import request from './request';
+import Qs from 'qs';
+
+export const searchRepeated = function (data) {
+  return request({
+    url: `/api/searchRepeated/batchSearch`,
+    method: 'post',
+    headers: {
+      'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8',
+    },
+    data: Qs.stringify(data),
+  });
+};

package/utils/request.js

@@ -0,0 +1,26 @@
+import axios from 'axios';
+
+const service = axios.create({
+  timeout: 5 * 60000,
+});
+
+service.interceptors.request.use(
+  config => {
+    return config;
+  },
+  error => {
+    console.log(error);
+    Promise.reject(error);
+  }
+);
+
+service.interceptors.response.use(
+  res => {
+    return res
+  },
+  error => {
+    return Promise.reject(error);
+  }
+);
+
+export default service;

package/index.scss

@@ -1,43 +0,0 @@
-// base
-@import './src/css/button/index.scss';
-
-// data
-@import './src/css/table/index.scss';
-@import './src/css/pagination/index.scss';
-
-// form
-@import './src/css/radio/index.scss';
-@import './src/css/checkbox/index.scss';
-@import './src/css/input/index.scss';
-@import './src/css/input-number/index.scss';
-@import './src/css/select/index.scss';
-@import './src/css/cascader/index.scss';
-@import './src/css/switch/index.scss';
-@import './src/css/slider/index.scss';
-@import './src/css/picker/index.scss';
-@import './src/css/time-picker/index.scss';
-@import './src/css/date-picker/index.scss';
-@import './src/css/upload/index.scss';
-@import './src/css/transfer/index.scss';
-@import './src/css/form/index.scss';
-
-// navigation
-@import './src/css/bread-crumb/index.scss';
-@import './src/css/dropdown/index.scss';
-@import './src/css/nav-menu/index.scss';
-@import './src/css/page-header/index.scss';
-@import './src/css/tabs/index.scss';
-@import './src/css/steps/index.scss';
-
-// notification
-@import './src/css/alert/index.scss';
-@import './src/css/loading/index.scss';
-@import './src/css/notification/index.scss';
-@import './src/css/message-box/index.scss';
-
-// others
-@import './src/css/dialog/index.scss';
-@import './src/css/popover/index.scss';
-@import './src/css/card/index.scss';
-@import './src/css/calendar/index.scss';
-@import './src/css/descriptions/index.scss';

package/src/components/look-empty.vue

@@ -1,30 +0,0 @@
-<template>
-  <div class="look-empty">
-    <img src="../imgs/empty.png" alt="">
-  </div>
-</template>
-
-<script>
-export default {
-  name: 'look-empty',
-  components: {},
-  data() {
-    return {}
-  },
-  props: {},
-  computed: {},
-  created() {},
-  mounted() {},
-  methods: {}
-}
-</script>
-
-<style scoped lang="scss">
-.look-empty {
-  display: flex;
-  width: 100%;
-  height: 100%;
-  justify-content: center;
-  align-items: center;
-}
-</style>

package/src/components/tab-scroll.vue

@@ -1,221 +0,0 @@
-<template>
-  <div class="cycle-list">
-    <i class="left-arrow el-icon-arrow-left" @click="handleScrollLeft"></i>
-    <div class="scroll-container">
-      <div class="scroll-wrapper" ref="scrollWrapperRef">
-        <div class="scroll-item" v-for="(item, index) in cycleList" :key="index" @click="handleCycleItemClick(item, index)"
-          :class="{ active: currentIndex === index }">
-          <span>{{ item.name }}</span>
-          <span>{{ item.endTime }}</span>
-        </div>
-      </div>
-    </div>
-    <i class="right-arrow el-icon-arrow-right" @click="handleScrollRight"></i>
-    <div class="show-all-container">
-      <span class="show-all" @click="handleShowAllItems" ref="showAllRef">
-        查看全部
-      </span>
-      <div class="sa-items" v-show="isShowAllItems" ref="saItemsRef">
-        <h4 style="font-weight: 400; margin: 20px 30px; font-size: 16px">汇报阶段</h4>
-        <div class="sa-item-container">
-          <div v-for="(item, index) in cycleList" :key="index" class="sa-item" @click="handleAllCycleItemClick(item, index)">
-            <span>{{ item.name }}</span>
-            <span>{{ item.endTime }}</span>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script>
-export default {
-  data() {
-    return {
-      currentIndex: 0,
-      isShowAllItems: false,
-      cycleList: [
-        {
-          name: '第一阶段',
-          endTime: '2023-01-06 23:59'
-        },
-        {
-          name: '第二阶段',
-          endTime: '2023-01-06 23:59'
-        },
-        {
-          name: '第三阶段',
-          endTime: '2023-01-06 23:59'
-        },
-        {
-          name: '第四阶段',
-          endTime: '2023-01-06 23:59'
-        },
-        {
-          name: '第五阶段',
-          endTime: '2023-01-06 23:59'
-        },
-        {
-          name: '第六阶段',
-          endTime: '2023-01-06 23:59'
-        },
-        {
-          name: '第七阶段',
-          endTime: '2023-01-06 23:59'
-        },
-        {
-          name: '第八阶段',
-          endTime: '2023-01-06 23:59'
-        },
-      ],
-    }
-  },
-  computed: {
-    maxPage() {
-      return Math.ceil(this.cycleList.length / 5)
-    },
-  },
-  mounted() {
-    document.body.addEventListener('click', this.handleBodyClick);
-  },
-  methods: {
-    handleBodyClick(ev) {
-      if (!ev.composedPath().includes(this.$refs.saItemsRef) && !ev.composedPath().includes(this.$refs.showAllRef)) {
-        this.isShowAllItems = false;
-      }
-    },
-    handleAllCycleItemClick(item, index) {
-      this.isShowAllItems = false;
-    },
-    handleCycleItemClick(item, index) {
-      this.currentIndex = index
-    },
-    handleShowAllItems() {
-      this.isShowAllItems = !this.isShowAllItems
-    },
-    handleScrollLeft() {
-      if (this.currentPage === 1) return;
-      console.log('hhh');
-      // console.log(JSON.parse(JSON.stringify('hhhh')))
-      this.$refs.scrollWrapperRef.style.left = Number.parseInt(this.$refs.scrollWrapperRef.style.left) + this.ONEGROUPWIDTH + 'px'
-      this.currentPage--
-    },
-    handleScrollRight() {
-      if (this.currentPage === this.maxPage) return
-      this.$refs.scrollWrapperRef.style.left = "-" + this.currentPage * this.ONEGROUPWIDTH + 'px'
-      this.currentPage++;
-    },
-  }
-}
-</script>
-
-<style scoped lang="scss">
-.cycle-list {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  height: 70px;
-  border: 1px solid #dcdfe6;
-
-  .left-arrow,
-  .right-arrow,
-  .show-all {
-    position: relative;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    width: 40px;
-    height: 100%;
-    cursor: pointer;
-    z-index: 2;
-    text-align: center;
-    color: $--color-primary;
-  }
-
-  .left-arrow {
-    border-right: 1px solid #dcdfe6;
-    font-size: 24px;
-  }
-
-  .right-arrow {
-    font-size: 24px;
-  }
-
-  .right-arrow,
-  .show-all {
-    border-left: 1px solid #dcdfe6;
-  }
-
-  .show-all-container {
-    position: relative;
-    width: 40px;
-    height: 100%;
-
-    .sa-items {
-      position: absolute;
-      top: 69px;
-      right: 0;
-      width: 1120px;
-      background-color: #fff;
-      border-radius: 10px;
-      box-shadow: 0 2px 12px rgba(0, 0, 0, 0.15);
-      border: 1px solid #dcdfe6;
-      z-index: 2;
-      padding-bottom: 20px;
-
-      .sa-item-container {
-        display: flex;
-        width: 100%;
-        flex-wrap: wrap;
-
-        .sa-item {
-          display: flex;
-          flex-direction: column;
-          align-items: center;
-          width: 160px;
-          margin: 0 30px;
-          border: 1px solid #dcdfe6;
-          border-radius: 30px;
-          margin-bottom: 20px;
-          cursor: pointer;
-
-          &:hover {
-            color: $--color-primary;
-            border-color: $--color-primary;
-          }
-        }
-      }
-    }
-  }
-
-  .scroll-container {
-    overflow: auto;
-    flex: 1;
-    margin-top: 20px;
-
-    .scroll-item {
-      &.active {
-        color: $--color-primary;
-        border-bottom: 2px solid $--color-primary;
-      }
-
-      display: flex;
-      flex-direction: column;
-      flex-shrink: 0;
-      align-items: center;
-      width: 130px;
-      margin: 0 30px;
-      padding-bottom: 8px;
-      cursor: pointer;
-    }
-  }
-
-  .scroll-wrapper {
-    display: flex;
-    position: relative;
-    top: 0;
-    left: 0;
-    transition: all 1s;
-  }
-}
-</style>

package/src/css/alert/index.scss

@@ -1,66 +0,0 @@
-@import '../index.scss';
-.lookui-alert {
-  &.el-alert--success {
-    &.is-light {
-      background-color: $--green-100;
-      color: #000;
-      border: 1px solid $--green-400
-    }
-    &.is-dark {
-      background-color: $--green-900;
-    }
-  }
-  &.el-alert--info {
-    &.is-light {
-      background-color: $--themeColor-100;
-      color: #000;
-      border: 1px solid $--themeColor-400;
-    }
-    &.is-dark {
-      background-color: $--themeColor;
-    }
-  }
-  &.el-alert--warning {
-    &.is-light {
-      background-color: $--yellow-100;
-      color: #000;
-      border: 1px solid $--yellow-400;
-    }
-    &.is-dark {
-      background-color: $--orange-900;
-    }
-  }
-  &.el-alert--error {
-    &.is-light {
-      background-color: $--red-100;
-      color: #000;
-      border: 1px solid $--red-400;
-    }
-    &.is-dark {
-      background-color: $--red-900;
-    }
-  }
-  .el-icon {
-    &-success {
-      color: $--green-900;
-    }
-    &-info {
-      color: $--themeColor;
-    }
-    &-warning {
-      color: $--orange-900;
-    }
-    &-error {
-      color: $--red-900;
-    }
-  }
-  .el-alert__content {
-    .el-alert__title.is-bold {
-      font-weight: normal;
-      font-size: 14px;
-    }
-    .el-alert__description {
-      color: #000;
-    }
-  }
-}

package/src/css/bread-crumb/index.scss

@@ -1,6 +0,0 @@
-@import '../index.scss';
-.lookui-breadcrumb {
-  .el-breadcrumb__inner a:hover, .el-breadcrumb__inner.is-link:hover {
-    color: $--themeColor;
-  }
-}