lzh/AML-frontend
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

数据集上传，数据预览

Browse Source
This commit is contained in:
lzh
2021-02-15 00:34:26 +08:00
parent e50551918b
commit beb1ea4b89
11 changed files with 950 additions and 609 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.idea/workspace.xml
Generated
+375 -108
View File
@@ -2,8 +2,17 @@
<project version="4">
<component name="ChangeListManager">
<list default="true" id="8d242b82-cb9f-402f-b127-e24c2f7034a5" name="Default Changelist" comment="">
<change afterPath="$PROJECT_DIR$/vue_study.md" afterDir="false" />
<change beforePath="$PROJECT_DIR$/.idea/workspace.xml" beforeDir="false" afterPath="$PROJECT_DIR$/.idea/workspace.xml" afterDir="false" />
<change beforePath="$PROJECT_DIR$/config/index.js" beforeDir="false" afterPath="$PROJECT_DIR$/config/index.js" afterDir="false" />
<change beforePath="$PROJECT_DIR$/package.json" beforeDir="false" afterPath="$PROJECT_DIR$/package.json" afterDir="false" />
<change beforePath="$PROJECT_DIR$/src/App.vue" beforeDir="false" afterPath="$PROJECT_DIR$/src/App.vue" afterDir="false" />
<change beforePath="$PROJECT_DIR$/src/api/api.js" beforeDir="false" afterPath="$PROJECT_DIR$/src/api/api.js" afterDir="false" />
<change beforePath="$PROJECT_DIR$/src/main.js" beforeDir="false" afterPath="$PROJECT_DIR$/src/main.js" afterDir="false" />
<change beforePath="$PROJECT_DIR$/src/mock/mock.js" beforeDir="false" afterPath="$PROJECT_DIR$/src/mock/mock.js" afterDir="false" />
<change beforePath="$PROJECT_DIR$/src/views/Login.vue" beforeDir="false" afterPath="$PROJECT_DIR$/src/views/Login.vue" afterDir="false" />
<change beforePath="$PROJECT_DIR$/src/views/nav1/Table.vue" beforeDir="false" afterPath="$PROJECT_DIR$/src/views/nav1/Table.vue" afterDir="false" />
<change beforePath="$PROJECT_DIR$/src/views/nav1/user.vue" beforeDir="false" afterPath="$PROJECT_DIR$/src/views/nav1/user.vue" afterDir="false" />
</list>
<option name="EXCLUDED_CONVERTED_TO_IGNORED" value="true" />
<option name="SHOW_DIALOG" value="false" />
@@ -11,51 +20,166 @@
<option name="HIGHLIGHT_NON_ACTIVE_CHANGELIST" value="false" />
<option name="LAST_RESOLUTION" value="IGNORE" />
</component>
<component name="DatabaseView">
<option name="SHOW_INTERMEDIATE" value="true" />
<option name="GROUP_DATA_SOURCES" value="true" />
<option name="GROUP_SCHEMA" value="true" />
<option name="GROUP_CONTENTS" value="false" />
<option name="SORT_POSITIONED" value="false" />
<option name="SHOW_EMPTY_GROUPS" value="false" />
<option name="AUTO_SCROLL_FROM_SOURCE" value="false" />
<option name="HIDDEN_KINDS">
<set />
</option>
<expand />
<select />
</component>
<component name="DockManager">
<window id="1">
<content type="file-editors">
<state>
<leaf SIDE_TABS_SIZE_LIMIT_KEY="300">
<file pinned="false" current-in-tab="true">
<entry file="file://$PROJECT_DIR$/vue_study.md">
<provider selected="true" editor-type-id="split-provider[text-editor;markdown-preview-editor]">
<state split_layout="SPLIT">
<first_editor relative-caret-position="548">
<caret line="157" column="17" selection-start-line="157" selection-start-column="17" selection-end-line="157" selection-end-column="17" />
</first_editor>
<second_editor />
</state>
</provider>
</entry>
</file>
</leaf>
</state>
</content>
</window>
</component>
<component name="FileEditorManager">
<leaf SIDE_TABS_SIZE_LIMIT_KEY="300">
<file pinned="false" current-in-tab="false">
<entry file="file://$PROJECT_DIR$/src/views/Main.vue">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="115">
<caret line="5" selection-start-line="5" selection-end-line="5" />
</state>
</provider>
</entry>
</file>
<file pinned="false" current-in-tab="false">
<entry file="file://$PROJECT_DIR$/src/routes.js">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="138">
<caret line="15" column="21" selection-start-line="15" selection-start-column="21" selection-end-line="15" selection-end-column="21" />
<folding>
<element signature="e#0#37#0" expanded="true" />
</folding>
</state>
</provider>
</entry>
</file>
<file pinned="false" current-in-tab="false">
<entry file="file://$PROJECT_DIR$/src/views/Login.vue">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="-23">
<caret line="20" column="17" selection-start-line="20" selection-start-column="17" selection-end-line="20" selection-end-column="17" />
</state>
</provider>
</entry>
</file>
<file pinned="false" current-in-tab="true">
<entry file="file://$PROJECT_DIR$/src/main.js">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="299">
<caret line="16" column="18" lean-forward="true" selection-start-line="16" selection-start-column="18" selection-end-line="16" selection-end-column="18" />
<folding>
<element signature="e#0#42#0" expanded="true" />
</folding>
</state>
</provider>
</entry>
</file>
</leaf>
<splitter split-orientation="horizontal" split-proportion="0.71924293">
<split-first>
<leaf SIDE_TABS_SIZE_LIMIT_KEY="300">
<file pinned="false" current-in-tab="true">
<entry file="file://$PROJECT_DIR$/src/views/nav1/user.vue">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="121">
<caret line="45" column="12" selection-start-line="45" selection-start-column="12" selection-end-line="45" selection-end-column="12" />
<folding>
<element signature="n#style#0;n#el-table#0;n#template#0;n#section#0;n#template#0;n#!!top" expanded="true" />
<element signature="e#1086#1130#0" expanded="true" />
</folding>
</state>
</provider>
</entry>
</file>
<file pinned="false" current-in-tab="false">
<entry file="file://$PROJECT_DIR$/src/App.vue">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="46">
<caret line="11" column="16" lean-forward="true" selection-start-line="11" selection-start-column="16" selection-end-line="11" selection-end-column="16" />
</state>
</provider>
</entry>
</file>
<file pinned="false" current-in-tab="false">
<entry file="file://$PROJECT_DIR$/dist/static/js/vendor.0f1354d86ff9bd2ab3e5.js">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="158">
<caret line="38" column="63098" selection-start-line="38" selection-start-column="63098" selection-end-line="38" selection-end-column="63098" />
</state>
</provider>
</entry>
</file>
<file pinned="false" current-in-tab="false">
<entry file="file://$PROJECT_DIR$/src/main.js">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="213">
<caret line="17" column="46" selection-start-line="17" selection-start-column="46" selection-end-line="17" selection-end-column="46" />
<folding>
<element signature="e#0#42#0" expanded="true" />
</folding>
</state>
</provider>
</entry>
</file>
<file pinned="false" current-in-tab="false">
<entry file="file://$PROJECT_DIR$/src/common/js/util.js">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="-69" />
</provider>
</entry>
</file>
</leaf>
</split-first>
<split-second>
<leaf SIDE_TABS_SIZE_LIMIT_KEY="300">
<file pinned="false" current-in-tab="true">
<entry file="file://$PROJECT_DIR$/src/views/nav1/Table.vue">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="184">
<caret line="117" column="39" lean-forward="true" selection-start-line="117" selection-start-column="39" selection-end-line="117" selection-end-column="39" />
<folding>
<element signature="n#style#0;n#span#0;n#section#0;n#template#0;n#!!top" expanded="true" />
<element signature="n#style#0;n#el-table#0;n#section#0;n#template#0;n#!!top" expanded="true" />
</folding>
</state>
</provider>
</entry>
</file>
<file pinned="false" current-in-tab="false">
<entry file="file://$PROJECT_DIR$/config/index.js">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="497">
<caret line="34" column="20" selection-start-line="34" selection-start-column="20" selection-end-line="34" selection-end-column="20" />
</state>
</provider>
</entry>
</file>
<file pinned="false" current-in-tab="false">
<entry file="file://$PROJECT_DIR$/src/views/Home.vue">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="74">
<caret line="93" column="18" selection-start-line="93" selection-start-column="18" selection-end-line="93" selection-end-column="18" />
</state>
</provider>
</entry>
</file>
<file pinned="false" current-in-tab="false">
<entry file="file://$PROJECT_DIR$/src/views/Login.vue">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="315">
<caret line="57" column="8" selection-start-line="57" selection-start-column="8" selection-end-line="57" selection-end-column="8" />
</state>
</provider>
</entry>
</file>
<file pinned="false" current-in-tab="false">
<entry file="file://$PROJECT_DIR$/src/routes.js">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="92">
<caret line="4" column="42" lean-forward="true" selection-start-line="4" selection-start-column="13" selection-end-line="4" selection-end-column="42" />
</state>
</provider>
</entry>
</file>
<file pinned="false" current-in-tab="false">
<entry file="file://$PROJECT_DIR$/src/api/api.js">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="460">
<caret line="20" column="34" lean-forward="true" selection-start-line="8" selection-end-line="9" />
</state>
</provider>
</entry>
</file>
</leaf>
</split-second>
</splitter>
</component>
<component name="FindInProjectRecents">
<findStrings>
<find>查询</find>
</findStrings>
</component>
<component name="Git.Settings">
<option name="RECENT_GIT_ROOT_PATH" value="$PROJECT_DIR$" />
@@ -70,21 +194,31 @@
<option value="$PROJECT_DIR$/src/views/nav1/Form.vue" />
<option value="$PROJECT_DIR$/README.md" />
<option value="$PROJECT_DIR$/dist/index.html" />
<option value="$PROJECT_DIR$/src/mock/mock.js" />
<option value="$PROJECT_DIR$/src/main.js" />
<option value="$PROJECT_DIR$/config/index.js" />
<option value="$PROJECT_DIR$/src/api/api.js" />
<option value="$PROJECT_DIR$/vue_study.md" />
<option value="$PROJECT_DIR$/src/App.vue" />
<option value="$PROJECT_DIR$/src/views/Login.vue" />
<option value="$PROJECT_DIR$/src/views/Home.vue" />
<option value="$PROJECT_DIR$/src/views/nav1/Table.vue" />
<option value="$PROJECT_DIR$/src/views/nav1/user.vue" />
</list>
</option>
</component>
<component name="ProjectFrameBounds" extendedState="6">
<option name="x" value="-138" />
<option name="y" value="233" />
<option name="width" value="1625" />
<option name="height" value="1220" />
<option name="x" value="-9" />
<option name="y" value="-9" />
<option name="width" value="1938" />
<option name="height" value="1048" />
</component>
<component name="ProjectView">
<navigator proportions="" version="1">
<foldersAlwaysOnTop value="true" />
</navigator>
<panes>
<pane id="Scope" />
<pane id="ProjectPane">
<subPane>
<expand>
@@ -97,17 +231,10 @@
<item name="AML_frontend" type="462c0819:PsiDirectoryNode" />
<item name="src" type="462c0819:PsiDirectoryNode" />
</path>
<path>
<item name="AML-frontend" type="b2602c69:ProjectViewProjectNode" />
<item name="AML_frontend" type="462c0819:PsiDirectoryNode" />
<item name="src" type="462c0819:PsiDirectoryNode" />
<item name="views" type="462c0819:PsiDirectoryNode" />
</path>
</expand>
<select />
</subPane>
</pane>
<pane id="Scope" />
</panes>
</component>
<component name="PropertiesComponent">
@@ -123,6 +250,8 @@
<property name="nodejs_interpreter_path.stuck_in_default_project" value="undefined stuck path" />
<property name="nodejs_npm_path_reset_for_default_project" value="true" />
<property name="nodejs_package_manager_path" value="npm" />
<property name="settings.editor.selected.configurable" value="preferences.lookFeel" />
<property name="ts.external.directory.path" value="E:\PyCharm 2019.1.3\plugins\JavaScriptLanguage\jsLanguageServicesImpl\external" />
</component>
<component name="RecentsManager">
<key name="MoveFile.RECENT_KEYS">
@@ -176,7 +305,11 @@
<workItem from="1610599073204" duration="780000" />
<workItem from="1611143220514" duration="3770000" />
<workItem from="1611321289369" duration="599000" />
<workItem from="1611490729654" duration="2333000" />
<workItem from="1611490729654" duration="6105000" />
<workItem from="1613019351924" duration="19249000" />
<workItem from="1613109888235" duration="8752000" />
<workItem from="1613193364112" duration="15888000" />
<workItem from="1613276072538" duration="27018000" />
</task>
<task id="LOCAL-00001" summary="自动机器学习前端组件">
<created>1601387458948</created>
@@ -199,38 +332,69 @@
<option name="project" value="LOCAL" />
<updated>1608984900939</updated>
</task>
<option name="localTasksCounter" value="4" />
<task id="LOCAL-00004" summary="修改main.js">
<created>1611496809086</created>
<option name="number" value="00004" />
<option name="presentableId" value="LOCAL-00004" />
<option name="project" value="LOCAL" />
<updated>1611496809086</updated>
</task>
<option name="localTasksCounter" value="5" />
<servers />
</component>
<component name="TimeTrackingManager">
<option name="totallyTimeSpent" value="30787000" />
<option name="totallyTimeSpent" value="105466000" />
</component>
<component name="ToolWindowManager">
<frame x="-7" y="-7" width="1550" height="838" extended-state="6" />
<editor active="true" />
<layout>
<window_info active="true" content_ui="combo" id="Project" order="0" visible="true" weight="0.25268096" />
<window_info id="Structure" order="1" side_tool="true" weight="0.25" />
<window_info content_ui="combo" id="Project" order="0" sideWeight="0.4979757" visible="true" weight="0.15013404" />
<window_info id="Structure" order="1" sideWeight="0.5020243" side_tool="true" weight="0.18096514" />
<window_info id="Favorites" order="2" side_tool="true" />
<window_info anchor="bottom" id="TypeScript" />
<window_info anchor="bottom" id="Message" order="0" />
<window_info anchor="bottom" id="Find" order="1" />
<window_info anchor="bottom" id="Run" order="2" />
<window_info anchor="bottom" id="Run" order="2" weight="0.32991204" />
<window_info anchor="bottom" id="Debug" order="3" weight="0.4" />
<window_info anchor="bottom" id="Cvs" order="4" weight="0.25" />
<window_info anchor="bottom" id="Inspection" order="5" weight="0.4" />
<window_info anchor="bottom" id="TODO" order="6" />
<window_info anchor="bottom" id="Docker" order="7" show_stripe_button="false" />
<window_info anchor="bottom" id="Version Control" order="8" weight="0.32884097" />
<window_info anchor="bottom" id="Version Control" order="8" weight="0.32844576" />
<window_info anchor="bottom" id="Database Changes" order="9" />
<window_info anchor="bottom" id="Event Log" order="10" side_tool="true" />
<window_info anchor="bottom" id="Terminal" order="11" visible="true" weight="0.27565983" />
<window_info anchor="bottom" id="Python Console" order="12" />
<window_info anchor="bottom" id="Terminal" order="11" weight="0.3328446" />
<window_info active="true" anchor="bottom" id="Python Console" order="12" visible="true" weight="0.38856304" />
<window_info anchor="right" id="Commander" internal_type="SLIDING" order="0" type="SLIDING" weight="0.4" />
<window_info anchor="right" id="Ant Build" order="1" weight="0.25" />
<window_info anchor="right" content_ui="combo" id="Hierarchy" order="2" weight="0.25" />
<window_info anchor="right" id="SciView" order="3" />
<window_info anchor="right" id="Database" order="4" />
</layout>
<layout-to-restore>
<window_info content_ui="combo" id="Project" order="0" sideWeight="0.4979757" visible="true" weight="0.103217155" />
<window_info id="Structure" order="1" sideWeight="0.5020243" side_tool="true" weight="0.18096514" />
<window_info id="Favorites" order="2" side_tool="true" />
<window_info anchor="bottom" id="Message" order="0" />
<window_info anchor="bottom" id="Find" order="1" />
<window_info anchor="bottom" id="Run" order="2" weight="0.32991204" />
<window_info anchor="bottom" id="Debug" order="3" weight="0.4" />
<window_info anchor="bottom" id="Cvs" order="4" weight="0.25" />
<window_info anchor="bottom" id="Inspection" order="5" weight="0.4" />
<window_info anchor="bottom" id="TODO" order="6" />
<window_info anchor="bottom" id="Docker" order="7" show_stripe_button="false" />
<window_info anchor="bottom" id="Version Control" order="8" weight="0.32844576" />
<window_info anchor="bottom" id="Database Changes" order="9" />
<window_info anchor="bottom" id="Event Log" order="10" side_tool="true" />
<window_info active="true" anchor="bottom" id="Terminal" order="11" visible="true" weight="0.27419356" />
<window_info anchor="bottom" id="Python Console" order="12" weight="0.22727273" />
<window_info anchor="right" id="Commander" internal_type="SLIDING" order="0" type="SLIDING" weight="0.4" />
<window_info anchor="right" id="Ant Build" order="1" weight="0.25" />
<window_info anchor="right" content_ui="combo" id="Hierarchy" order="2" weight="0.25" />
<window_info anchor="right" id="SciView" order="3" />
<window_info anchor="right" id="Database" order="4" />
</layout-to-restore>
</component>
<component name="TypeScriptGeneratedFilesManager">
<option name="version" value="1" />
@@ -238,40 +402,16 @@
<component name="VcsManagerConfiguration">
<MESSAGE value="自动机器学习前端组件" />
<MESSAGE value="更新readme,添加真实数据json" />
<option name="LAST_COMMIT_MESSAGE" value="更新readme,添加真实数据json" />
<MESSAGE value="修改main.js" />
<option name="LAST_COMMIT_MESSAGE" value="修改main.js" />
</component>
<component name="editorHistoryManager">
<entry file="file://$PROJECT_DIR$/src/views/nav1/user.vue" />
<entry file="file://$PROJECT_DIR$/src/views/nav1/Table.vue" />
<entry file="file://$PROJECT_DIR$/src/views/nav1/Form.vue" />
<entry file="file://$PROJECT_DIR$/src/api/api.js">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="368">
<caret line="16" column="93" selection-start-line="16" selection-start-column="93" selection-end-line="16" selection-end-column="93" />
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/Test_Dataset/day.csv">
<provider selected="true" editor-type-id="csv-text-editor" />
<provider editor-type-id="csv-table-editor">
<state showInfoPanel="true" fixedHeaders="false" rowLines="3" />
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/README.md">
<provider selected="true" editor-type-id="split-provider[text-editor;markdown-preview-editor]">
<state split_layout="SPLIT">
<first_editor relative-caret-position="1173">
<caret line="51" column="21" selection-start-line="51" selection-start-column="21" selection-end-line="51" selection-end-column="21" />
</first_editor>
<second_editor />
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/src/App.vue">
<provider selected="true" editor-type-id="text-editor" />
</entry>
<entry file="file://$PROJECT_DIR$/src/views/Home.vue">
<provider selected="true" editor-type-id="text-editor" />
<provider selected="true" editor-type-id="csv-text-editor" />
</entry>
<entry file="file://$PROJECT_DIR$/src/styles/vars.scss">
<provider selected="true" editor-type-id="text-editor" />
@@ -295,46 +435,173 @@
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/src/views/charts/echarts.vue">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="138">
<caret line="6" column="31" selection-start-line="6" selection-start-column="31" selection-end-line="6" selection-end-column="31" />
<entry file="file://$PROJECT_DIR$/README.md">
<provider selected="true" editor-type-id="split-provider[text-editor;markdown-preview-editor]">
<state split_layout="SPLIT">
<first_editor relative-caret-position="-65">
<caret line="51" column="21" selection-start-line="51" selection-start-column="21" selection-end-line="51" selection-end-column="21" />
</first_editor>
<second_editor />
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/src/views/Main.vue">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="115">
<caret line="5" selection-start-line="5" selection-end-line="5" />
<state relative-caret-position="253">
<caret line="11" selection-start-line="11" selection-end-line="11" />
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/src/routes.js">
<entry file="file://$PROJECT_DIR$/config/prod.env.js">
<provider selected="true" editor-type-id="text-editor" />
</entry>
<entry file="file://$PROJECT_DIR$/build/webpack.dev.conf.js">
<provider selected="true" editor-type-id="text-editor" />
</entry>
<entry file="file://$PROJECT_DIR$/build/webpack.prod.conf.js">
<provider selected="true" editor-type-id="text-editor" />
</entry>
<entry file="file://$PROJECT_DIR$/build/webpack.base.conf.js">
<provider selected="true" editor-type-id="text-editor" />
</entry>
<entry file="file://$PROJECT_DIR$/src/mock/mock.js">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="138">
<caret line="15" column="21" selection-start-line="15" selection-start-column="21" selection-end-line="15" selection-end-column="21" />
<folding>
<element signature="e#0#37#0" expanded="true" />
</folding>
<state relative-caret-position="184">
<caret line="41" column="20" lean-forward="true" selection-start-line="41" selection-start-column="20" selection-end-line="41" selection-end-column="20" />
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/src/views/Login.vue">
<entry file="file://$PROJECT_DIR$/src/views/charts/echarts.vue">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="-23">
<caret line="20" column="17" selection-start-line="20" selection-start-column="17" selection-end-line="20" selection-end-column="17" />
<state relative-caret-position="23">
<caret line="6" column="31" selection-start-line="6" selection-start-column="31" selection-end-line="6" selection-end-column="31" />
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/config/dev.env.js">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="23">
<caret line="1" column="28" selection-start-line="1" selection-start-column="28" selection-end-line="1" selection-end-column="28" />
</state>
</provider>
</entry>
<entry file="file://$APPLICATION_HOME_DIR$/plugins/JavaScriptLanguage/jsLanguageServicesImpl/external/lib.dom.d.ts">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="23">
<caret line="9573" column="4" selection-start-line="9573" selection-start-column="4" selection-end-line="9573" selection-end-column="4" />
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/vue_study.md">
<provider selected="true" editor-type-id="split-provider[text-editor;markdown-preview-editor]">
<state split_layout="SPLIT">
<first_editor relative-caret-position="548">
<caret line="157" column="17" selection-start-line="157" selection-start-column="17" selection-end-line="157" selection-end-column="17" />
</first_editor>
<second_editor />
</state>
</provider>
<provider editor-type-id="text-editor" />
</entry>
<entry file="file://$PROJECT_DIR$/src/main.js">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="299">
<caret line="16" column="18" lean-forward="true" selection-start-line="16" selection-start-column="18" selection-end-line="16" selection-end-column="18" />
<state relative-caret-position="213">
<caret line="17" column="46" selection-start-line="17" selection-start-column="46" selection-end-line="17" selection-end-column="46" />
<folding>
<element signature="e#0#42#0" expanded="true" />
</folding>
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/config/index.js">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="497">
<caret line="34" column="20" selection-start-line="34" selection-start-column="20" selection-end-line="34" selection-end-column="20" />
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/dist/static/js/vendor.0f1354d86ff9bd2ab3e5.js">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="158">
<caret line="38" column="63098" selection-start-line="38" selection-start-column="63098" selection-end-line="38" selection-end-column="63098" />
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/src/App.vue">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="46">
<caret line="11" column="16" lean-forward="true" selection-start-line="11" selection-start-column="16" selection-end-line="11" selection-end-column="16" />
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/node_modules/_axios@0.15.3@axios/index.d.ts">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="26">
<caret line="122" column="20" selection-start-line="122" selection-start-column="20" selection-end-line="122" selection-end-column="20" />
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/src/common/js/util.js">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="-69" />
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/src/views/Home.vue">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="74">
<caret line="93" column="18" selection-start-line="93" selection-start-column="18" selection-end-line="93" selection-end-column="18" />
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/src/api/api.js">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="460">
<caret line="20" column="34" lean-forward="true" selection-start-line="8" selection-end-line="9" />
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/src/routes.js">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="92">
<caret line="4" column="42" lean-forward="true" selection-start-line="4" selection-start-column="13" selection-end-line="4" selection-end-column="42" />
</state>
</provider>
</entry>
<entry file="file://E:/anaconda3/Lib/site-packages/notebook/static/components/codemirror/mode/coffeescript/coffeescript.js">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="266">
<caret line="314" column="8" selection-start-line="314" selection-start-column="8" selection-end-line="314" selection-end-column="8" />
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/src/views/Login.vue">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="315">
<caret line="57" column="8" selection-start-line="57" selection-start-column="8" selection-end-line="57" selection-end-column="8" />
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/src/views/nav1/Table.vue">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="184">
<caret line="117" column="39" lean-forward="true" selection-start-line="117" selection-start-column="39" selection-end-line="117" selection-end-column="39" />
<folding>
<element signature="n#style#0;n#span#0;n#section#0;n#template#0;n#!!top" expanded="true" />
<element signature="n#style#0;n#el-table#0;n#section#0;n#template#0;n#!!top" expanded="true" />
</folding>
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/src/views/nav1/user.vue">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="121">
<caret line="45" column="12" selection-start-line="45" selection-start-column="12" selection-end-line="45" selection-end-column="12" />
<folding>
<element signature="n#style#0;n#el-table#0;n#template#0;n#section#0;n#template#0;n#!!top" expanded="true" />
<element signature="e#1086#1130#0" expanded="true" />
</folding>
</state>
</provider>
</entry>
</component>
</project>
config/index.js
+10 -2
View File
@@ -7,7 +7,7 @@ module.exports = {
index: path.resolve(__dirname, '../dist/index.html'),
assetsRoot: path.resolve(__dirname, '../dist'),
assetsSubDirectory: 'static',
assetsPublicPath: '/vue-admin/',
assetsPublicPath: '/AML_fronted/',
productionSourceMap: true,
// Gzip off by default as many popular static hosts such as
// Surge or Netlify already gzip all static assets for you.
@@ -27,7 +27,15 @@ module.exports = {
autoOpenBrowser: true,
assetsSubDirectory: 'static',
assetsPublicPath: '/',
proxyTable: {},
proxyTable: {
'/api': {
target: 'http://localhost:8000', //开发环境,设置调用接口域名和端口号
changeOrigin: true,
pathRewrite: {
'^/api': '' //这里理解成用‘/api’代替target里面的地址，组件中我们调接口时直接用/api代替
// 比如我要调用'http://0.0.0.0:3000/user/add'，直接写‘/api/user/add’即可 代理后地址栏显示/
}
}},
// CSS Sourcemaps off by default because relative paths are "buggy"
// with this option, according to the CSS-Loader README
// (https://github.com/webpack/css-loader#sourcemaps)
package.json
+5 -2
View File
@@ -25,11 +25,12 @@
"babel-core": "^6.22.1",
"babel-loader": "^6.2.10",
"babel-plugin-transform-runtime": "^6.22.0",
"babel-preset-env": "^1.2.1",
"babel-polyfill": "^6.16.0",
"babel-preset-env": "^1.2.1",
"babel-preset-es2015": "^6.0.0",
"babel-preset-stage-2": "^6.22.0",
"babel-register": "^6.22.0",
"bootstrap": "^4.6.0",
"chalk": "^1.1.3",
"connect-history-api-fallback": "^1.3.0",
"copy-webpack-plugin": "^4.0.1",
@@ -42,13 +43,14 @@
"function-bind": "^1.0.2",
"html-webpack-plugin": "^2.28.0",
"http-proxy-middleware": "^0.17.3",
"webpack-bundle-analyzer": "^2.2.1",
"jquery": "^3.5.1",
"json-loader": "^0.5.4",
"mockjs": "^1.0.1-beta3",
"node-sass": "^4.5.0",
"opn": "^4.0.2",
"optimize-css-assets-webpack-plugin": "^1.3.0",
"ora": "^1.0.0",
"popper.js": "^1.16.1",
"rimraf": "^2.6.0",
"sass-loader": "^6.0.0",
"semver": "^5.3.0",
@@ -58,6 +60,7 @@
"vue-style-loader": "^2.0.0",
"vue-template-compiler": "^2.2.4",
"webpack": "^2.2.1",
"webpack-bundle-analyzer": "^2.2.1",
"webpack-dev-middleware": "^1.10.0",
"webpack-hot-middleware": "^2.16.1",
"webpack-merge": "^2.6.1"
src/App.vue
+20 -2
View File
@@ -2,7 +2,7 @@
<div id="app">
<transition name="fade"
mode="out-in">
<router-view></router-view>
<router-view v-if="isRouterAlive"></router-view>
</transition>
</div>
</template>
@@ -11,7 +11,25 @@
export default {
name: 'app',
components: {
}
},
provide () {
return {
reload: this.reload
}
},
data () {
return {
isRouterAlive: true
}
},
methods: {
reload () {
this.isRouterAlive = false
this.$nextTick(function () {
this.isRouterAlive = true
})
}
}
}
</script>
src/api/api.js
+12 -2
View File
@@ -2,7 +2,9 @@ import axios from 'axios';
let base = '';
export const requestLogin = params => { return axios.post(`${base}/login`, params).then(res => res.data); };
export const requestLogin ={mag:"success",
code:200,
user:"lzh"};
export const getUserList = params => { return axios.get(`${base}/user/list`, { params: params }); };
@@ -14,4 +16,12 @@ export const batchRemoveUser = params => { return axios.get(`${base}/user/batchr
export const editUser = params => { return axios.get(`${base}/user/edit`, { params: params }); };
export const addUser = params => { return axios.get(`${base}/user/add`, { params: params }); };
export const addUser = params => { return axios.get(`${base}/user/add`, { params: params }); };
export const getDataList=params=>{
return axios.get(
"/dev/api/get_data_list",
).then(function (response) {
console.log(response)
})
}
src/main.js
+5 -2
View File
@@ -3,6 +3,8 @@ import Vue from 'vue'
import App from './App'
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-default/index.css'
import 'bootstrap'
import $ from 'jquery'
//import './assets/theme/theme-green/index.css'
import VueRouter from 'vue-router'
import store from './vuex/store'
@@ -10,8 +12,9 @@ import Vuex from 'vuex'
//import NProgress from 'nprogress'
//import 'nprogress/nprogress.css'
import routes from './routes'
import Mock from './mock'
Mock.bootstrap();
// import Mock from './mock'
//
// Mock.bootstrap();
import 'font-awesome/css/font-awesome.min.css'
Vue.config.devtools = true;
Vue.use(ElementUI)
src/mock/mock.js
+154 -154
View File
@@ -1,154 +1,154 @@
import axios from 'axios';
import MockAdapter from 'axios-mock-adapter';
import { LoginUsers, Users } from './data/user';
let _Users = Users;
export default {
/**
* mock bootstrap
*/
bootstrap() {
let mock = new MockAdapter(axios);
// mock success request
mock.onGet('/success').reply(200, {
msg: 'success'
});
// mock error request
mock.onGet('/error').reply(500, {
msg: 'failure'
});
//登录
mock.onPost('/login').reply(config => {
let {username, password} = JSON.parse(config.data);
return new Promise((resolve, reject) => {
let user = null;
setTimeout(() => {
let hasUser = LoginUsers.some(u => {
if (u.username === username && u.password === password) {
user = JSON.parse(JSON.stringify(u));
user.password = undefined;
return true;
}
});
if (hasUser) {
resolve([200, { code: 200, msg: '请求成功', user }]);
} else {
resolve([200, { code: 500, msg: '账号或密码错误' }]);
}
}, 1000);
});
});
//获取用户列表
mock.onGet('/user/list').reply(config => {
let {name} = config.params;
let mockUsers = _Users.filter(user => {
if (name && user.name.indexOf(name) == -1) return false;
return true;
});
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve([200, {
users: mockUsers
}]);
}, 1000);
});
});
//获取用户列表（分页）
mock.onGet('/user/listpage').reply(config => {
let {page, name} = config.params;
let mockUsers = _Users.filter(user => {
if (name && user.name.indexOf(name) == -1) return false;
return true;
});
let total = mockUsers.length;
mockUsers = mockUsers.filter((u, index) => index < 20 * page && index >= 20 * (page - 1));
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve([200, {
total: total,
users: mockUsers
}]);
}, 1000);
});
});
//删除用户
mock.onGet('/user/remove').reply(config => {
let { id } = config.params;
_Users = _Users.filter(u => u.id !== id);
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve([200, {
code: 200,
msg: '删除成功'
}]);
}, 500);
});
});
//批量删除用户
mock.onGet('/user/batchremove').reply(config => {
let { ids } = config.params;
ids = ids.split(',');
_Users = _Users.filter(u => !ids.includes(u.id));
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve([200, {
code: 200,
msg: '删除成功'
}]);
}, 500);
});
});
//编辑用户
mock.onGet('/user/edit').reply(config => {
let { id, name, addr, age, birth, sex } = config.params;
_Users.some(u => {
if (u.id === id) {
u.name = name;
u.addr = addr;
u.age = age;
u.birth = birth;
u.sex = sex;
return true;
}
});
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve([200, {
code: 200,
msg: '编辑成功'
}]);
}, 500);
});
});
//新增用户
mock.onGet('/user/add').reply(config => {
let { name, addr, age, birth, sex } = config.params;
_Users.push({
name: name,
addr: addr,
age: age,
birth: birth,
sex: sex
});
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve([200, {
code: 200,
msg: '新增成功'
}]);
}, 500);
});
});
}
};
// import axios from 'axios';
// import MockAdapter from 'axios-mock-adapter';
// import { LoginUsers, Users } from './data/user';
// let _Users = Users;
//
// export default {
// /**
// * mock bootstrap
// */
// bootstrap() {
// let mock = new MockAdapter(axios);
//
// // mock success request
// mock.onGet('/success').reply(200, {
// msg: 'success'
// });
//
// // mock error request
// mock.onGet('/error').reply(500, {
// msg: 'failure'
// });
//
// //登录
// mock.onPost('/login').reply(config => {
// let {username, password} = JSON.parse(config.data);
// return new Promise((resolve, reject) => {
// let user = null;
// setTimeout(() => {
// let hasUser = LoginUsers.some(u => {
// if (u.username === username && u.password === password) {
// user = JSON.parse(JSON.stringify(u));
// user.password = undefined;
// return true;
// }
// });
//
// if (hasUser) {
// resolve([200, { code: 200, msg: '请求成功', user }]);
// } else {
// resolve([200, { code: 500, msg: '账号或密码错误' }]);
// }
// }, 1000);
// });
// });
//
// //获取用户列表
// mock.onGet('/user/list').reply(config => {
// let {name} = config.params;
// let mockUsers = _Users.filter(user => {
// if (name && user.name.indexOf(name) == -1) return false;
// return true;
// });
// return new Promise((resolve, reject) => {
// setTimeout(() => {
// resolve([200, {
// users: mockUsers
// }]);
// }, 1000);
// });
// });
//
// //获取用户列表（分页）
// mock.onGet('/user/listpage').reply(config => {
// let {page, name} = config.params;
// let mockUsers = _Users.filter(user => {
// if (name && user.name.indexOf(name) == -1) return false;
// return true;
// });
// let total = mockUsers.length;
// mockUsers = mockUsers.filter((u, index) => index < 20 * page && index >= 20 * (page - 1));
// return new Promise((resolve, reject) => {
// setTimeout(() => {
// resolve([200, {
// total: total,
// users: mockUsers
// }]);
// }, 1000);
// });
// });
//
// //删除用户
// mock.onGet('/user/remove').reply(config => {
// let { id } = config.params;
// _Users = _Users.filter(u => u.id !== id);
// return new Promise((resolve, reject) => {
// setTimeout(() => {
// resolve([200, {
// code: 200,
// msg: '删除成功'
// }]);
// }, 500);
// });
// });
//
// //批量删除用户
// mock.onGet('/user/batchremove').reply(config => {
// let { ids } = config.params;
// ids = ids.split(',');
// _Users = _Users.filter(u => !ids.includes(u.id));
// return new Promise((resolve, reject) => {
// setTimeout(() => {
// resolve([200, {
// code: 200,
// msg: '删除成功'
// }]);
// }, 500);
// });
// });
//
// //编辑用户
// mock.onGet('/user/edit').reply(config => {
// let { id, name, addr, age, birth, sex } = config.params;
// _Users.some(u => {
// if (u.id === id) {
// u.name = name;
// u.addr = addr;
// u.age = age;
// u.birth = birth;
// u.sex = sex;
// return true;
// }
// });
// return new Promise((resolve, reject) => {
// setTimeout(() => {
// resolve([200, {
// code: 200,
// msg: '编辑成功'
// }]);
// }, 500);
// });
// });
//
// //新增用户
// mock.onGet('/user/add').reply(config => {
// let { name, addr, age, birth, sex } = config.params;
// _Users.push({
// name: name,
// addr: addr,
// age: age,
// birth: birth,
// sex: sex
// });
// return new Promise((resolve, reject) => {
// setTimeout(() => {
// resolve([200, {
// code: 200,
// msg: '新增成功'
// }]);
// }, 500);
// });
// });
//
// }
// };
src/views/Login.vue
+10 -17
View File
@@ -16,12 +16,12 @@
</template>
<script>
import { requestLogin } from '../api/api';
//import NProgress from 'nprogress'
export default {
data() {
return {
logining: false,
logining:false,
ruleForm2: {
account: 'admin',
checkPass: '123456'
@@ -36,7 +36,7 @@
//{ validator: validaePass2 }
]
},
checked: true
checked: false
};
},
methods: {
@@ -51,20 +51,13 @@
this.logining = true;
//NProgress.start();
var loginParams = { username: this.ruleForm2.account, password: this.ruleForm2.checkPass };
requestLogin(loginParams).then(data => {
this.logining = false;
//NProgress.done();
let { msg, code, user } = data;
if (code !== 200) {
this.$message({
message: msg,
type: 'error'
});
} else {
sessionStorage.setItem('user', JSON.stringify(user));
this.$router.push({ path: '/table' });
}
});
this.logining = false;
var user='admin'
sessionStorage.setItem('user', JSON.stringify(user));
this.$router.push({ path: '/table' });
;//fengexian
} else {
console.log('error submit!!');
return false;
src/views/nav1/Table.vue
+123 -274
View File
@@ -1,303 +1,152 @@
<template>
<section>
<!--工具条-->
<el-col :span="24" class="toolbar" style="padding-bottom: 0px;">
<el-form :inline="true" :model="filters">
<el-form-item>
<el-input v-model="filters.name" placeholder="姓名"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" v-on:click="getUsers">查询</el-button>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="handleAdd">新增</el-button>
</el-form-item>
</el-form>
</el-col>
<!--列表-->
<el-table :data="users" highlight-current-row v-loading="listLoading" @selection-change="selsChange" style="width: 100%;">
<el-table-column type="selection" width="55">
</el-table-column>
<el-table-column type="index" width="60">
</el-table-column>
<el-table-column prop="name" label="姓名" width="120" sortable>
</el-table-column>
<el-table-column prop="sex" label="性别" width="100" :formatter="formatSex" sortable>
</el-table-column>
<el-table-column prop="age" label="年龄" width="100" sortable>
</el-table-column>
<el-table-column prop="birth" label="生日" width="120" sortable>
</el-table-column>
<el-table-column prop="addr" label="地址" min-width="180" sortable>
</el-table-column>
<el-table-column label="操作" width="150">
<template scope="scope">
<el-button size="small" @click="handleEdit(scope.$index, scope.row)">编辑</el-button>
<el-button type="danger" size="small" @click="handleDel(scope.$index, scope.row)">删除</el-button>
<el-upload
drag
accept=".csv, .txt, .xls, .xlsx"
action="/api/upload_dataset"
:limit="1"
:before-upload="beforeUpload"
:on-success="handleAvatarSuccess"
:on-error="handleError"
>
<el-button size="small" type="primary">
<span class="iconfont icon-shangchuan" />上传文件
</el-button>
</el-upload>
<span style="color: orange">上传文件仅支持 csv,txt,xls、xlsx类型</span>
<el-table :data="tableData" style="width: 100%">
<el-table-column prop="date" label="日期" width="180"></el-table-column>
<el-table-column prop="name" label="姓名" width="180"></el-table-column>
<el-table-column prop="address" label="地址" width="180"></el-table-column>
<el-table-column label="操作" width="180">
<template slot-scope="scope">
<el-button size="mini" type="danger" @click="del(scope.row, scope.$index)">删除</el-button>
</template>
</el-table-column>
</el-table-column>
<el-table-column label="数据预览" width="180">
<template slot-scope="scope">
<el-button size="mini" type="primary" @click="jump(scope.row, scope.$index)">预览</el-button>
</template>
</el-table-column>
</el-table>
<!--工具条-->
<el-col :span="24" class="toolbar">
<el-button type="danger" @click="batchRemove" :disabled="this.sels.length===0">批量删除</el-button>
<el-pagination layout="prev, pager, next" @current-change="handleCurrentChange" :page-size="20" :total="total" style="float:right;">
</el-pagination>
</el-col>
<!--编辑界面-->
<el-dialog title="编辑" v-model="editFormVisible" :close-on-click-modal="false">
<el-form :model="editForm" label-width="80px" :rules="editFormRules" ref="editForm">
<el-form-item label="姓名" prop="name">
<el-input v-model="editForm.name" auto-complete="off"></el-input>
</el-form-item>
<el-form-item label="性别">
<el-radio-group v-model="editForm.sex">
<el-radio class="radio" :label="1">男</el-radio>
<el-radio class="radio" :label="0">女</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="年龄">
<el-input-number v-model="editForm.age" :min="0" :max="200"></el-input-number>
</el-form-item>
<el-form-item label="生日">
<el-date-picker type="date" placeholder="选择日期" v-model="editForm.birth"></el-date-picker>
</el-form-item>
<el-form-item label="地址">
<el-input type="textarea" v-model="editForm.addr"></el-input>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click.native="editFormVisible = false">取消</el-button>
<el-button type="primary" @click.native="editSubmit" :loading="editLoading">提交</el-button>
</div>
</el-dialog>
<!--新增界面-->
<el-dialog title="新增" v-model="addFormVisible" :close-on-click-modal="false">
<el-form :model="addForm" label-width="80px" :rules="addFormRules" ref="addForm">
<el-form-item label="姓名" prop="name">
<el-input v-model="addForm.name" auto-complete="off"></el-input>
</el-form-item>
<el-form-item label="性别">
<el-radio-group v-model="addForm.sex">
<el-radio class="radio" :label="1">男</el-radio>
<el-radio class="radio" :label="0">女</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="年龄">
<el-input-number v-model="addForm.age" :min="0" :max="200"></el-input-number>
</el-form-item>
<el-form-item label="生日">
<el-date-picker type="date" placeholder="选择日期" v-model="addForm.birth"></el-date-picker>
</el-form-item>
<el-form-item label="地址">
<el-input type="textarea" v-model="addForm.addr"></el-input>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click.native="addFormVisible = false">取消</el-button>
<el-button type="primary" @click.native="addSubmit" :loading="addLoading">提交</el-button>
</div>
</el-dialog>
<!-- <div v-for="i in list">-->
<!-- <h1>{{i}}</h1>-->
<!-- </div>-->
</section>
</template>
<script>
import util from '../../common/js/util'
//import NProgress from 'nprogress'
import { getUserListPage, removeUser, batchRemoveUser, editUser, addUser } from '../../api/api';
import axios from 'axios';
// import { getDataList } from '../../api/api';
export default {
data() {
data(){
return {
filters: {
name: ''
},
users: [],
total: 0,
page: 1,
listLoading: false,
sels: [],//列表选中列
editFormVisible: false,//编辑界面是否显示
editLoading: false,
editFormRules: {
name: [
{ required: true, message: '请输入姓名', trigger: 'blur' }
]
},
//编辑界面数据
editForm: {
id: 0,
name: '',
sex: -1,
age: 0,
birth: '',
addr: ''
},
addFormVisible: false,//新增界面是否显示
addLoading: false,
addFormRules: {
name: [
{ required: true, message: '请输入姓名', trigger: 'blur' }
]
},
//新增界面数据
addForm: {
name: '',
sex: -1,
age: 0,
birth: '',
addr: ''
}
tableData: [],
list:"name",
}
},
methods: {
//性别显示转换
formatSex: function (row, column) {
return row.sex == 1 ? '男' : row.sex == 0 ? '女' : '未知';
},
handleCurrentChange(val) {
this.page = val;
this.getUsers();
},
//获取用户列表
getUsers() {
let para = {
page: this.page,
name: this.filters.name
};
this.listLoading = true;
//NProgress.start();
getUserListPage(para).then((res) => {
this.total = res.data.total;
this.users = res.data.users;
this.listLoading = false;
//NProgress.done();
});
},
//删除
handleDel: function (index, row) {
this.$confirm('确认删除该记录吗?', '提示', {
type: 'warning'
}).then(() => {
this.listLoading = true;
//NProgress.start();
let para = { id: row.id };
removeUser(para).then((res) => {
this.listLoading = false;
//NProgress.done();
this.$message({
message: '删除成功',
type: 'success'
});
this.getUsers();
});
}).catch(() => {
});
},
//显示编辑界面
handleEdit: function (index, row) {
this.editFormVisible = true;
this.editForm = Object.assign({}, row);
},
//显示新增界面
handleAdd: function () {
this.addFormVisible = true;
this.addForm = {
name: '',
sex: -1,
age: 0,
birth: '',
addr: ''
};
},
//编辑
editSubmit: function () {
this.$refs.editForm.validate((valid) => {
if (valid) {
this.$confirm('确认提交吗？', '提示', {}).then(() => {
this.editLoading = true;
//NProgress.start();
let para = Object.assign({}, this.editForm);
para.birth = (!para.birth || para.birth == '') ? '' : util.formatDate.format(new Date(para.birth), 'yyyy-MM-dd');
editUser(para).then((res) => {
this.editLoading = false;
//NProgress.done();
this.$message({
message: '提交成功',
type: 'success'
});
this.$refs['editForm'].resetFields();
this.editFormVisible = false;
this.getUsers();
});
});
}
});
},
//新增
addSubmit: function () {
this.$refs.addForm.validate((valid) => {
if (valid) {
this.$confirm('确认提交吗？', '提示', {}).then(() => {
this.addLoading = true;
//NProgress.start();
let para = Object.assign({}, this.addForm);
para.birth = (!para.birth || para.birth == '') ? '' : util.formatDate.format(new Date(para.birth), 'yyyy-MM-dd');
addUser(para).then((res) => {
this.addLoading = false;
//NProgress.done();
this.$message({
message: '提交成功',
type: 'success'
});
this.$refs['addForm'].resetFields();
this.addFormVisible = false;
this.getUsers();
});
});
}
});
},
selsChange: function (sels) {
this.sels = sels;
},
//批量删除
batchRemove: function () {
var ids = this.sels.map(item => item.id).toString();
this.$confirm('确认删除选中记录吗？', '提示', {
type: 'warning'
}).then(() => {
this.listLoading = true;
//NProgress.start();
let para = { ids: ids };
batchRemoveUser(para).then((res) => {
this.listLoading = false;
//NProgress.done();
this.$message({
message: '删除成功',
type: 'success'
});
this.getUsers();
});
}).catch(() => {
mounted () {
});
var body=this.data_list()
console.log(body)
},
inject:['reload'],
methods:{
//获取用户的所有数据集
data_list(){
axios.get('/api/get_data_list')
.then((response)=>{
for (var dataset of response.data.data){
this.tableData.push({
date:2,
name:dataset,
address:dataset
})}
})
},
//文件上传检验
beforeUpload(file) {
const fileSuffix = file.name.substring(file.name.lastIndexOf(".") + 1);
const whiteList = ["csv","txt","xls", "xlsx"];
if (whiteList.indexOf(fileSuffix) === -1) {
this.$message("上传文件只能是 csv、txt、xls、xlsx格式", "error");
return false;
}
const isLt10M = file.size / 1024 / 1024 < 10;
if (!isLt10M) {
this.$message("上传文件大小不能超过 15MB", "error");
return false;
}
},
//上传成功回调
handleAvatarSuccess(response, file,fileList) {
console.log("上传成功!")
this.$message("上传成功!",'info')
//清空上传列表
this.reload()
},
//上传失败回调
handleError(err, file, fileList) {
console.log("上传失败")
var message = err.message
var body = message.substring(4, message.length)
var erro = JSON.parse(body)
console.log(erro)
this.$message("上传失败! " + erro.msg, 'warning')
},
//删除指定数据集文件
del(row,i){
console.log(row.name,i)
axios.post('/api/del_dataset',{
username:"admin",
dataset_name:row.name
}).then((response)=> {
console.log("查看返回值:",response.data)
var body=response.data
if (body.code==200)
this.$message("删除成功","info")
else
this.$message("删除失败","error")
this.reload()
}
)
},
//跳转到数据预览页面
jump(dataset_name){
this.$router.push({ path: '/user' });
}
},
mounted() {
this.getUsers();
}
}
</script>
<style scoped>
.el-col {
border-radius: 4px;
}
</style>
src/views/nav1/user.vue
+78 -46
View File
@@ -2,72 +2,104 @@
<section>
<!--工具条-->
<el-col :span="24" class="toolbar" style="padding-bottom: 0px;">
<el-form :inline="true" :model="filters">
<el-form-item>
<el-input v-model="filters.name" placeholder="姓名"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" v-on:click="getUser">查询</el-button>
</el-form-item>
</el-form>
<el-select v-model="value" placeholder="请选择">
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
<el-button type="primary" @click="show_dataset">查看</el-button>
</el-col>
<!--列表-->
<template>
<el-table :data="users" highlight-current-row v-loading="loading" style="width: 100%;">
<el-table-column type="index" width="60">
</el-table-column>
<el-table-column prop="name" label="姓名" width="120" sortable>
</el-table-column>
<el-table-column prop="sex" label="性别" width="100" :formatter="formatSex" sortable>
</el-table-column>
<el-table-column prop="age" label="年龄" width="100" sortable>
</el-table-column>
<el-table-column prop="birth" label="生日" width="120" sortable>
</el-table-column>
<el-table-column prop="addr" label="地址" min-width="180" sortable>
</el-table-column>
</el-table>
<el-table class="tb-edit" highlight-current-row :data="tableData" style="width: 100%">
<template v-for="(col ,index) in cols">
<el-table-column v-if="col.type==='sort'" :prop="col.prop" sortable :label="col.label">
</el-table-column>
</template>
</el-table>
</template>
</section>
</template>
<script>
import { getUserList } from '../../api/api';
import axios from 'axios'
import Table from './Table.vue'
//import NProgress from 'nprogress'
export default {
data() {
return {
filters: {
name: ''
},
loading: false,
users: [
]
options:[],
value:"",
cols: [],
tableData: []
}
},
inject:['reload'],
mounted() {
this.get_datasets()
},
methods: {
//性别显示转换
formatSex: function (row, column) {
return row.sex == 1 ? '男' : row.sex == 0 ? '女' : '未知';
get_datasets(){
axios.get('/api/get_data_list')
.then((response)=>{
for (var dataset of response.data.data){
this.options.push({
label:dataset,
value:dataset
})
}
})
},
//获取用户列表
getUser: function () {
let para = {
name: this.filters.name
};
this.loading = true;
//NProgress.start();
getUserList(para).then((res) => {
this.users = res.data.users;
this.loading = false;
//NProgress.done();
});
show_dataset(){
this.cols=[]
this.tableData=[]
axios.get('api/show_dataset?dataset_name='+this.value)
.then((response)=>{
var body=response.data
var body_data= response.data.data
var columns=body_data.cols
console.log(body)
//添加表头
for (var column of columns){
this.cols.push({
label:column,
prop:column,
type:"sort"
})
}
//计算数据长度，循环添加
console.log(columns,columns[0])
console.log(body_data)
var data_length=body_data[columns[0]].length
for(var i=0;i<data_length;i++){
//按行添加
var row={}
for(var column of columns){
row[column]=body_data[column][i]
}
console.log(row)
this.tableData.push(row)
}
})
}
},
mounted() {
this.getUser();
}
};
</script>
vue_study.md
+158
View File
@@ -0,0 +1,158 @@
# 1、循环v-for
## 1.1 循环数组
```vue
<div id="app">
<ol>
<li v-for="site in sites">
{{ site.name }}
</li>
</ol>
</div>
<script>
new Vue({
el: '#app',
data: {
sites: [
{ name: 'Runoob' },
{ name: 'Google' },
{ name: 'Taobao' }
]
}
})
</script>
```
## 1.2 迭代对象
主要三种方法迭代
- 迭代对象中的value `value in opject`
- 迭代对象中的key,value `(value,key) in object`
- 迭代对象中的key,value,index `(value,key,index) in object`
```vue
<div id="app">
<ul>
<li v-for="value in object">
{{ value }}
</li>
</ul>
</div>
<script>
new Vue({
el: '#app',
data: {
object: {
name: '菜鸟教程',
url: 'http://www.runoob.com',
slogan: '学的不仅是技术，更是梦想！'
}
}
})
</script>
```
# 2、监听属性watch
通过wacth响应数据变化。$watch是一个实例化的对象，通过两个参数`监听的变量，变量数据改变的回调函数`
- 实例
data 属性中， kilometers 和 meters 初始值都为 0。watch 对象创建了两个方法 kilometers 和 meters。
当我们再输入框输入数据时，watch 会实时监听数据变化并改变自身的值
```vue
<div id = "computed_props">
千米 : <input type = "text" v-model = "kilometers">
米 : <input type = "text" v-model = "meters">
</div>
<p id="info"></p>
<script type = "text/javascript">
var vm = new Vue({
el: '#computed_props',
data: {
kilometers : 0,
meters:0
},
methods: {
},
computed :{
},
watch : {
kilometers:function(val) {
this.kilometers = val;
this.meters = this.kilometers * 1000
},
meters : function (val) {
this.kilometers = val/ 1000;
this.meters = val;
}
}
});
// $watch 是一个实例方法
vm.$watch('kilometers', function (newValue, oldValue) {
// 这个回调将在 vm.kilometers 改变后调用
document.getElementById ("info").innerHTML = "修改前值为: " + oldValue + "，修改后值为: " + newValue;
})
</script>
```
# 3、表单
## 3.1 v-model
修饰符
- .lazy
.lazy在默认情况下， v-model 在 input 事件中同步输入框的值与数据，但你可以添加一个修饰符 lazy ，从而转变为在 change 事件中同步：
- .number
如果想自动将用户的输入值转为 Number 类型（如果原值的转换结果为 NaN 则返回原值），可以添加一个修饰符 number 给 v-model 来处理输入值：
`<input v-model.number="age" type="number">`
- .trim
如果要自动过滤用户输入的首尾空格，可以添加 trim 修饰符到 v-model 上过滤输入：
`<input v-model.trim="msg">`
# 4、Element UI
## 4.1 表格el_table
当`el-table`元素中注入`data`对象数组后，
在`el-table-column`中用`prop`属性来对应对象中的键名即可填入数据，用`label`属性来定义表格的列名。可以使用`width`属性来定义列宽。
## 4.2 文件上传按钮el-upload
#### ①基本操作
```html
<el-upload :action="uploadActionUrl">
<el-button size="small" type="primary">点击上传</el-button>
</el-upload>
```
`:action`是执行上传动作的后台接口
`el-button`是触发上传的按钮
#### ②文件上传数量限制
```html
<el-upload
:action="uploadActionUrl"
multiple
:limit="3"
:on-exceed="handleExceed">
<el-button size="small" type="primary">点击上传</el-button>
</el-upload>
```
`multiple`设置是否同时选中多个文件
`:limit` 设置最多上传文件数量
`on-exceed` 绑定方法处理超出数量后的动作
#### 上传格式+大小限制
```html
<el-upload
:action="uploadActionUrl"
accept="image/jpeg,image/gif,image/png"
:before-upload="onBeforeUpload"
multiple
:limit="3"
:on-exceed="handleExceed">
<el-button size="small" type="primary">点击上传</el-button>
<div slot="tip" class="el-upload__tip">请上传图片格式文件</div>
</el-upload>
```
---
## 附录 排除记录
1、axios请求后端接口（代理已配置无误）前端报错
原因：使用mock会拦截所有的ajax请求，因此浏览器无法从后端服务器找到路径
2、vue在页面加载时this显示为空
- 原因：混合使用了普通函数和箭头函数（具体错误原因在axios的回调函数中使用了箭头函数）使得this的指向发生了变化
- 解决方法：将回调函数以匿名函数的形式使用，methods中尽量通过普通函数定义，避免箭头函数的使用