icve-urc 1.0.0

package/src/components/treeCompontent.vue

@@ -0,0 +1,277 @@
+<template>
+  <div class="tree">
+    <!-- <div class="input">
+      <el-input
+        v-model="queryParams.fileName"
+        @keyup.enter.native="search"
+        placeholder="请输入文件名称"
+      ></el-input>
+      <el-button
+        class="addBlue"
+        @click="search"
+        style="margin-left: 6px"
+        size="mini"
+        >搜索</el-button
+      >
+    </div> -->
+    <el-tree
+      lazy
+      :load="loadNode"
+      node-key="id"
+      :highlight-current="true"
+      draggable
+      @allow-drop="allowDrop"
+      ref="treeRef"
+      v-if="treeShow"
+      class="tree-line"
+      :indent="0"
+      :default-expanded-keys="checkDefault"
+      @node-click="handleNodeClick"
+    >
+      <span
+        slot-scope="{ node, data }"
+        style="width: 100%"
+      >
+        <span class="icon">
+          <img
+            src="../assets/img/file.png"
+            alt=""
+          />
+          <el-tooltip
+            class="item"
+            effect="light"
+            :content="data.fileName"
+            placement="bottom"
+            :open-delay="1000"
+          >
+            <span
+              style="
+                padding-left: 4px;
+                font-size: 16px;
+                overflow: hidden;
+                white-space: nowrap;
+                text-overflow: ellipsis;
+              "
+              >{{
+                data.fileName.length > 10
+                  ? data.fileName.substring(0, 10) + '...'
+                  : data.fileName
+              }}</span
+            >
+          </el-tooltip>
+        </span>
+      </span>
+    </el-tree>
+  </div>
+</template>
+
+<script>
+import { myResourceList } from '@/api/resourceManagement'
+
+export default {
+  props: {
+    userId: {
+      type: String,
+      default: '',
+    },
+    productId: {
+      type: String,
+      default: '',
+    },
+  },
+  data() {
+    return {
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10000,
+        isDir: 1,
+        parentId: 0,
+        userId: this.userId,
+        productId: this.productId,
+      },
+      treeShow: true,
+      parentId: 0,
+      checkDefault: [],
+      list: [],
+    }
+  },
+  mounted() {},
+  watch: {
+    checkDefault: function (newVal, oldVal) {
+      if (newVal) {
+        this.$nextTick(() => {
+          document.querySelector('.el-tree-node__content').click()
+        })
+      }
+    },
+  },
+  methods: {
+    allowDrop(draggingNode, dropNode, type) {
+      if (draggingNode.level == '1') {
+        return false
+      } else {
+        if (draggingNode.level == dropNode.level) {
+          return type === 'prev' || type === 'next'
+        } else if (draggingNode.level == dropNode.level + 1) {
+          return type === 'inner'
+        } else {
+          return false
+        }
+      }
+    },
+    loadNode(node, resolve) {
+      //如果展开第一级节点，从后台加载一级节点列表
+      if (node.level == 0) {
+        this.loadfirstnode(resolve)
+      }
+      //如果展开其他级节点，动态从后台加载下一级节点列表
+      if (node.level >= 1) {
+        this.loadchildnode(node, resolve)
+      }
+    },
+    //加载第一级节点
+    async loadfirstnode(resolve) {
+      let params = this.queryParams
+      const res = await myResourceList(params)
+      if (res.rows.length == 0) {
+      } else {
+        this.list = res.rows
+        this.$emit('handleNodeClick', res.rows[0])
+        this.checkDefault.push(res.rows[0].id)
+        this.$emit('isExist', res.rows.length)
+        return resolve(res.rows)
+      }
+    },
+    search() {
+      this.treeShow = false
+      if (this.queryParams.fileName) {
+        this.queryParams.parentId = ''
+      } else {
+        this.queryParams.parentId = 0
+      }
+      this.$nextTick(() => {
+        this.treeShow = true
+      })
+    },
+    //加载节点的子节点集合
+    async loadchildnode(node, resolve) {
+      // console.log("超过二级的", node, node.level);
+      let params = {
+        parentId: node.key,
+        pageNum: 1,
+        pageSize: 10000,
+        isDir: 1,
+        userId: this.queryParams.userId,
+        productId: this.queryParams.productId,
+      }
+      const res = await myResourceList(params)
+
+      return resolve(res.rows)
+    },
+    // 节点事件
+    handleNodeClick(data) {
+      this.$emit('handleNodeClick', data)
+    },
+  },
+}
+</script>
+
+<style scoped lang="scss">
+.addBlue {
+  background: #ebf1fe;
+  // border: 1px solid #145FDF;
+  // border-color: #145FDF;
+  color: #145fdf;
+}
+
+.icon-font1 {
+  width: 31px;
+  height: 30px;
+}
+
+.icon {
+  display: flex;
+  align-items: center;
+}
+
+.input {
+  display: flex;
+  margin-bottom: 10px;
+}
+
+.button {
+  padding-right: 10px;
+  flex: 1;
+  display: flex;
+  justify-content: end;
+}
+
+::v-deep .el-tree-node__content {
+  margin-bottom: 6px;
+}
+</style>
+<style scoped lang="scss">
+.tree {
+  min-width: 300px;
+}
+
+// 树样式
+.tree-line {
+  ::v-deep .el-tree-node {
+    position: relative;
+    padding-left: 16px; // 缩进量
+  }
+
+  ::v-deep .el-tree-node__children {
+    padding-left: 16px; // 缩进量
+  }
+
+  // 竖线
+  ::v-deep .el-tree-node::before {
+    content: '';
+    height: 100%;
+    width: 1px;
+    position: absolute;
+    left: -3px;
+    top: -26px;
+    border-width: 1px;
+    border-left: 1px dashed #ccc;
+  }
+
+  // 当前层最后⼀个节点的竖线⾼度固定
+  ::v-deep .el-tree-node:last-child::before {
+    height: 38px; // 可以⾃⼰调节到合适数值
+  }
+
+  // 横线
+  ::v-deep .el-tree-node::after {
+    content: '';
+    width: 24px;
+    height: 20px;
+    position: absolute;
+    left: -3px;
+    top: 12px;
+    border-width: 1px;
+    border-top: 1px dashed #ccc;
+  }
+
+  // 去掉最顶层的虚线，放最下⾯样式才不会被上⾯的覆盖了
+  & > ::v-deep .el-tree-node::after {
+    border-top: none;
+  }
+
+  & > ::v-deep .el-tree-node::before {
+    border-left: none;
+  }
+
+  // 展开关闭的icon
+  ::v-deep .el-tree-node__expand-icon {
+    font-size: 16px;
+    // 叶⼦节点（⽆⼦节点）
+    ::v-deep &.is-leaf {
+      color: transparent;
+      // display: none; // 也可以去掉
+    }
+  }
+}
+</style>

package/src/main.js

@@ -0,0 +1,26 @@
+import "@/assets/styles/index.scss"; // global css
+import "@/assets/styles/ruoyi.scss"; // ruoyi css
+import Element from "element-ui";
+import Cookies from "js-cookie";
+import Vue from "vue";
+import VueLazyload from "vue-lazyload";
+import App from "./App.vue";
+import "./assets/styles/element-variables.scss";
+import router from "./router";
+// 分页组件
+import Pagination from "@/components/Pagination";
+
+Vue.component("Pagination", Pagination);
+Vue.use(Element, {
+  size: Cookies.get("size") || "medium", // set element-ui default size
+});
+Vue.config.productionTip = false;
+Vue.use(VueLazyload, {
+  loading: require("./assets/img/loading.gif"),
+  error: require("./assets/img/error.png"),
+});
+
+new Vue({
+  router,
+  render: (h) => h(App),
+}).$mount("#app");

package/src/router/index.js

@@ -0,0 +1,22 @@
+import Vue from 'vue'
+import Router from 'vue-router'
+
+Vue.use(Router)
+
+// 公共路由
+export const constantRoutes = []
+
+// 动态路由，基于用户权限动态去加载
+export const dynamicRoutes = []
+
+// 防止连续点击多次路由报错
+let routerPush = Router.prototype.push
+Router.prototype.push = function push(location) {
+  return routerPush.call(this, location).catch((err) => err)
+}
+
+export default new Router({
+  mode: 'history', // 去掉url中的#
+  scrollBehavior: () => ({ y: 0 }),
+  routes: constantRoutes,
+})

package/src/utils/auth.js

@@ -0,0 +1,15 @@
+import Cookies from 'js-cookie'
+
+const TokenKey = 'token'
+
+export function getToken() {
+  return Cookies.get(TokenKey)
+}
+
+export function setToken(token) {
+  return Cookies.set(TokenKey, token)
+}
+
+export function removeToken() {
+  return Cookies.remove(TokenKey)
+}

package/src/utils/errorCode.js

@@ -0,0 +1,6 @@
+export default {
+  401: '认证失败，无法访问系统资源',
+  403: '当前操作没有权限',
+  404: '访问资源不存在',
+  default: '系统未知错误，请反馈给管理员',
+}

package/src/utils/request.js

@@ -0,0 +1,63 @@
+// 封装 axios 请求模块
+import errorCode from "@/utils/errorCode";
+import axios from "axios";
+import { Message, MessageBox, Notification } from "element-ui";
+// 创建一个 axios 实例对象
+const request = axios.create({
+  // axios中请求配置有baseURL选项，表示请求URL公共部分
+  baseURL: process.env.VUE_APP_BASE_API,
+  // 超时
+  timeout: 10000,
+});
+
+// 配置请求拦截器
+request.interceptors.request.use(
+  function (config) {
+    // if (getToken()) {
+    //   config.headers['Authorization'] = 'Bearer ' + getToken() // 让每个请求携带自定义token 请根据实际情况自行修改
+    // }
+    if (sessionStorage.getItem("environment") === "test") {
+      // config.url = "http://192.168.130.168:19203" + config.url;
+      config.url = "https://urc-test.icve.com.cn/stage-api" + config.url;
+    } else {
+      config.url = "https://urc.icve.com.cn/prod-api" + config.url;
+    }
+    return config;
+  },
+  function (error) {
+    // 对请求错误做些什么
+    return Promise.reject(error);
+  }
+);
+
+// 添加响应拦截器
+// 响应拦截器
+request.interceptors.response.use(
+  (res) => {
+    // 未设置状态码则默认成功状态
+    const code = res.data.code || 200;
+    // 获取错误信息
+    const msg = errorCode[code] || res.data.msg || errorCode["default"];
+    return res.data;
+  },
+  (error) => {
+    console.log("err" + error);
+    let { message } = error;
+    if (message == "Network Error") {
+      message = "后端接口连接异常";
+    } else if (message.includes("timeout")) {
+      message = "系统接口请求超时";
+    } else if (message.includes("Request failed with status code")) {
+      message = "系统接口" + message.substr(message.length - 3) + "异常";
+    }
+    Message({
+      message: message,
+      type: "error",
+      duration: 5 * 1000,
+    });
+    return Promise.reject(error);
+  }
+);
+
+// 暴露出去
+export default request;

package/src/utils/scroll-to.js

@@ -0,0 +1,58 @@
+Math.easeInOutQuad = function(t, b, c, d) {
+  t /= d / 2
+  if (t < 1) {
+    return c / 2 * t * t + b
+  }
+  t--
+  return -c / 2 * (t * (t - 2) - 1) + b
+}
+
+// requestAnimationFrame for Smart Animating http://goo.gl/sx5sts
+var requestAnimFrame = (function() {
+  return window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || function(callback) { window.setTimeout(callback, 1000 / 60) }
+})()
+
+/**
+ * Because it's so fucking difficult to detect the scrolling element, just move them all
+ * @param {number} amount
+ */
+function move(amount) {
+  document.documentElement.scrollTop = amount
+  document.body.parentNode.scrollTop = amount
+  document.body.scrollTop = amount
+}
+
+function position() {
+  return document.documentElement.scrollTop || document.body.parentNode.scrollTop || document.body.scrollTop
+}
+
+/**
+ * @param {number} to
+ * @param {number} duration
+ * @param {Function} callback
+ */
+export function scrollTo(to, duration, callback) {
+  const start = position()
+  const change = to - start
+  const increment = 20
+  let currentTime = 0
+  duration = (typeof (duration) === 'undefined') ? 500 : duration
+  var animateScroll = function() {
+    // increment the time
+    currentTime += increment
+    // find the value with the quadratic in-out easing function
+    var val = Math.easeInOutQuad(currentTime, start, change, duration)
+    // move the document.body
+    move(val)
+    // do the animation unless its over
+    if (currentTime < duration) {
+      requestAnimFrame(animateScroll)
+    } else {
+      if (callback && typeof (callback) === 'function') {
+        // the animation is done so lets callback
+        callback()
+      }
+    }
+  }
+  animateScroll()
+}