Commit 8e6cac78 authored by 水落(YangLei)'s avatar 水落(YangLei)

feat: 优化代码,去掉无用的依赖

parent f069dc81
{
"name": "vue-antd-admin",
"version": "0.7.2",
"homepage": "https://iczer.github.io/vue-antd-admin",
"private": true,
"scripts": {
"start": "vue-cli-service serve",
"serve": "vue-cli-service serve",
"build": "vue-cli-service build",
"lint": "vue-cli-service lint",
"predeploy": "yarn build",
"deploy": "gh-pages -d dist -b pages -r https://gitee.com/iczer/vue-antd-admin.git",
"docs:dev": "vuepress dev docs",
"docs:build": "vuepress build docs",
"docs:deploy": "vuepress build docs && gh-pages -d docs/.vuepress/dist -b master -r https://gitee.com/iczer/vue-antd-admin-docs.git"
},
"dependencies": {
"@antv/data-set": "^0.11.4",
"@tailwindcss/postcss7-compat": "^2.2.2",
"animate.css": "^4.1.0",
"ant-design-vue": "1.7.2",
"axios": "^0.21.1",
"clipboard": "^2.0.6",
"core-js": "^3.6.5",
"crypto-js": "^4.0.0",
"date-fns": "^2.14.0",
"enquire.js": "^2.1.6",
"highlight.js": "^10.2.1",
"lodash": "^4.17.21",
"mockjs": "^1.1.0",
"moment": "^2.29.1",
"nprogress": "^0.2.0",
"regenerator-runtime": "^0.13.7",
"tailwindcss": "npm:@tailwindcss/postcss7-compat@^2.2.2",
"viser-vue": "^2.4.8",
"vue": "^2.6.11",
"vue-i18n": "^8.18.2",
"vue-router": "^3.3.4",
"vuedraggable": "^2.23.2",
"vuex": "^3.4.0"
},
"devDependencies": {
"@ant-design/colors": "^4.0.1",
"@vue/cli-plugin-babel": "^4.4.0",
"@vue/cli-plugin-eslint": "^4.4.0",
"@vue/cli-service": "^4.4.0",
"@vuepress/plugin-back-to-top": "^1.5.2",
"autoprefixer": "^9.8.6",
"babel-eslint": "^10.1.0",
"babel-plugin-transform-remove-console": "^6.9.4",
"babel-polyfill": "^6.26.0",
"compression-webpack-plugin": "^2.0.0",
"deepmerge": "^4.2.2",
"eslint": "^6.7.2",
"eslint-plugin-prettier": "3.3.1",
"eslint-plugin-vue": "^6.2.2",
"fast-deep-equal": "^3.1.3",
"gh-pages": "^3.1.0",
"less-loader": "^6.1.1",
"style-resources-loader": "^1.3.2",
"vue-cli-plugin-style-resources-loader": "^0.1.4",
"vue-template-compiler": "^2.6.11",
"vuepress": "^1.5.2",
"webpack-theme-color-replacer": "^1.3.12",
"whatwg-fetch": "^3.0.0"
},
"eslintConfig": {
"root": true,
"env": {
"node": true
"name": "vue-antd-admin",
"version": "0.7.2",
"homepage": "https://iczer.github.io/vue-antd-admin",
"private": true,
"scripts": {
"start": "vue-cli-service serve",
"serve": "vue-cli-service serve",
"build": "vue-cli-service build",
"lint": "vue-cli-service lint",
"predeploy": "yarn build",
"deploy": "gh-pages -d dist -b pages -r https://gitee.com/iczer/vue-antd-admin.git",
"docs:dev": "vuepress dev docs",
"docs:build": "vuepress build docs",
"docs:deploy": "vuepress build docs && gh-pages -d docs/.vuepress/dist -b master -r https://gitee.com/iczer/vue-antd-admin-docs.git"
},
"extends": [
"plugin:vue/essential",
"eslint:recommended"
],
"parserOptions": {
"parser": "babel-eslint"
"dependencies": {
"@antv/data-set": "^0.11.4",
"@tailwindcss/postcss7-compat": "^2.2.2",
"animate.css": "^4.1.0",
"ant-design-vue": "1.7.2",
"axios": "^0.21.1",
"clipboard": "^2.0.6",
"core-js": "^3.6.5",
"crypto-js": "^4.0.0",
"date-fns": "^2.14.0",
"highlight.js": "^10.2.1",
"lodash": "^4.17.21",
"mockjs": "^1.1.0",
"moment": "^2.29.1",
"nprogress": "^0.2.0",
"regenerator-runtime": "^0.13.7",
"tailwindcss": "npm:@tailwindcss/postcss7-compat@^2.2.2",
"viser-vue": "^2.4.8",
"vue": "^2.6.11",
"vue-i18n": "^8.18.2",
"vue-router": "^3.3.4",
"vuedraggable": "^2.23.2",
"vuex": "^3.4.0"
},
"devDependencies": {
"@ant-design/colors": "^4.0.1",
"@babel/eslint-parser": "^7.14.7",
"@vue/cli-plugin-babel": "^4.4.0",
"@vue/cli-plugin-eslint": "^4.4.0",
"@vue/cli-service": "^4.4.0",
"@vuepress/plugin-back-to-top": "^1.5.2",
"autoprefixer": "^9.8.6",
"babel-plugin-transform-remove-console": "^6.9.4",
"babel-polyfill": "^6.26.0",
"compression-webpack-plugin": "^2.0.0",
"deepmerge": "^4.2.2",
"eslint": "^6.7.2",
"eslint-plugin-prettier": "3.3.1",
"eslint-plugin-vue": "^6.2.2",
"fast-deep-equal": "^3.1.3",
"gh-pages": "^3.1.0",
"less-loader": "^6.1.1",
"style-resources-loader": "^1.3.2",
"vue-cli-plugin-style-resources-loader": "^0.1.4",
"vue-template-compiler": "^2.6.11",
"vuepress": "^1.5.2",
"webpack-theme-color-replacer": "^1.3.12",
"whatwg-fetch": "^3.0.0"
},
"rules": {
"no-unused-vars": "off"
"eslintConfig": {
"root": true,
"env": {
"node": true
},
"extends": [
"plugin:vue/essential",
"eslint:recommended"
],
"parserOptions": {
"parser": "@babel/eslint-parser"
},
"rules": {
"no-unused-vars": "off"
}
},
"browserslist": [
"> 1%",
"last 2 versions",
"not ie <= 10"
],
"lint-staged": {
"*.{js,jsx,vue}": [
"vue-cli-service lint",
"git add"
]
}
},
"browserslist": [
"> 1%",
"last 2 versions",
"not ie <= 10"
],
"lint-staged": {
"*.{js,jsx,vue}": [
"vue-cli-service lint",
"git add"
]
}
}
This diff is collapsed.
......@@ -5,9 +5,9 @@
</template>
<script>
import { enquireScreen } from './utils/commonUtil';
import { mapState, mapMutations } from 'vuex';
import { mapState } from 'vuex';
import { changeThemeColor } from '@/utils/themeUtil';
import langUtils from '@/utils/langUtils';
export default {
name: 'App',
......@@ -18,15 +18,10 @@ export default {
},
created() {
this.setHtmlTitle();
this.setLanguage(this.lang);
enquireScreen(isMobile => this.setDevice(isMobile));
this.setLanguage();
},
watch: {
lang(val) {
this.setLanguage(val);
this.setHtmlTitle();
},
$route() {
this.setHtmlTitle();
},
......@@ -44,12 +39,11 @@ export default {
},
computed: {
//setting = mapStore.name
...mapState('settingModule', ['layout', 'theme', 'lang']),
...mapState('settingModule', ['layout', 'theme']),
},
methods: {
...mapMutations('settingModule', ['setDevice']),
setLanguage(lang) {
setLanguage() {
const lang = langUtils.get();
this.$i18n.locale = lang;
switch (lang) {
case 'zh_CN':
......
import { postReq, putReq } from '@/utils';
import { getReq, postReq, putReq } from '@/utils';
export function addTaskApi(data) {
return postReq('/api/v1/schedules', data);
......@@ -7,3 +7,7 @@ export function addTaskApi(data) {
export function updateTaskApi(data) {
return putReq('/api/v1/schedules', data);
}
export function getRangerInspectionTaskDetailApi(id) {
return getReq(`/ranger/inspection/api/v1/jobs/tasks/${id}`);
}
<template>
<a-layout-sider
:theme="sideTheme"
:class="['side-menu', 'beauty-scroll', isMobile ? null : 'shadow']"
:class="['side-menu', 'beauty-scroll']"
width="256px"
:collapsible="collapsible"
v-model="collapsed"
......@@ -49,15 +49,12 @@ export default {
sideTheme() {
return this.theme == 'light' ? this.theme : 'dark';
},
...mapState('settingModule', ['isMobile', 'systemName']),
...mapState('settingModule', ['systemName']),
},
};
</script>
<style lang="less" scoped>
.shadow {
box-shadow: 2px 0 6px rgba(0, 21, 41, 0.35);
}
.side-menu {
min-height: 100vh;
overflow-y: auto;
......
<template>
<a-layout-header :class="[headerTheme, 'admin-header']">
<div :class="['admin-header-wide', layout, pageWidth]">
<router-link
v-if="isMobile || layout === 'head'"
to="/"
:class="['logo', isMobile ? null : 'pc', headerTheme]"
>
<router-link v-if="layout === 'head'" to="/" :class="['logo', 'pc', headerTheme]">
<img width="32" src="@/assets/img/logo.png" />
<h1 v-if="!isMobile">{{ systemName }}</h1>
<h1>{{ systemName }}</h1>
</router-link>
<a-icon
......@@ -16,11 +12,7 @@
:type="collapsed ? 'menu-unfold' : 'menu-fold'"
@click="toggleCollapse"
/>
<div
v-if="layout !== 'side' && !isMobile"
class="admin-header-menu"
:style="`width: ${menuWidth};`"
>
<div v-if="layout !== 'side'" class="admin-header-menu" :style="`width: ${menuWidth};`">
<i-menu
class="head-menu"
:theme="headerTheme"
......@@ -53,9 +45,9 @@ export default {
return {};
},
computed: {
...mapState('settingModule', ['theme', 'isMobile', 'layout', 'systemName', 'pageWidth']),
...mapState('settingModule', ['theme', 'layout', 'systemName', 'pageWidth']),
headerTheme() {
if (this.layout == 'side' && this.theme.mode == 'dark' && !this.isMobile) {
if (this.layout == 'side' && this.theme.mode == 'dark') {
return 'light';
}
return this.theme.mode;
......@@ -67,7 +59,7 @@ export default {
return `calc(${headWidth} - ${extraWidth})`;
},
showToggleCollapse() {
if (this.layout !== 'head' && this.isMobile === false) {
if (this.layout !== 'head') {
return true;
} else {
return false;
......
<template>
<a-layout :class="['admin-layout', 'beauty-scroll']">
<drawer v-if="isMobile" v-model="drawerOpen">
<side-menu
:theme="theme.mode"
:menuData="menuData"
:collapsed="false"
:collapsible="false"
@menuSelect="onMenuSelect"
/>
</drawer>
<side-menu
:class="[fixedSideBar ? 'fixed-side' : '']"
:theme="theme.mode"
v-else-if="layout === 'side' || layout === 'mix'"
v-if="layout === 'side' || layout === 'mix'"
:menuData="sideMenuData"
:collapsed="collapsed"
:collapsible="true"
/>
<div
v-if="fixedSideBar && !isMobile"
v-if="fixedSideBar"
:style="`width: ${sideMenuWidth}; min-width: ${sideMenuWidth};max-width: ${sideMenuWidth};`"
class="virtual-side"
/>
......@@ -73,7 +63,6 @@ export default {
minHeight: window.innerHeight - 64 - 122,
collapsed: false,
showSetting: false,
drawerOpen: false,
menuData: [],
firstMenu: [],
subMenu: [],
......@@ -86,18 +75,12 @@ export default {
};
},
watch: {
isMobile(val) {
if (!val) {
this.drawerOpen = false;
}
},
layout(layout) {
this.updateSildeMenu(layout);
},
},
computed: {
...mapState('settingModule', [
'isMobile',
'theme',
'layout',
'footerLinks',
......@@ -120,9 +103,7 @@ export default {
},
headerStyle() {
let width =
this.fixedHeader && this.layout !== 'head' && !this.isMobile
? `calc(100% - ${this.sideMenuWidth})`
: '100%';
this.fixedHeader && this.layout !== 'head' ? `calc(100% - ${this.sideMenuWidth})` : '100%';
let position = this.fixedHeader ? 'fixed' : 'static';
return `width: ${width}; position: ${position};`;
},
......@@ -147,11 +128,11 @@ export default {
updateSildeMenu(layout) {
if (layout === 'mix') {
const { path } = this.$route;
let currentMenu = this.menuList.find(i => i.menuUrl === path);
let currentMenu = this.menuList.find((i) => i.menuUrl === path);
let parentMenuId = currentMenu.parentMenuId;
while (parentMenuId !== 0) {
currentMenu = this.menuList.find(i => i.menuId === parentMenuId);
currentMenu = this.menuList.find((i) => i.menuId === parentMenuId);
parentMenuId = currentMenu.parentMenuId;
}
this.subMenu = currentMenu.children || [];
......@@ -161,7 +142,7 @@ export default {
menuSelect(obj) {
// 拿到 菜单id
const menuId = obj.key;
const currentMenu = this.menuList.find(i => i.menuId === menuId);
const currentMenu = this.menuList.find((i) => i.menuId === menuId);
if (currentMenu.menuType === 'MENU') {
this.subMenu = [];
......@@ -177,7 +158,7 @@ export default {
const menuData = convertListToTree(menuList || [], false, true);
this.menuData = menuData;
this.menuList = menuList;
this.firstMenu = JSON.parse(JSON.stringify(menuData)).map(i => {
this.firstMenu = JSON.parse(JSON.stringify(menuData)).map((i) => {
delete i.children;
return i;
});
......
......@@ -12,7 +12,6 @@ const customTitles = (customTitlesStr && JSON.parse(customTitlesStr)) || [];
export default {
namespaced: true,
state: {
isMobile: false,
animates: globalConfig.animates.preset,
palettes: globalConfig.palettes,
pageMinHeight: 0,
......@@ -36,7 +35,7 @@ export default {
if (menuData.length > 0 && !menuData[0].fullPath) {
formatFullPath(menuData);
}
return menuData.map(item => {
return menuData.map((item) => {
const menuItem = { ...item };
delete menuItem.children;
return menuItem;
......@@ -44,9 +43,6 @@ export default {
},
},
mutations: {
setDevice(state, isMobile) {
state.isMobile = isMobile;
},
setTheme(state, theme) {
state.theme = theme;
},
......@@ -92,7 +88,7 @@ export default {
},
setCustomTitle(state, { path, title }) {
if (title) {
const obj = state.customTitles.find(item => item.path === path);
const obj = state.customTitles.find((item) => item.path === path);
if (obj) {
obj.title = title;
} else {
......
<template>
<page-layout :desc="desc" :linkList="linkList">
<div v-if="this.extraImage && !isMobile" slot="extra" :class="$style.extraImg">
<div v-if="extraImage" slot="extra" :class="$style.extraImg">
<img :src="extraImage" />
</div>
<router-view ref="page" />
......@@ -20,7 +20,7 @@ export default {
};
},
computed: {
...mapState('settingModule', ['isMobile', 'multiPage']),
...mapState('settingModule', ['multiPage']),
desc() {
return this.page?.desc;
},
......
<template>
<Wraper :hidden="hidden" noFooter>
<Table :url="tableUrl" rowKey="taskId" noPadding :buttons="buttons" :scroll="scroll" :width="600">
<Table
:url="tableUrl"
rowKey="taskId"
noPadding
:buttons="buttons"
:scroll="scroll"
:width="600"
ref="table"
>
<template #search="{ query }">
<MoreItem label="开始时间">
<a-date-picker
......@@ -99,6 +107,10 @@
</MoreItem>
</template>
<template #drawer="drawer">
<ViewDetailCom v-bind="drawer" />
</template>
<a-table-column title="巡检项目" data-index="taskName" />
<a-table-column title="参考值" data-index="referenceValue" width="150px" />
<a-table-column title="采集数据" data-index="value" width="150px" />
......@@ -109,6 +121,7 @@
</Table>
</Wraper>
</template>
<script>
import Table from '@/components/table/table.vue';
import Wraper from '@/components/table/wraper.vue';
......@@ -116,10 +129,12 @@ import UrlSelect from '@/components/MySelect/url_select.vue';
import SearchSelect from '@/components/MySelect/search_select.vue';
import langUtils from '@/utils/langUtils';
import MoreItem from '@/components/table/more_item.vue';
import ViewDetailCom from './view_detail.vue';
export default {
props: { hidden: Function, row: Object },
components: { Table, Wraper, SearchSelect, UrlSelect, MoreItem },
components: { Table, Wraper, SearchSelect, UrlSelect, MoreItem, ViewDetailCom },
data() {
return {
scroll: { x: 1200 },
......@@ -152,6 +167,7 @@ export default {
methods: {
viewDetail(row) {
console.log(row);
this.$refs.table.show({ row, title: '备注 & 附件' });
},
},
};
......
<template>
<Wraper noFooter :hidden="hidden">
<span>备注:</span>
<div style="min-height: 100px" class="tw-font-medium tw-mt-2">{{ detailData.inspectionRemark }}</div>
<a-tabs>
<!-- Todo -->
<a-tab-pane key="1" tab="图片"></a-tab-pane>
<a-tab-pane key="2" tab="视频"></a-tab-pane>
</a-tabs>
</Wraper>
</template>
<script>
import Wraper from '@/components/table/wraper.vue';
import { getRangerInspectionTaskDetailApi } from '@/api';
export default {
props: { hidden: Function, row: Object },
components: { Wraper },
data() {
return {
detailData: {},
};
},
async mounted() {
this.detailData = await getRangerInspectionTaskDetailApi(this.row.taskId);
console.log(this.detailData);
},
};
</script>
//enquire.js 纯 JavaScript 实现的 CSS 媒体查询库
import enquireJs from "enquire.js";
export function isDef(v) {
return v !== undefined && v !== null;
}
......@@ -18,19 +15,7 @@ export function remove(arr, item) {
}
export function isRegExp(v) {
return _toString.call(v) === "[object RegExp]";
}
export function enquireScreen(call) {
const handler = {
match: function() {
call && call(true);
},
unmatch: function() {
call && call(false);
},
};
enquireJs.register("only screen and (max-width: 767.99px)", handler);
return _toString.call(v) === '[object RegExp]';
}
const _toString = Object.prototype.toString;
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment