simple-frame-unit 1.0.2

package/src/request/index.js

@@ -0,0 +1,85 @@
+import request from './request'
+
+/**
+ * @name requestAxios
+ * @param param
+ * @return {Promise<unknown>}
+ */
+export function requestAxios(param) {
+    // 检查是否配置request
+    return new Promise((resolve, reject) => {
+        request(param).then((res) => {
+            if (res && res.data) {
+                res.data = res.data
+            }
+            res.success = !!(res && res.code === 0);
+            if (res && res.msg) {
+                res.msg = res.msg
+            }
+            resolve(res)
+        }).catch(e => {
+            reject(e)
+        })
+    })
+}
+
+export function postAction(url, param) {
+    return requestAxios({
+        url: url,
+        method: 'post',
+        data: param
+    })
+}
+
+export function getAction(url, param) {
+    return requestAxios({
+        url: url,
+        method: 'get',
+        params: param
+    })
+}
+
+export function deleteAction(url, param) {
+    return requestAxios({
+        url: url,
+        method: 'delete',
+        params: param,
+    })
+}
+
+export function putAction(url, param) {
+    return requestAxios({
+        url: url,
+        method: 'put',
+        data: param,
+    })
+}
+
+export function uploadAction(url, param) {
+    return requestAxios({
+        url: url,
+        data: param,
+        method: 'post',
+        headers: {
+            'Content-Type': 'multipart/form-data',
+        }
+    })
+}
+
+export function downFilePost(url, parameter) {
+    return requestAxios({
+        url: url,
+        data: parameter,
+        method: 'post',
+        responseType: 'blob'
+    })
+}
+
+export default {
+    requestAxios,
+    postAction,
+    getAction,
+    deleteAction,
+    putAction,
+    uploadAction,
+}

package/src/request/request.js

@@ -0,0 +1,147 @@
+import axios                   from 'axios'
+import {Message, Notification} from 'element-ui'
+import router from '../router'
+const errorCode = {
+    '401': '账号未登录',
+    '403': '当前操作没有权限',
+    '404': '访问资源不存在',
+    'default': '系统未知错误，请反馈给管理员'
+}
+console.log("--------------", process.env)
+
+// 获取token
+const getAccessToken = () => {
+    let token = window.localStorage.getItem('FRAME_VUE_TOKEN')
+    return token ? token : undefined
+}
+
+// 需要忽略的提示。忽略后，自动 Promise.reject('error')
+const ignoreMsgs = [
+    "无效的刷新令牌", // 刷新令牌被删除时，不用提示
+    "刷新令牌已过期" // 使用刷新令牌，刷新获取新的访问令牌时，结果因为过期失败，此时需要忽略。否则，会导致继续 401，无法跳转到登出界面
+]
+
+// 是否显示重新登录
+export const isRelogin = {show: false};
+
+export function getBaseHeader() {
+    return {
+        'Authorization': "Bearer " + getAccessToken(),
+    }
+}
+
+axios.defaults.headers['Content-Type'] = 'application/json;charset=utf-8'
+
+// 创建axios实例
+const service = axios.create({
+    // axios中请求配置有baseURL选项，表示请求URL公共部分
+    baseURL: process.env.VUE_APP_BASE_API + '/admin-api/', // 此处的 /admin-api/ 地址，原因是后端的基础路径为 /admin-api/
+    // 超时
+    timeout: 60000,
+    // 禁用 Cookie 等信息
+    withCredentials: false,
+})
+
+// request拦截器
+service.interceptors.request.use(config => {
+    // 是否需要设置 token
+    const isToken = (config.headers || {}).isToken === false
+    if (getAccessToken() && !isToken) {
+        config.headers['Authorization'] = getBaseHeader().Authorization // 让每个请求携带自定义token 请根据实际情况自行修改
+    }
+
+    // get请求映射params参数
+    if (config.method === 'get' && config.params) {
+        let url = config.url + '?';
+        for (const propName of Object.keys(config.params)) {
+            const value = config.params[propName];
+            const part = encodeURIComponent(propName) + '='
+            if (value !== null && typeof (value) !== "undefined") {
+                if (typeof value === 'object') {
+                    for (const key of Object.keys(value)) {
+                        let params = propName + '[' + key + ']';
+                        const subPart = encodeURIComponent(params) + '='
+                        url += subPart + encodeURIComponent(value[key]) + "&";
+                    }
+                } else {
+                    url += part + encodeURIComponent(value) + "&";
+                }
+            }
+        }
+        url = url.slice(0, -1);
+        config.params = {};
+        config.url = url;
+    }
+    return config
+}, error => {
+    console.log(error)
+    Promise.reject(error)
+})
+
+// 响应拦截器
+service.interceptors.response.use(async res => {
+        // 未设置状态码则默认成功状态
+        const code = res.data.code || 200;
+        // 获取错误信息
+        const msg = res.data.msg || errorCode[code] || errorCode['default']
+
+        if(msg === errorCode[401]){
+            router.push({path: "/login"})
+            return Promise.reject(msg)
+        }
+
+        if (ignoreMsgs.indexOf(msg) !== -1) { // 如果是忽略的错误码，直接返回 msg 异常
+            return Promise.reject(msg)
+        } else if (code === 401) {
+            Message({
+                message: msg,
+                type: 'error'
+            })
+            return Promise.reject(new Error(msg))
+        } else if (code === 500) {
+            Message({
+                message: msg,
+                type: 'error'
+            })
+            return Promise.reject(new Error(msg))
+        } else if (code === 901) {
+            Message({
+                type: 'error',
+                duration: 0,
+                dangerouslyUseHTMLString: true,
+                message: '<div>演示模式，无法进行写操作</div>',
+            })
+            return Promise.reject(new Error(msg))
+        } else if (code !== 200) {
+            if (msg === ignoreMsgs[0]) { // hard coding：忽略这个提示，直接登出
+                console.log(msg)
+            } else {
+                Notification.error({
+                    title: msg
+                })
+            }
+            return Promise.reject('error')
+        } else {
+            return res.data
+        }
+    }, 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 service

package/src/router/index.js

@@ -0,0 +1,65 @@
+import Vue    from 'vue';
+import Router from 'vue-router';
+import Layout from "@/layouts";
+
+// router
+import easydata from "@/router/modules/easydata";
+import baseRouter from "@/router/modules/baseRouter";
+
+export const routes = [
+    {
+        path: "/login",
+        title: "登录",
+        hidden: true,
+        icons: "el-icon-menu",
+        component: () => import("@/views/login.vue")
+    },
+    {
+        path: '/redirect',
+        component: Layout,
+        hidden: true,
+        children: [
+            {
+                path: '/redirect/:path(.*)',
+                component: () => import('@/views/redirect')
+            }
+        ]
+    },
+    {
+        path: "",
+        redirect: 'index',
+        component: Layout,
+        children: [{
+            path: '/index',
+            icons: "el-icon-menu",
+            component: () => import('@/views/index.vue'),
+            title: '首页',
+            meta: {title: '首页', affix: true}
+        }]
+    },
+    {
+        path: "/easydata",
+        redirect: "/easydata/dataSource",
+        component: Layout,
+        icons: "el-icon-menu",
+        title: "业务组件",
+        children: easydata
+    },
+    {
+        path: "/base",
+        redirect: "/base/inputTable",
+        component: Layout,
+        icons: "el-icon-menu",
+        title: "基础组件",
+        children: baseRouter
+    }
+];
+
+Vue.use(Router)
+
+
+export default new Router({
+    mode: 'history',
+    routes: routes
+})
+

package/src/router/modules/baseRouter.js

@@ -0,0 +1,43 @@
+export default [
+    {
+        path: '/base/inputTable',
+        meta: {
+            title: '表格选择器',
+        },
+        title: '表格选择器',
+        icons: "el-icon-menu",
+        component: () => import("@/views/base/inputTable")
+    },{
+        path: '/base/EdTable',
+        meta: {
+            title: '表格',
+        },
+        title: '表格',
+        icons: "el-icon-menu",
+        component: () => import("@/views/base/EdTable")
+    },{
+        path: '/base/EdFormView',
+        meta: {
+            title: '表单',
+        },
+        title: '表单',
+        icons: "el-icon-menu",
+        component: () => import("@/views/base/EdFormView")
+    },{
+        path: '/base/BaseRichText',
+        meta: {
+            title: '富文本编辑',
+        },
+        title: '富文本编辑',
+        icons: "el-icon-menu",
+        component: () => import("@/views/base/BaseRichText")
+    },{
+        path: '/base/BaseRichPreview',
+        meta: {
+            title: '富文本预览',
+        },
+        title: '富文本预览',
+        icons: "el-icon-menu",
+        component: () => import("@/views/base/BaseRichPreview")
+    },
+]

package/src/router/modules/easydata.js

@@ -0,0 +1,49 @@
+export default [
+    {
+        path: '/easydata/dataSource',
+        meta: {
+            title: '数据源',
+        },
+        title: '数据源',
+        icons: "el-icon-menu",
+        component: () => import("@/views/easydata/dataSource")
+    },
+    {
+        path: '/easydata/dataSource/EasyDataList/:dataSourceName',
+        hidden: true,
+        meta: {
+            title: '查看数据源',
+        },
+        title: '查看数据源',
+        icons: "el-icon-menu",
+        component: () => import("@/views/easydata/dataSourceView")
+    },
+    {
+        path: '/easydata/templateInfo',
+        meta: {
+            title: '模板管理',
+        },
+        title: '模板管理',
+        icons: "el-icon-menu",
+        component: () => import("@/views/easydata/templateInfo")
+    },
+    {
+        path: '/easydata/templateDemo',
+        meta: {
+            title: '模板测试',
+        },
+        title: '模板测试',
+        icons: "el-icon-menu",
+        component: () => import("@/views/easydata/templateDemo")
+    },
+    {
+        path: '/easydata/Interface',
+        meta: {
+            title: '接口配置',
+        },
+        title: '接口配置',
+        icons: "el-icon-menu",
+        component: () => import("@/views/easydata/Interface")
+    },
+
+]

package/src/views/base/BaseRichPreview.vue

@@ -0,0 +1,23 @@
+<template>
+<ed-card title="富文本预览">
+  <ed-rich-preview :value="dataValue"></ed-rich-preview>
+</ed-card>
+</template>
+
+<script>
+export default {
+  name: "BaseRichPreview",
+  data(){
+    return {
+      dataValue:`<p><img src="http://47.108.166.206:48080/admin-api/infra/file/5/get/easydata/biz/2023-11-27/ac1a7b0fcb154ec380ec228313050373.png?t=image" alt="" data-href="" style="width: 245.00px;height: 324.26px;"/><img src="http://47.108.166.206:48080/admin-api/infra/file/5/get/easydata/biz/2023-11-27/321c55bd9d2a4d89af8518ea29bb3f6d.JPG?t=image" alt="" data-href="" style="width: 200.00px;height: 322.90px;"/></p><div data-w-e-type="video" data-w-e-is-void>
+<video poster="" controls="true" width="auto" height="auto"><source src="http://47.108.166.206:48080/admin-api/infra/file/5/get/easydata/biz/2023-11-27/f15359ecc2874b1193eb89bd67cbfebe.mp4?t=image" type="video/mp4"/></video>
+</div><p><br></p>`,
+      toolbarConfig: {}
+    }
+  },
+}
+</script>
+
+<style scoped>
+
+</style>

package/src/views/base/BaseRichText.vue

@@ -0,0 +1,28 @@
+<template>
+<ed-card title="富文本">
+  <ed-rich-text v-model="dataValue" :toolbarConfig="toolbarConfig"></ed-rich-text>
+</ed-card>
+</template>
+
+<script>
+export default {
+  name: "BaseRichText",
+  data(){
+    return {
+      dataValue:`<p><img src="http://47.108.166.206:48080/admin-api/infra/file/5/get/easydata/biz/2023-11-27/ac1a7b0fcb154ec380ec228313050373.png?t=image" alt="" data-href="" style="width: 245.00px;height: 324.26px;"/><img src="http://47.108.166.206:48080/admin-api/infra/file/5/get/easydata/biz/2023-11-27/321c55bd9d2a4d89af8518ea29bb3f6d.JPG?t=image" alt="" data-href="" style="width: 200.00px;height: 322.90px;"/></p><div data-w-e-type="video" data-w-e-is-void>
+<video poster="" controls="true" width="auto" height="auto"><source src="http://47.108.166.206:48080/admin-api/infra/file/5/get/easydata/biz/2023-11-27/f15359ecc2874b1193eb89bd67cbfebe.mp4?t=image" type="video/mp4"/></video>
+</div><p><br></p>`,
+      toolbarConfig: {}
+    }
+  },
+  watch: {
+    dataValue(n, o){
+      console.log(n)
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>

package/src/views/base/EdFormView.vue

@@ -0,0 +1,54 @@
+<template>
+  <ed-form :form-desc="formDesc" v-model="formModel"> </ed-form>
+</template>
+
+<script>
+import {DefaultUrl, getFileAccessHttpUrl} from "../../../lib/api/easyData";
+
+export default {
+  name: "EdFormView",
+  data(){
+    return {
+      formModel: {
+        upload: [],
+        text: ""
+      },
+      formDesc: [
+        {
+          label: "上传",
+          props: "upload",
+          children: {
+            tags: "ed-upload",
+            attrs: this.bindUploadProps()
+          }
+        },
+        {
+          label: "文件描述",
+          props: "text",
+          children: {
+            tags: "el-input"
+          }
+        }
+      ]
+    }
+  },
+  methods:{
+    bindUploadProps(){
+      let props = {}
+      props.headers = this.$EdFrame.BASE_HEADERS()
+      props.action = this.$EdFrame.BASE_API + '/admin-api' + DefaultUrl.uploadUrl
+      // props.beforeUpload = (file) => this.beforeUpload(file, control)
+      // props.onPreview = (v) => this.uploadHandleDownload(v, control)
+      // props.onSuccess = (res, file, fileList) => this.uploadHandleSuccess(res, file, fileList, control)
+      // props.onExceed = (v) => this.uploadHandleExceed(v, controlProps)
+      // props.onRemove = (file, fileList) => this.uploadHandleRemove(file, fileList, control.controlName)
+      // props.data = controlProps
+      return props
+    },
+  }
+}
+</script>
+
+<style scoped>
+
+</style>

package/src/views/base/EdTable.vue

@@ -0,0 +1,98 @@
+<template>
+  <div>
+<!--    <el-table-->
+<!--        ref="singleTable"-->
+<!--        :data="tableData"-->
+<!--        highlight-current-row-->
+<!--        @current-change="handleCurrentChange"-->
+<!--        style="width: 100%">-->
+<!--      <el-table-column-->
+<!--          type="index"-->
+<!--          width="50">-->
+<!--      </el-table-column>-->
+<!--      <el-table-column-->
+<!--          property="date"-->
+<!--          label="日期"-->
+<!--          width="120">-->
+<!--      </el-table-column>-->
+<!--      <el-table-column-->
+<!--          property="name"-->
+<!--          label="姓名"-->
+<!--          width="120">-->
+<!--      </el-table-column>-->
+<!--      <el-table-column-->
+<!--          property="address"-->
+<!--          label="地址">-->
+<!--      </el-table-column>-->
+<!--    </el-table>-->
+
+    <ed-table ref="edtable" :data="tableData" :column-type="columnType" :columns="tableColumns" :loading.sync="loading" @row-click="handlerRowClick"
+              @selection-change="handleSelectionChange" :pagination="pagination"></ed-table>
+    <div style="margin-top: 20px">
+      <el-button @click="setCurrent(tableData[1])">选中第二行</el-button>
+      <el-button @click="setCurrent()">取消选择</el-button>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      loading: false,
+      columnType: "radio",
+      tableColumns:[
+        {
+          prop: "date",
+          label: "日期"
+        },
+        {
+          prop: "name",
+          label: "姓名"
+        },
+        {
+          prop: "address",
+          label: "地址"
+        }
+      ],
+      tableData: [{
+        date: '2016-05-02',
+        name: '王小虎',
+        address: '上海市普陀区金沙江路 1518 弄'
+      }, {
+        date: '2016-05-04',
+        name: '王小虎',
+        address: '上海市普陀区金沙江路 1517 弄'
+      }, {
+        date: '2016-05-01',
+        name: '王小虎',
+        address: '上海市普陀区金沙江路 1519 弄'
+      }, {
+        date: '2016-05-03',
+        name: '王小虎',
+        address: '上海市普陀区金沙江路 1516 弄'
+      }],
+      currentRow: null,
+      pagination: {
+        current: 1,
+        pageSize: 10,
+        total: 0,
+        pageSizes: [10, 20, 30]
+      }
+    }
+  },
+mounted() {
+  // this.setCurrent(this.tableData[1])
+},
+  methods: {
+    setCurrent(row) {
+      this.$refs.edtable.setCurrentRow(row);
+    },
+    handleCurrentChange(val) {
+      this.currentRow = val;
+    },
+    handlerRowClick(){},
+    handleSelectionChange(){}
+  }
+}
+</script>