Browse Source

修改, 优化,兼容移动端

master
wen 2 years ago
parent
commit
29c271ec1a
  1. 8
      src/layout/index.vue
  2. 1
      src/layout/mixin/ResizeHandler.js
  3. 2
      src/router/index.js
  4. 6
      src/styles/element-ui.scss
  5. 4
      src/styles/publics.scss
  6. 2
      src/utils/get-page-title.js
  7. 9
      src/views/filemange/index.vue
  8. 3
      src/views/login/index.vue
  9. 75
      src/views/subfile/index.vue

8
src/layout/index.vue

@ -4,14 +4,14 @@ @@ -4,14 +4,14 @@
<a class="leftk" href="javascript:;">
<img src="../common/img/jialuoma.png" alt="图片">
<em class="erectline"></em>
<span>后台管理系统</span>
<span>文件后台管理系统</span>
</a>
<div class="rightk tpriht">
<a class="avatark" href="javascript:;" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
<!-- <a class="avatark" href="javascript:;" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
<img class="mailtp verMiddle" src="../common/img/jialuoma.png" alt="图片">
</a>
<em class="erectline"></em>
</a> -->
<!-- <em class="erectline"></em> -->
<!-- <a class="Cache tuichu" href="/admin.php/Cache/index.html">清除缓存</a> -->
<el-button class="quit" @click.native="logout" id="tuichu" size="mini" round>退出</el-button>
</div>

1
src/layout/mixin/ResizeHandler.js

@ -19,6 +19,7 @@ export default { @@ -19,6 +19,7 @@ export default {
},
mounted() {
const isMobile = this.$_isMobile()
if (isMobile) {
store.dispatch('app/toggleDevice', 'mobile')
store.dispatch('app/closeSideBar', { withoutAnimation: true })

2
src/router/index.js

@ -64,7 +64,7 @@ export const constantRoutes = [ @@ -64,7 +64,7 @@ export const constantRoutes = [
path: 'index',
name: 'Filemange',
component: () => import('@/views/filemange/index'),
meta: { title: '', icon: 'dashboard' }
meta: { title: '文件管理', icon: 'dashboard' }
},
{
path: 'subfile',

6
src/styles/element-ui.scss

@ -52,3 +52,9 @@ @@ -52,3 +52,9 @@
.el-message{z-index:6000 !important;}
.content_main .el-drawer__wrapper{z-index:2200 !important;}
#nprogress .bar{background:#409EFF !important;}
// 如果是移动端
@media (max-width: 990px) {
.el-dialog{width:80%;}
}

4
src/styles/publics.scss

@ -1,7 +1,7 @@ @@ -1,7 +1,7 @@
.toptitle {
color: #FFF;
height: 91px;
padding: 0 6% 0 36px;
padding: 0 2% 0 2%;
z-index: 2005;
background-color: #2b3245;
position: fixed;
@ -35,7 +35,7 @@ @@ -35,7 +35,7 @@
.toptitle .rightk {
float: right;
margin-top: 18px;
margin-top: 32px;
position: relative;
}

2
src/utils/get-page-title.js

@ -4,7 +4,7 @@ const title = defaultSettings.title || '嘉洛马' @@ -4,7 +4,7 @@ const title = defaultSettings.title || '嘉洛马'
export default function getPageTitle(pageTitle) {
if (pageTitle) {
return `${pageTitle} - ${title}`
return `${title} - ${pageTitle}`
}
return `${title}`
}

9
src/views/filemange/index.vue

@ -10,7 +10,7 @@ @@ -10,7 +10,7 @@
<el-table
:data="dirdata"
empty-text="暂无文件夹数据"
border
:row-style="{'background-color':'#fffdfa'}"
style="width: 100%" class="filesmd verleft">
<!-- <el-table-column
align="center"
@ -29,7 +29,7 @@ @@ -29,7 +29,7 @@
width="auto">
<template slot-scope="scope">
<div class="type_file_click">
<el-tooltip content="进入子目录" placement="bottom-start" effect="light">
<el-tooltip content="进入子文件夹" placement="bottom-start" effect="light">
<a :href="'#/filemange/subfile?id='+scope.row.id">
<!-- <el-button type="warning" icon="el-icon-notebook-1">{{scope.row.name}}</el-button> -->
<img src="../../common/img/file.png" alt="图片"/>
@ -42,7 +42,7 @@ @@ -42,7 +42,7 @@
</el-table-column>
<el-table-column
align="center"
align="left"
label="操作"
width="auto">
<template slot-scope="scope">
@ -386,10 +386,9 @@ methods: { @@ -386,10 +386,9 @@ methods: {
.sou_bottom{margin-left:10px;}
.use_button{margin:15px 0 16px 0;}
// .use_button>button{margin:0 10px 10px 0;}
.file_caozuo2>button{margin-top:6px;}
.file_caozuo2>button{margin:6px 10px 0 0;}
.el-table td{padding:9px 0}
.folder_bottom a{margin:0 6px;}
.el-table__body-wrapper img{width:100px;height:71px;}
.el-drawer__body{text-align:center;padding:0 10% 20px 10%;}
.request_main{text-align:center;margin:12px 0;}
.addimgtext{line-height:25px;display:inline-block;color:#8c939d;vertical-align: middle;}

3
src/views/login/index.vue

@ -7,7 +7,7 @@ @@ -7,7 +7,7 @@
<span>后台管理系统</span>
</a>
</div>
<el-form ref="loginForm" :model="loginForm" :rules="loginRules" class="login-form" auto-complete="on" label-position="left">
<el-form ref="loginForm" @keyup.enter.native="handleLogin" :model="loginForm" :rules="loginRules" class="login-form" auto-complete="on" label-position="left">
<div class="title-container">
<h3 class="title">系统登入</h3>
@ -41,7 +41,6 @@ @@ -41,7 +41,6 @@
name="密码"
tabindex="2"
auto-complete="on"
@keyup.enter.native="handleLogin"
/>
<span class="show-pwd" @click="showPwd">
<svg-icon :icon-class="passwordType === 'password' ? 'eye' : 'eye-open'" />

75
src/views/subfile/index.vue

@ -1,18 +1,5 @@ @@ -1,18 +1,5 @@
<template>
<div class="subfile_main" v-loading="subloading" element-loading-text="数据加载中...">
<!-- <div class="block">
<el-date-picker
v-model="value2"
type="daterange"
align="right"
unlink-panels
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
:picker-options="pickerOptions">
</el-date-picker>
<el-button class="sou_bottom" type="primary" icon="el-icon-search">搜索</el-button>
</div> -->
<div>
<!-- 目录数据列表 -->
<!-- <div class="folder_bottom">
@ -27,13 +14,13 @@ @@ -27,13 +14,13 @@
<el-button type="primary" @click="uploadDrawer = true">上传<i class="el-icon-upload el-icon--right"></i></el-button>
</div>
<div v-on:click="fileTableMClick">
<div v-on:click.stop="fileTableMClick">
<!-- 子目录数据列表 如果不需要显示空数据提示可以用css隐藏-->
<el-table
:data="dirdata"
empty-text="暂无文件夹数据"
border
style="width: 100%" class="filesmd">
:row-style="{'background-color':'#fffdfa'}"
style="width:100%;" class="filesmd">
<!-- <el-table-column
align="center"
prop="date"
@ -51,7 +38,7 @@ @@ -51,7 +38,7 @@
width="auto">
<template slot-scope="scope">
<div class="type_file_click">
<a title="点击进入子目录" :href="'#/filemange/subfile?id='+scope.row.id">
<a title="点击进入子文件夹" :href="'#/filemange/subfile?id='+scope.row.id">
<!-- <el-button type="warning" icon="el-icon-notebook-1">{{scope.row.name}}</el-button> -->
<img src="../../common/img/file.png" alt="图片"/>
</a>
@ -60,7 +47,7 @@ @@ -60,7 +47,7 @@
</el-table-column>
<el-table-column
align="center"
align="left"
label="操作"
width="auto">
<template slot-scope="scope">
@ -82,8 +69,7 @@ @@ -82,8 +69,7 @@
:show-header="false"
empty-text="暂无文件数据"
:data="tableData"
border
style="width: 100%;">
style="width:100%;">
<!-- <el-table-column
align="center"
@ -108,7 +94,7 @@ @@ -108,7 +94,7 @@
</el-table-column>
<el-table-column
align="center"
align="left"
label="操作">
<template slot-scope="scope">
<div class="file_caozuo">
@ -189,7 +175,7 @@ @@ -189,7 +175,7 @@
:on-preview="handlePictureCardPreview"
:disabled="false"
:file-list="uploadFilelist"
accept=".jpg, .jpeg, .png, .gif, webp"
accept=".jpg, .jpeg, .png, .gif, .webp, .mp4, .txt"
:auto-upload="false">
<i slot="default" class="el-icon-plus"></i>
<span class="addimgtext">添加照片</span>
@ -241,37 +227,9 @@ export default { @@ -241,37 +227,9 @@ export default {
// },
data() {
return {
//
// pickerOptions: {
// shortcuts: [{
// text: '',
// onClick(picker) {
// const end = new Date();
// const start = new Date();
// start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
// picker.$emit('pick', [start, end]);
// }
// }, {
// text: '',
// onClick(picker) {
// const end = new Date();
// const start = new Date();
// start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
// picker.$emit('pick', [start, end]);
// }
// }, {
// text: '',
// onClick(picker) {
// const end = new Date();
// const start = new Date();
// start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
// picker.$emit('pick', [start, end]);
// }
// }]
// },
// value2: '',
//
imgurl:process.env.VUE_APP_IMG_URL,
//haveRealpath: 0,
//
tableData: [],
@ -334,6 +292,7 @@ export default { @@ -334,6 +292,7 @@ export default {
},
uploadLoad: false
};
},
methods: {
//
@ -478,7 +437,12 @@ export default { @@ -478,7 +437,12 @@ export default {
this.imgUploadData.parent = maindata.realpath; //
this.movefileform.from = maindata.realpath; //
//console.log(this.movefileform.from);
this.subloading = false;
//console.log(this.$el.textContent) // => ''
this.$nextTick(function () {
//console.log(this.$el.textContent) // => ''
this.subloading = false;
})
}
}).catch(error => {
requesterr(this, error);
@ -658,6 +622,7 @@ export default { @@ -658,6 +622,7 @@ export default {
fileTableMClick(e) {
let dangQian = e.target, labelname = dangQian.tagName.toLowerCase(), chufazhe = e.currentTarget; //currentTarget
let getbutton = dangQian, objmark = null;
if (labelname == 'span') {
//console.log(dangQian.parentNode);
getbutton = dangQian.parentNode;
@ -712,10 +677,10 @@ export default { @@ -712,10 +677,10 @@ export default {
.sou_bottom{margin-left:10px;}
.use_button{margin:15px 0 16px 0;}
// .use_button>button{margin:0 10px 10px 0;}
.file_caozuo2>button{margin-top:6px;}
.file_caozuo2>button{margin:6px 10px 0 0;}
.el-table td{padding:9px 0}
.folder_bottom a{margin:0 6px;}
.el-table__body-wrapper img{width:100px;height:71px;}
.el-table__body-wrapper img{max-width:66%;max-height:286px;}
.el-drawer__body{text-align:center;padding:0 10% 20px 10%;}
.request_main{text-align:center;margin:12px 0;}
.addimgtext{line-height:25px;display:inline-block;color:#8c939d;vertical-align: middle;}

Loading…
Cancel
Save