Commit b34a6f3f by dongjipeng

搭建项目基本模块

parents
> 1%
last 2 versions
[*.{js,jsx,ts,tsx,vue}]
indent_style = space
indent_size = 2
trim_trailing_whitespace = true
insert_final_newline = true
module.exports = {
root: true,
env: {
node: true
},
'extends': [
'plugin:vue/essential',
'@vue/standard'
],
rules: {
'no-console': process.env.NODE_ENV === 'production' ? 'error' : 'off',
'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off'
},
parserOptions: {
parser: 'babel-eslint'
}
}
.DS_Store
node_modules
/dist
# local env files
.env.local
.env.*.local
# Log files
npm-debug.log*
yarn-debug.log*
yarn-error.log*
# Editor directories and files
.idea
.vscode
*.suo
*.ntvs*
*.njsproj
*.sln
*.sw?
# element-pro
## Project setup
```
npm install
```
### Compiles and hot-reloads for development
```
npm run serve
```
### Compiles and minifies for production
```
npm run build
```
### Run your tests
```
npm run test
```
### Lints and fixes files
```
npm run lint
```
### Customize configuration
See [Configuration Reference](https://cli.vuejs.org/config/).
module.exports = {
presets: [
'@vue/app'
]
}
This source diff could not be displayed because it is too large. You can view the blob instead.
{
"name": "element-pro",
"version": "0.1.0",
"private": true,
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build",
"lint": "vue-cli-service lint"
},
"dependencies": {
"core-js": "^2.6.5",
"element-theme": "^2.0.1",
"element-ui": "^2.4.11",
"vue": "^2.6.10",
"vue-quill-editor": "^3.0.6",
"vue-router": "^3.0.3",
"vuex": "^3.0.1"
},
"devDependencies": {
"@vue/cli-plugin-babel": "^3.8.0",
"@vue/cli-plugin-eslint": "^3.8.0",
"@vue/cli-service": "^3.8.0",
"@vue/eslint-config-standard": "^4.0.0",
"babel-eslint": "^10.0.1",
"element-theme-chalk": "^2.10.1",
"eslint": "^5.16.0",
"eslint-plugin-vue": "^5.0.0",
"less": "^3.0.4",
"less-loader": "^4.1.0",
"vue-template-compiler": "^2.6.10"
}
}
module.exports = {
plugins: {
autoprefixer: {}
}
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
<title>element-pro</title>
<!--引入百度地图API-->
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=G26QdFgDIQjncc5YduSk2WWo8XE5kMpu" ></script>
</head>
<body>
<noscript>
<strong>We're sorry but element-pro doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
</noscript>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
</html>
<template>
<div class="content">
<keep-alive >
<router-view v-if="!$route.meta.keepAlive"></router-view>
</keep-alive>
<router-view v-if="$route.meta.keepAlive"></router-view>
</div>
</template>
<script>
export default {
name: 'app'
}
</script>
<style lang="less">
</style>
.content {width: 100%; height: 100%}
.img-warp {overflow: hidden; position: relative;
img {width: 100%; height: auto; max-height: 100%}
}
/*
element ui样式重置
*/
.el-table__body tr:hover>td {background-color: #ffffff !important}
html, body {width: 100%; height: 100%}
html, body, ul, li, ol, dl, dd, dt, p, h1, h2, h3, h4, h5, h6, form, fieldset, legend, img { margin:0; padding:0; }
fieldset, img { border:none; }
img{display: block;}
address, caption, cite, code, dfn, th, var { font-style:normal; font-weight:normal; }
ul, ol { list-style:none; }
input { padding-top:0; padding-bottom:0; font-family: "SimSun","宋体";}
input::-moz-focus-inner { border:none; padding:0; }
select, input { vertical-align:middle; }
select, input, textarea { font-size:12px; margin:0; }
input[type="text"], input[type="password"], textarea { outline-style:none; -webkit-appearance:none; }
textarea { resize:none; }
input,textarea{background: none; border: none;}
table { border-collapse:collapse; }
body { width: 100%; margin: 0 auto; color:#333; background:#fff; }
html, select, input, textarea {font-family: "FZLanTingHei-L-GBK", "Helvetica Neue", "微软雅黑", "黑体", Helvetica, STHeiTi, sans-serif;-webkit-tap-highlight-color:rgba(0, 0, 0, 0);}
a { color:#666; text-decoration:none; }
a:visited { color:#1a1a1a; }
a:hover, a:active, a:focus {text-decoration:none; }
i, em, b {font-style: normal}
button {outline: none; border: none; background: transparent; cursor: pointer}
/*placeholder*/
::-webkit-input-placeholder {
color: #999;
font-size: 14px;
}
::-moz-placeholder {
color: #999;
font-size: 14px;
}
:-ms-input-placeholder {
color: #999;
font-size: 14px;
}
/*common*/
.link {color: #409EFF !important; text-decoration: underline; font-size: 12px}
/* align */
.tc {text-align: center}
.tl {text-align: left}
.tr {text-align: right}
/* margin */
.mt10 {margin-top: 10px;}
.mt30 {margin-top: 30px;}
.mt50 {margin-top: 50px;}
.mb10 {margin-bottom: 10px;}
.mb15 {margin-bottom: 15px;}
.mb20 {margin-bottom: 20px;}
.mb30 {margin-bottom: 30px;}
.mr30 {margin-right: 30px;}
.ml30 {margin-left: 30px;}
/*padding*/
.pl20 {padding-left: 30px}
<template>
<div class="header">
<div class="header_inner">
<h2>华夏幸福+ 平台管理系统</h2>
<ul>
<li><a href="">郭玉洁</a></li>
<li class="exit_app"><a href="">退出登录</a></li>
<li class="change_pwd"><a href="">修改密码</a></li>
</ul>
</div>
</div>
</template>
<script>
export default {
name: 'Header'
}
</script>
<style scoped lang="less">
.header {
height: 70px!important;
padding: 0 17px;
background: #314057;
box-sizing: border-box;
position: fixed;
z-index: 99;
width: 100%;
left: 0;
top: 0;
.header_inner {display: flex; align-items: center; justify-content: space-between; height: 100%; color: #FEFEFE;
h2 {font-size: 22px; font-weight: normal; padding-left: 100px; color: #ddd}
ul {float: right;
li {display: inline-block; vertical-align: middle; font-size: 14px; position: relative; padding: 0 15px;
a { color: #ddd;
}
&.change_pwd {
&:after {
content: "";
display: block;
width: 1px;
height: 12px;
background-color: #ffffff;
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
}
}
}
}
}
}
</style>
<template>
<div class="hello">
<h1>{{ msg }}</h1>
<p>
For a guide and recipes on how to configure / customize this project,<br>
check out the
<a href="https://cli.vuejs.org" target="_blank" rel="noopener">vue-cli documentation</a>.
</p>
<h3>Installed CLI Plugins</h3>
<ul>
<li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-babel" target="_blank" rel="noopener">babel</a></li>
<li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-eslint" target="_blank" rel="noopener">eslint</a></li>
</ul>
<h3>Essential Links</h3>
<ul>
<li><a href="https://vuejs.org" target="_blank" rel="noopener">Core Docs</a></li>
<li><a href="https://forum.vuejs.org" target="_blank" rel="noopener">Forum</a></li>
<li><a href="https://chat.vuejs.org" target="_blank" rel="noopener">Community Chat</a></li>
<li><a href="https://twitter.com/vuejs" target="_blank" rel="noopener">Twitter</a></li>
<li><a href="https://news.vuejs.org" target="_blank" rel="noopener">News</a></li>
</ul>
<h3>Ecosystem</h3>
<ul>
<li><a href="https://router.vuejs.org" target="_blank" rel="noopener">vue-router</a></li>
<li><a href="https://vuex.vuejs.org" target="_blank" rel="noopener">vuex</a></li>
<li><a href="https://github.com/vuejs/vue-devtools#vue-devtools" target="_blank" rel="noopener">vue-devtools</a></li>
<li><a href="https://vue-loader.vuejs.org" target="_blank" rel="noopener">vue-loader</a></li>
<li><a href="https://github.com/vuejs/awesome-vue" target="_blank" rel="noopener">awesome-vue</a></li>
</ul>
</div>
</template>
<script>
export default {
name: 'HelloWorld',
props: {
msg: String
}
}
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped lang="less">
h3 {
margin: 40px 0 0;
}
ul {
list-style-type: none;
padding: 0;
}
li {
display: inline-block;
margin: 0 10px;
}
a {
color: #42b983;
}
</style>
<template>
<el-container style="height: 100%">
<Header></Header>
<el-container class="el_content">
<el-aside width="210px">
<el-menu
menu-trigger="hover"
:default-active="$route.path"
:router="true"
style="height: 100%"
:unique-opened="true"
active-text-color="#4A90E2">
<el-submenu index="1">
<template slot="title"><i class="el-icon-message"></i>首页管理</template>
<el-menu-item index="/home/bannerManage">banner管理</el-menu-item>
<el-menu-item index="/home/activityPropaganda">活动宣传</el-menu-item>
<el-menu-item index="/home/commonLink">常用链接</el-menu-item>
<el-menu-item index="/home/messageManagement">留言管理</el-menu-item>
</el-submenu>
<el-submenu index="2">
<template slot="title"><i class="el-icon-menu"></i>幸福差旅</template>
<el-menu-item-group>
<template slot="title">分组一</template>
<el-menu-item index="2-1">选项1</el-menu-item>
<el-menu-item index="2-2">选项2</el-menu-item>
</el-menu-item-group>
<el-menu-item-group title="分组2">
<el-menu-item index="2-3">选项3</el-menu-item>
</el-menu-item-group>
<el-submenu index="2-4">
<template slot="title">选项4</template>
<el-menu-item index="2-4-1">选项4-1</el-menu-item>
</el-submenu>
</el-submenu>
<el-submenu index="3">
<template slot="title"><i class="el-icon-setting"></i>幸福洗衣</template>
<el-menu-item index="/wash/washBranches">洗衣网点</el-menu-item>
<el-menu-item index="/wash/newBranches">新增网点</el-menu-item>
<el-menu-item index="/wash/commonSense">洗衣小常识</el-menu-item>
</el-submenu>
<el-submenu index="4">
<template slot="title"><i class="el-icon-setting"></i>幸福商城</template>
<el-menu-item-group>
<template slot="title">分组一</template>
<el-menu-item index="2-1">选项1</el-menu-item>
<el-menu-item index="2-2">选项2</el-menu-item>
</el-menu-item-group>
<el-menu-item-group title="分组2">
<el-menu-item index="2-3">选项3</el-menu-item>
</el-menu-item-group>
<el-submenu index="2-4">
<template slot="title">选项4</template>
<el-menu-item index="2-4-1">选项4-1</el-menu-item>
</el-submenu>
</el-submenu>
<el-submenu index="5">
<template slot="title"><i class="el-icon-setting"></i>幸福农场</template>
<el-menu-item index="/farm/farmWonderful">农场精彩</el-menu-item>
<el-menu-item index="/farm/specialEvents">特色活动</el-menu-item>
</el-submenu>
<el-submenu index="6">
<template slot="title"><i class="el-icon-setting"></i>幸福健身</template>
<el-menu-item index="/fitness/eventCalendar">赛事日历</el-menu-item>
<el-menu-item index="/fitness/happyRunning">幸福长跑</el-menu-item>
</el-submenu>
<el-submenu index="7">
<template slot="title"><i class="el-icon-setting"></i>幸福餐厅</template>
<el-menu-item index="/restaurant/eventCalendar">全国餐厅</el-menu-item>
<el-menu-item index="/restaurant/restaurantMenus">餐厅菜单</el-menu-item>
<el-menu-item index="/restaurant/foodVideo">美食视频</el-menu-item>
<el-menu-item index="/restaurant/solarCalendar">节气日历</el-menu-item>
<el-menu-item index="/restaurant/themeActivities">主题活动</el-menu-item>
</el-submenu>
</el-menu>
</el-aside>
<el-main class="main">
<bread-crumb></bread-crumb>
<transition name="fade" mode="out-in">
<div class="main_inner">
<router-view></router-view>
</div>
</transition>
</el-main>
</el-container>
</el-container>
</template>
<script>
import Header from '../components/Header'
import BreadCrumb from '../components/breadcrumb'
export default {
name: 'layout',
created () {
this.getRouter()
},
methods: {
getRouter () {
}
},
components: {
Header,
BreadCrumb
}
}
</script>
<style scoped lang="less">
.el_content {padding-top: 70px; width: 100%; box-sizing: border-box}
.main {background: #E5E9F2;
.main_inner {padding: 20px 30px; box-sizing: border-box; background-color: #ffffff; height: calc(100% - 34px)}
}
</style>
<template>
<el-breadcrumb class="app-breadcrumb" separator-class="el-icon-arrow-right" separator="/">
<el-breadcrumb-item v-for="(item) in levelList" :key="item.path" v-if="item.meta.title">
<router-link :to="item.redirect||item.path">{{item.meta.title}}</router-link>
</el-breadcrumb-item>
</el-breadcrumb>
</template>
<script>
export default {
name: 'breadcrumb',
data () {
return {
levelList: null
}
},
methods: {
getBreadcrumb () {
let matched = this.$route.matched.filter(item => item.name)
// const first = matched[0]
// if (first && first.name !== '首页') {
// matched = [{ path: '/home', meta: { title: '首页' } }].concat(matched)
// }
this.levelList = matched
}
},
mounted () {
this.getBreadcrumb()
},
watch: {
$route (to, from) {
this.getBreadcrumb()
}
}
}
</script>
<style scoped lang="less">
.app-breadcrumb {margin-bottom: 20px}
</style>
import Vue from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'
import VueQuillEditor from 'vue-quill-editor'
import 'quill/dist/quill.core.css'
import 'quill/dist/quill.snow.css'
import 'quill/dist/quill.bubble.css'
import ElementUi from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'
import '../src/assets/css/reset.css'
import '../src/assets/css/main.less'
Vue.use(VueQuillEditor)
Vue.use(ElementUi)
Vue.config.productionTip = false
new Vue({
router,
store,
render: h => h(App)
}).$mount('#app')
import Vue from 'vue'
import Router from 'vue-router'
import Layout from './components/Layout.vue'
import Home from './views/home/index'
import BannerManage from './views/home/BannerManage'
import BannerAdd from './views/home/BannerAdd'
import ActivityPropaganda from './views/home/ActivityPropaganda'
import CommonLink from './views/home/CommonLink'
import MessageManagement from './views/home/MessageManagement'
import BannerEdit from './views/home/BannerEdit'
import TextEditing from './views/home/TextEditing'
import ArticleLink from './views/home/ArticleLink'
import Wash from './views/wash/index'
import WashBranches from './views/wash/WashBranches'
import NewBranches from './views/wash/NewBranches'
import CommonSense from './views/wash/CommonSense'
import Farm from './views/farm/index'
import FarmWonderful from './views/farm/FarmWonderful'
import SpecialEvents from './views/farm/SpecialEvents'
import Fitness from './views/fitness/index'
import EventCalendar from './views/fitness/EventCalendar'
import HappyRunning from './views/fitness/HappyRunning'
Vue.use(Router)
export default new Router({
routes: [
{
path: '/',
name: 'layout',
component: Layout,
children: [
{
path: '/home',
name: 'home',
component: Home,
meta: {
title: '首页管理'
},
children: [
{
path: '/home/bannerManage',
name: 'bannerManage',
component: BannerManage,
meta: {
title: 'banner管理'
}
},
{
path: '/home/bannerEdit',
name: 'bannerEdit',
component: BannerEdit,
meta: {
title: '编辑banner'
}
},
{
path: '/home/bannerAdd',
name: 'bannerAdd',
component: BannerAdd,
meta: {
title: '新增banner'
}
},
{
path: '/home/activityPropaganda',
name: 'activityPropaganda',
component: ActivityPropaganda,
meta: {
title: '活动宣传'
}
},
{
path: '/home/textEditing',
name: 'textEditing',
component: TextEditing,
meta: {
title: '文本编辑'
}
},
{
path: '/home/articleLink',
name: 'articleLink',
component: ArticleLink,
meta: {
title: '外链编辑'
}
},
{
path: '/home/commonLink',
name: 'commonLink',
component: CommonLink,
meta: {
title: '常用链接'
}
},
{
path: '/home/messageManagement',
name: 'messageManagement',
component: MessageManagement,
meta: {
title: '留言管理'
}
}
]
},
{
path: '/wash',
name: 'wash',
component: Wash,
meta: {
title: '幸福洗衣'
},
children: [
{
path: '/wash/washBranches',
name: 'washBranches',
component: WashBranches,
meta: {
title: '洗衣网点'
}
},
{
path: '/wash/newBranches',
name: 'newBranches',
component: NewBranches,
meta: {
title: '新增网点'
}
},
{
path: '/wash/commonSense',
name: 'commonSense',
component: CommonSense,
meta: {
title: '洗衣小常识'
}
}
]
},
{
path: '/farm',
name: 'farm',
component: Farm,
meta: {
title: '幸福农场'
},
children: [
{
path: '/farm/farmWonderful',
name: 'farmWonderful',
component: FarmWonderful,
meta: {
title: '农场精彩'
}
},
{
path: '/farm/specialEvents',
name: 'specialEvents',
component: SpecialEvents,
meta: {
title: '特色活动'
}
}
]
},
{
path: '/fitness',
name: 'fitness',
component: Fitness,
meta: {
title: '幸福健身'
},
children: [
{
path: '/fitness/eventCalendar',
name: 'eventCalendar',
component: EventCalendar,
meta: {
title: '赛事日历'
}
},
{
path: '/fitness/happyRunning',
name: 'happyRunning',
component: HappyRunning,
meta: {
title: '幸福长跑'
}
}
]
},
{
path: '/restaurant',
name: 'restaurant',
component: r => { require(['./views/restaurant/index'], r) },
meta: {
title: '幸福餐厅'
},
children: [
{
path: '/restaurant/eventCalendar',
name: 'eventCalendar',
component: r => { require(['./views/restaurant/NationalRestaurant'], r) },
meta: {
title: '全国餐厅'
}
},
{
path: '/restaurant/restaurantAdd',
name: 'restaurantAdd',
component: r => { require(['./views/restaurant/RestaurantAdd'], r) },
meta: {
title: '新增餐厅'
}
},
{
path: '/restaurant/restaurantMenus',
name: 'restaurantMenus',
component: r => { require(['./views/restaurant/RestaurantMenus'], r) },
meta: {
title: '餐厅菜单'
}
},
{
path: '/restaurant/foodVideo',
name: 'foodVideo',
component: r => { require(['./views/restaurant/FoodVideo'], r) },
meta: {
title: '美食视频'
}
},
{
path: '/restaurant/solarCalendar',
name: 'solarCalendar',
component: r => { require(['./views/restaurant/SolarCalendar'], r) },
meta: {
title: '节气日历'
}
},
{
path: '/restaurant/themeActivities',
name: 'themeActivities',
component: r => { require(['./views/restaurant/ThemeActivities'], r) },
meta: {
title: '主题活动'
}
}
]
}
]
}
]
})
import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex)
export default new Vuex.Store({
state: {
},
mutations: {
},
actions: {
}
})
<template>
<div class="about">
<h1>This is an about page</h1>
</div>
</template>
<template>
<div class="home">
<img alt="Vue logo" src="../assets/logo.png">
<HelloWorld msg="Welcome to Your Vue.js App"/>
</div>
</template>
<script>
// @ is an alias to /src
import HelloWorld from '@/components/HelloWorld.vue'
export default {
name: 'home',
components: {
HelloWorld
}
}
</script>
<template>
<div>
<div class="btn-warp tr mb20">
<el-button type="primary" size="small" @click="teamBuildingHandle">团建活动</el-button>
<el-button type="primary" size="small">农场运营</el-button>
</div>
<el-table
:data="tableData"
class="mb20"
:header-cell-style="{'background-color': '#F5F7FA', 'color': '#333', 'line-height': '45px', 'height': '45px', 'padding': 0}"
style="width: 100%">
<el-table-column
type="index"
align="center"
label="序号"
width="80">
</el-table-column>
<el-table-column
prop="photo"
align="center"
width="200"
label="照片">
<template scope="scope">
<img :src="scope.row.photo" width="180" height="60" />
</template>
</el-table-column>
<el-table-column
prop="title"
align="center"
label="标题">
</el-table-column>
<el-table-column
prop="classificate"
align="center"
label="分类">
</el-table-column>
<el-table-column
prop="intor"
align="center"
label="介绍">
</el-table-column>
<el-table-column
prop="size"
align="center"
label="大小">
</el-table-column>
<el-table-column
prop="uploadTime"
align="center"
label="上传时间">
</el-table-column>
<el-table-column
prop="handleMan"
align="center"
label="操作人">
</el-table-column>
<el-table-column
prop="time"
align="center"
label="操作"
width="150">
<template>
<el-button type="text" size="small">删除</el-button>
<el-button type="text" size="small">下载</el-button>
</template>
</el-table-column>
</el-table>
<el-dialog
title="上传团建活动"
:visible.sync="centerDialogVisible"
width="38%"
center>
<el-row class="mb20">
<el-col :span="4" align="center">当前图片</el-col>
<el-col :span="15">
<div class="img-warp">
<img src="../../assets/img/pic1.png" alt="">
</div>
</el-col>
<el-col :span="4" :offset="1">
<el-upload
class="upload-demo"
action="https://jsonplaceholder.typicode.com/posts/"
:on-preview="handlePreview"
:on-remove="handleRemove"
:before-remove="beforeRemove"
:multiple="false"
:show-file-list="false"
:on-exceed="handleExceed">
<el-button type="primary" size="small">点击上传</el-button>
<!-- <div slot="tip" class="el-upload__tip">只能上传jpg/png文件,且不超过500kb</div>-->
</el-upload>
</el-col>
</el-row>
<el-row class="mb15">
<el-col :span="4" align="center">标题</el-col>
<el-col :span="15">
<el-input v-model="imgInter" placeholder="请输入图片描述" maxlength="20"></el-input>
</el-col>
</el-row>
<el-row>
<el-col :span="4" align="center">介绍</el-col>
<el-col :span="15">
<el-input v-model="imgInter" placeholder="请输入图片描述" maxlength="20"></el-input>
</el-col>
</el-row>
<span slot="footer" class="dialog-footer">
<el-row>
<el-col :span="15" :offset="4">
<div style="display: flex; justify-content: space-around">
<el-button @click="centerDialogVisible = false">取 消</el-button>
<el-button type="danger">发 布</el-button>
<el-button type="primary">发布并继续添加</el-button>
</div>
</el-col>
</el-row>
</span>
</el-dialog>
</div>
</template>
<script>
export default {
name: 'farmWonderful',
data () {
return {
tableData: [{
photo: require('../../assets/img/m.jpg'),
title: '12313.jpg',
classificate: '团建活动',
intor: '幸福农场日常采摘',
size: '210M',
uploadTime: '2019-7-10 12:30',
handleMan: 'vongdd'
}, {
photo: '',
title: '',
classificate: '农场运营',
intor: '',
size: '',
uploadTime: '',
handleMan: ''
}],
centerDialogVisible: false,
imgInter: ''
}
},
methods: {
teamBuildingHandle () {
this.centerDialogVisible = true
},
handleRemove (file, fileList) {
console.log(file, fileList)
},
handlePreview (file) {
console.log(file)
},
handleExceed (files, fileList) {
this.$message.warning(`当前限制选择 3 个文件,本次选择了 ${files.length} 个文件,共选择了 ${files.length + fileList.length} 个文件`)
},
beforeRemove (file, fileList) {
return this.$confirm(`确定移除 ${file.name}?`)
}
}
}
</script>
<style scoped>
</style>
<template>
<div>
<el-tabs v-model="activeName" @tab-click="handleClick">
<el-tab-pane label="种植活动" name="first">
<el-form ref="form" :model="form" label-width="80px">
<el-form-item label="活动状态">
<el-col :sm="5">未开始</el-col>
</el-form-item>
<el-form-item label="活动期限">
<el-col :span="3">
<el-date-picker type="date" placeholder="选择日期" v-model="form.date1" style="width: 100%;"></el-date-picker>
</el-col>
<el-col class="line tc" :span="1"></el-col>
<el-col :span="3">
<el-date-picker type="date" placeholder="选择日期" v-model="form.date2" style="width: 100%;"></el-date-picker>
</el-col>
</el-form-item>
<el-form-item label="活动介绍">
<el-col :sm="5">
<el-upload
class="upload-demo"
action="https://jsonplaceholder.typicode.com/posts/"
:on-preview="handlePreview"
:on-remove="handleRemove"
:before-remove="beforeRemove"
:limit="1"
:on-exceed="handleExceed"
:file-list="fileList">
<el-button size="small" type="primary">点击上传</el-button>
<!--<div slot="tip" class="el-upload__tip">只能上传jpg/png文件,且不超过500kb</div>-->
</el-upload>
</el-col>
</el-form-item>
<el-form-item label="活动指引">
<el-col :sm="5">
<el-upload
class="upload-demo"
action="https://jsonplaceholder.typicode.com/posts/"
:on-preview="handlePreview"
:on-remove="handleRemove"
:before-remove="beforeRemove"
:limit="3"
:on-exceed="handleExceed"
:file-list="fileList">
<el-button size="small" type="primary">点击上传</el-button>
<!--<div slot="tip" class="el-upload__tip">只能上传jpg/png文件,且不超过500kb</div>-->
</el-upload>
</el-col>
</el-form-item>
</el-form>
<el-row>
<el-col :span="5" class="tc" style="padding-top: 50px; padding-bottom: 30px">
<el-button type="danger">保 存</el-button>
</el-col>
</el-row>
</el-tab-pane>
<el-tab-pane label="养护活动" name="second">配置管理</el-tab-pane>
<el-tab-pane label="采摘活动" name="third">角色管理</el-tab-pane>
<el-tab-pane label="丰收活动" name="fourth">定时任务补偿</el-tab-pane>
</el-tabs>
</div>
</template>
<script>
export default {
name: 'specialEvents',
data () {
return {
activeName: 'first',
form: {
name: '',
region: '',
date1: '',
date2: '',
delivery: false,
type: [],
resource: '',
desc: ''
},
fileList: [{ name: 'food.jpeg', url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100' }]
}
},
methods: {
handleClick (tab, event) {
console.log(tab, event)
},
handleRemove (file, fileList) {
console.log(file, fileList)
},
handlePreview (file) {
console.log(file)
},
handleExceed (files, fileList) {
this.$message.warning(`当前限制选择 1 个文件,本次选择了 ${files.length} 个文件,共选择了 ${files.length + fileList.length} 个文件`)
},
beforeRemove (file, fileList) {
return this.$confirm(`确定移除 ${file.name}?`)
}
}
}
</script>
<style scoped lang="less">
</style>
<template>
<div class="farm"><router-view></router-view></div>
</template>
<script>
export default {
name: 'farm'
}
</script>
<template>
<div>
<el-tabs v-model="activeName" @tab-click="handleClick">
<el-tab-pane label="马拉松" name="first">
<el-form :inline="true" :model="formInline" class="demo-form-inline">
<el-form-item label="赛事名称">
<el-input v-model="formInline.user" placeholder="赛事名称"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" size="small">搜索</el-button>
</el-form-item>
<el-form-item style="float: right">
<el-button type="primary" size="small">导入数据</el-button>
<el-button size="small">导出模板</el-button>
</el-form-item>
</el-form>
<el-table
:data="tableData"
:header-cell-style="{'background-color': '#F5F7FA', 'color': '#333'}"
style="width: 100%">
<el-table-column
type="index"
align="center"
label="序号"
width="80">
</el-table-column>
<el-table-column
prop="eventName"
align="center"
label="赛事名称">
</el-table-column>
<el-table-column
prop="dateTime"
align="center"
label="日期">
</el-table-column>
<el-table-column
prop="state"
align="eventItem"
label="比赛项目">
</el-table-column>
<el-table-column
prop="city"
align="center"
label="城市">
</el-table-column>
<el-table-column
align="center"
prop="uploadeDate"
label="上传日期">
</el-table-column>
<el-table-column
align="center"
prop="handleDate"
label="上传人">
</el-table-column>
<el-table-column
align="center"
label="操作"
width="300">
<template>
<div @click.stop="deleteVisible = true">
<el-button icon="el-icon-delete" size="small"></el-button>
</div>
</template>
</el-table-column>
</el-table>
</el-tab-pane>
<el-tab-pane label="日常酷跑" name="second">
<el-form :inline="true" :model="formInline" class="demo-form-inline">
<el-form-item style="float: right">
<el-button type="primary" size="small">导入数据</el-button>
<el-button size="small">导出模板</el-button>
</el-form-item>
</el-form>
<el-table
:data="tableData1"
:header-cell-style="{'background-color': '#F5F7FA', 'color': '#333'}"
style="width: 100%">
<el-table-column
type="index"
align="center"
label="序号"
width="80">
</el-table-column>
<el-table-column
prop="fileName"
align="center"
label="文件名称">
</el-table-column>
<el-table-column
prop="uploadTime"
align="center"
label="上传日期">
</el-table-column>
<el-table-column
align="center"
prop="handleMan"
label="上传人">
</el-table-column>
<el-table-column
align="center"
label="操作"
width="300">
<template slot-scope="scope">
<div @click.stop="deleteVisible = true">
<el-button icon="el-icon-download" size="small"></el-button>
<el-switch
v-model="scope.row.switchOption.value"
style="margin: 0 15px"
active-color="#13ce66"
inactive-color="#ff4949">
</el-switch>
<el-button icon="el-icon-delete" size="small"></el-button>
</div>
</template>
</el-table-column>
</el-table>
</el-tab-pane>
</el-tabs>
</div>
</template>
<script>
export default {
name: 'EventCalendar',
data () {
return {
activeName: 'first',
formInline: {
user: '',
region: ''
},
tableData: [{
eventName: '金门马拉松',
dateTime: '2019-02-17 ',
eventItem: 'M、H、11.2K、5K',
city: '中国台湾',
uploadeDate: '2019-04-09 11:29',
handleMan: '郭玉洁'
}, {
eventName: '金门马拉松',
dateTime: '2019-02-17 ',
eventItem: 'M、H、11.2K、5K',
city: '中国台湾',
uploadeDate: '2019-04-09 11:29',
handleMan: '郭玉洁'
}],
tableData1: [
{
fileName: '2019年日常酷跑.xlsx',
uploadTime: '2019-04-09 11:29',
handleMan: '郭玉洁',
switchOption: {
value: true
}
}, {
fileName: '2019年日常酷跑.xlsx',
uploadTime: '2019-04-09 11:29',
handleMan: '郭玉洁',
switchOption: {
value: true
}
}
]
}
},
methods: {
handleClick (tab, event) {
console.log(tab, event)
}
}
}
</script>
<style scoped>
</style>
<template>
<div>HappyRunning</div>
</template>
<script>
export default {
name: 'HappyRunning'
}
</script>
<style scoped>
</style>
<template>
<div class="fitness"><router-view></router-view></div>
</template>
<script>
export default {
name: 'fitness'
}
</script>
<template>
<div class="activity-propaganda">
<div class="btn-warp tr mb20">
<el-button type="primary" size="small" @click="imgUpdate">图片更新</el-button>
<el-button type="primary" size="small"><router-link to="/home/textEditing" style="color: #fff">文章编辑</router-link></el-button>
<el-button type="primary" size="small"><router-link to="/home/articleLink" style="color: #fff">文章链接</router-link></el-button>
</div>
<el-table
:data="tableData"
class="mb20"
:header-cell-style="{'background-color': '#F5F7FA', 'color': '#333', 'line-height': '45px', 'height': '45px', 'padding': 0}"
style="width: 100%">
<el-table-column
type="index"
align="center"
label="序号"
width="80">
</el-table-column>
<el-table-column
prop="articleName"
label="文章名称">
</el-table-column>
<el-table-column
prop="articleType"
label="文章类型"
width="180">
</el-table-column>
<el-table-column
prop="uploadTime"
align="center"
label="上传日期">
</el-table-column>
<el-table-column
prop="uploadMan"
align="center"
label="上传人">
</el-table-column>
<el-table-column
prop="state"
align="center"
label="状态">
</el-table-column>
<el-table-column
align="center"
label="操作"
width="300">
<template slot-scope="scope">
<div @click.stop="deleteVisible = true">
<el-button icon="el-icon-edit" size="small"></el-button>
<el-switch
v-model="scope.row.switchOption.value"
style="margin: 0 15px"
active-color="#13ce66"
inactive-color="#ff4949">
</el-switch>
<el-button icon="el-icon-delete" size="small"></el-button>
</div>
</template>
</el-table-column>
</el-table>
<div class="tc">
<el-pagination
layout="prev, pager, next"
:total="50">
</el-pagination>
</div>
<el-dialog
title="活动宣传图片"
:visible.sync="centerDialogVisible"
width="40%"
center>
<el-row class="mb20">
<el-col :span="4" align="center">当前图片</el-col>
<el-col :span="15">
<div class="img-warp">
<img src="../../assets/img/pic1.png" alt="">
</div>
</el-col>
<el-col :span="4" :offset="1">
<el-upload
class="upload-demo"
action="https://jsonplaceholder.typicode.com/posts/"
:on-preview="handlePreview"
:on-remove="handleRemove"
:before-remove="beforeRemove"
:multiple="false"
:show-file-list="false"
:on-exceed="handleExceed">
<el-button type="primary" size="small">点击上传</el-button>
<!-- <div slot="tip" class="el-upload__tip">只能上传jpg/png文件,且不超过500kb</div>-->
</el-upload>
</el-col>
</el-row>
<el-row>
<el-col :span="15" :offset="4">
<el-input v-model="imgInter" placeholder="请输入图片描述" maxlength="20"></el-input>
</el-col>
</el-row>
<span slot="footer" class="dialog-footer">
<el-row>
<el-col :span="15" :offset="4">
<div style="display: flex; justify-content: space-around">
<el-button @click="centerDialogVisible = false">取 消</el-button>
<el-button type="danger">确 定</el-button>
</div>
</el-col>
</el-row>
</span>
</el-dialog>
</div>
</template>
<script>
export default {
name: 'activityPropaganda',
data () {
return {
tableData: [{
articleName: '中秋福利领取倒计时!',
articleType: '活动',
uploadTime: '2019-04-09 11:29',
uploadMan: '郭玉洁',
state: '发布中',
switchOption: {
value: true
}
}, {
articleName: '中秋福利领取倒计时!',
articleType: '活动',
uploadTime: '2019-04-09 11:29',
uploadMan: '郭玉洁',
state: '发布中',
switchOption: {
value: true
}
}, {
articleName: '中秋福利领取倒计时!',
articleType: '活动',
uploadTime: '2019-04-09 11:29',
uploadMan: '郭玉洁',
state: '发布中',
switchOption: {
value: true
}
}, {
articleName: '中秋福利领取倒计时!',
articleType: '活动',
uploadTime: '2019-04-09 11:29',
uploadMan: '郭玉洁',
state: '发布中',
switchOption: {
value: true
}
}],
deleteVisible: false,
centerDialogVisible: false,
imgInter: ''
}
},
methods: {
imgUpdate () {
this.centerDialogVisible = true
},
handleRemove (file, fileList) {
console.log(file, fileList)
},
handlePreview (file) {
console.log(file)
},
handleExceed (files, fileList) {
this.$message.warning(`当前限制选择 3 个文件,本次选择了 ${files.length} 个文件,共选择了 ${files.length + fileList.length} 个文件`)
},
beforeRemove (file, fileList) {
return this.$confirm(`确定移除 ${file.name}?`)
}
}
}
</script>
<style scoped lang="less">
</style>
<template>
<div class="article-link">
<el-form ref="form" :model="form" label-width="100px">
<el-form-item label="文章名称">
<el-col :sm="6" :offset="1">
<el-input v-model="form.articleTitle"></el-input>
</el-col>
</el-form-item>
<el-form-item label="文章类型">
<el-col :sm="6" :offset="1">
<el-select v-model="form.articleType" style="width: 100%">
<el-option label="专题1" value="专题1"></el-option>
<el-option label="专题2" value="专题2"></el-option>
</el-select>
</el-col>
</el-form-item>
<el-form-item label="文章链接">
<el-col :sm="6" :offset="1">
<el-input v-model="form.articleLink"></el-input>
</el-col>
</el-form-item>
<el-form-item>
<el-col :sm="6" :offset="1">
<el-button size="small">取消</el-button>
<el-button type="primary" size="small">确认</el-button>
<el-button type="danger" size="small">发布</el-button>
</el-col>
</el-form-item>
</el-form>
</div>
</template>
<script>
export default {
name: 'articleLink',
data () {
return {
form: {
articleTitle: '',
articleType: '',
articleLink: ''
}
}
}
}
</script>
<style scoped>
</style>
<template>
<div class="banner-add">
<el-form ref="form" :model="form" label-width="100px">
<el-form-item label="图片名称">
<el-col :sm="5">
<el-input v-model="form.name"></el-input>
</el-col>
</el-form-item>
<el-form-item label="图片上传">
<div class="img_load">
<el-col :sm="5">
<el-upload
class="avatar-uploader"
action="https://jsonplaceholder.typicode.com/posts/"
:show-file-list="false"
:on-success="handleAvatarSuccess"
:before-upload="beforeAvatarUpload">
<img v-if="imageUrl" :src="imageUrl" class="avatar">
<i v-else class="el-icon-plus avatar-uploader-icon"></i>
</el-upload>
</el-col>
<el-col :sm="6">
<div class="upload_infor">
<el-button type="primary" size="small">预览</el-button>
<br>
<p>*请上传尺寸为 <em>1920*502</em>,大小不超过5M的图片</p>
</div>
</el-col>
</div>
</el-form-item>
<el-form-item label="图片尺寸">
<el-col :sm="5">
<el-input v-model="form.name"></el-input>
</el-col>
</el-form-item>
<el-form-item label="图片大小">
<el-col :sm="5">
<el-input v-model="form.name"></el-input>
</el-col>
</el-form-item>
<el-form-item label="状态">
<el-radio-group v-model="form.resource">
<el-radio label="启用"></el-radio>
<el-radio label="停用"></el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="轮播排序">
<el-col :sm="5">
<el-select v-model="form.region" placeholder="数字越小,排序越靠前" style="width: 100%">
<el-option label="区域一" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
</el-select>
</el-col>
<el-col :sm="5">
<p style="padding-left: 20px">*首页轮播图最多8张</p>
</el-col>
</el-form-item>
<el-form-item label="外链文章">
<el-col :sm="5">
<el-input v-model="form.name"></el-input>
</el-col>
</el-form-item>
<el-form-item>
<el-button>取消</el-button>
<el-button type="danger" size="small">确认</el-button>
</el-form-item>
</el-form>
</div>
</template>
<script>
export default {
name: 'BannerAdd',
data () {
return {
form: {
name: '',
region: '',
date1: '',
date2: '',
delivery: false,
type: [],
resource: '',
desc: ''
},
imageUrl: ''
}
},
methods: {
handleAvatarSuccess (res, file) {
this.imageUrl = URL.createObjectURL(file.raw)
},
beforeAvatarUpload (file) {
console.log(file)
const isJPG = file.type === 'image/jpeg'
const isLt2M = file.size / 1024 / 1024 < 2
// if (!isJPG) {
// this.$message.error('上传头像图片只能是 JPG 格式!')
// }
if (!isLt2M) {
this.$message.error('上传头像图片大小不能超过 2MB!')
}
return isJPG && isLt2M
}
}
}
</script>
<style lang="less">
.banner-add {padding: 0 30px; box-sizing: border-box}
.avatar-uploader .el-upload {
border: 1px dashed #d9d9d9;
border-radius: 6px;
cursor: pointer;
position: relative;
overflow: hidden;
width: 100%;
}
.avatar-uploader .el-upload:hover {
border-color: #409EFF;
}
.avatar-uploader-icon {
font-size: 28px;
color: #8c939d;
width: 100%;
height: 80px;
line-height: 80px !important;
text-align: center;
}
.avatar {
width: 178px;
height: 178px;
display: block;
}
.upload_infor {
padding-left: 20px;
p {
em {color: #D0021B;}
}
}
</style>
<template>
</template>
<script>
export default {
name: 'bannerEdit'
}
</script>
<style scoped>
</style>
<template>
<div class="banner">
<el-form :inline="true" class="demo-form-inline" size="small">
<el-form-item label="图片名称">
<el-input v-model="imgName" placeholder="图片名称"></el-input>
</el-form-item>
<el-form-item>
<el-button size="small">搜索</el-button>
</el-form-item>
<el-form-item style="float: right">
<el-button type="primary" size="small"><router-link to="/home/bannerAdd" style="color: #ffffff">新增banner</router-link></el-button>
</el-form-item>
</el-form>
<el-table
:data="tableData"
:header-cell-style="{'background-color': '#F5F7FA', 'color': '#333'}"
@row-click="rowClick"
style="width: 100%">
<el-table-column
type="index"
align="center"
label="序号"
width="80">
</el-table-column>
<el-table-column
prop="bannerImg"
label="banner缩略图">
<template slot-scope="scope">
<img :src="scope.row.bannerImg" width="200" height="70" />
</template>
</el-table-column>
<el-table-column
prop="bannerName"
label="名称"
width="180">
</el-table-column>
<el-table-column
prop="bannerSort"
align="center"
label="轮播排序">
</el-table-column>
<el-table-column
prop="state"
align="center"
label="状态">
</el-table-column>
<el-table-column
prop="handleDate"
align="center"
label="操作日期">
</el-table-column>
<el-table-column
align="center"
prop="handleDate"
label="操作人">
</el-table-column>
<el-table-column
align="center"
label="操作"
width="300">
<template slot-scope="scope">
<div @click.stop="deleteVisible = true">
<el-button icon="el-icon-edit" size="small"></el-button>
<el-switch
v-model="scope.row.switchOption.value"
style="margin: 0 15px"
active-color="#13ce66"
inactive-color="#ff4949">
</el-switch>
<el-button icon="el-icon-delete" size="small"></el-button>
</div>
</template>
</el-table-column>
</el-table>
</div>
</template>
<script>
export default {
name: 'bannerManage',
data () {
return {
imgName: '',
tableData: [{
bannerImg: require('../../assets/img/m.jpg'),
bannerName: '马拉松图片1',
bannerSort: '1',
state: '已启用',
handleDate: '2019-04-09 11:29',
handleMan: '郭玉洁',
switchOption: {
value: true
}
}, {
bannerImg: require('../../assets/img/m.jpg'),
bannerName: '马拉松图片2',
bannerSort: '1',
state: '已启用',
handleDate: '2019-04-09 11:29',
handleMan: '郭玉洁',
switchOption: {
value: true
}
}, {
bannerImg: require('../../assets/img/m.jpg'),
bannerName: '马拉松图片1',
bannerSort: '1',
state: '已启用',
handleDate: '2019-04-09 11:29',
handleMan: '郭玉洁',
switchOption: {
value: true
}
}, {
bannerImg: require('../../assets/img/m.jpg'),
bannerName: '马拉松图片1',
bannerSort: '1',
state: '已启用',
handleDate: '2019-04-09 11:29',
handleMan: '郭玉洁',
switchOption: {
value: false
}
}],
deleteVisible: false
}
},
methods: {
rowClick (item) {
this.$router.push({ name: 'bannerEdit', params: { item: item } })
}
}
}
</script>
<style scoped lang="less">
</style>
<template>
<div class="common-link">
<div class="btn-warp tr mb20">
<el-button type="primary" size="small" @click="addLink">新增链接</el-button>
</div>
<el-table
:data="tableData"
class="mb20"
:header-cell-style="{'background-color': '#F5F7FA', 'color': '#333', 'line-height': '45px', 'height': '45px', 'padding': 0}"
style="width: 100%">
<el-table-column
type="index"
align="center"
label="序号"
width="80">
</el-table-column>
<el-table-column
prop="linkName"
align="center"
label="链接名称"
width="240">
</el-table-column>
<el-table-column
prop="linkUrl"
align="center"
label="链接地址">
</el-table-column>
<el-table-column
prop="uploadTime"
align="center"
label="上传日期"
width="160">
</el-table-column>
<el-table-column
prop="uploadMan"
align="center"
label="上传人"
width="120">
</el-table-column>
<el-table-column
align="center"
label="操作"
width="200">
<template slot-scope="scope">
<div @click.stop="deleteVisible = true">
<el-button icon="el-icon-edit" size="small"></el-button>
<el-switch
v-model="scope.row.switchOption.value"
style="margin: 0 15px"
active-color="#13ce66"
inactive-color="#ff4949">
</el-switch>
<el-button icon="el-icon-delete" size="small"></el-button>
</div>
</template>
</el-table-column>
</el-table>
<div class="tc">
<el-pagination
layout="prev, pager, next"
:total="50">
</el-pagination>
</div>
<el-dialog
title="新增常用链接"
:visible.sync="centerDialogVisible"
width="40%"
center>
<el-row class="mb20">
<el-col :span="4" align="center">链接名称</el-col>
<el-col :span="12">
<el-input v-model="imgInter" placeholder="请输入图片描述" maxlength="20"></el-input>
</el-col>
<el-col :span="7" :offset="1">
<p>*链接名称最多8个汉字</p>
</el-col>
</el-row>
<el-row>
<el-col :span="4" align="center">链接名称</el-col>
<el-col :span="18">
<el-input type="textarea" :rows="4" v-model="imgInter"></el-input>
</el-col>
</el-row>
<span slot="footer" class="dialog-footer">
<el-row>
<el-col :span="10" :offset="7">
<div style="display: flex; justify-content: space-around">
<el-button @click="centerDialogVisible = false">取 消</el-button>
<el-button type="danger">确 定</el-button>
</div>
</el-col>
</el-row>
</span>
</el-dialog>
</div>
</template>
<script>
export default {
name: 'commonLink',
data () {
return {
tableData: [{
linkName: 'OA行政云盘!',
linkUrl: 'http://yunpan.cfldcn.com/web/index#/home/file/mount?mountid=61320',
uploadTime: '',
uploadMan: '郭玉洁',
switchOption: {
value: true
}
}, {
linkName: '挂网制度!',
linkUrl: 'http://oa.cfldcn.com/km/institution/?categoryId=13bdbf8c79a672c7cf2f5f84786931f7#cri.q=docStatus:30',
uploadTime: '2019-04-09 11:29',
uploadMan: '郭玉洁',
switchOption: {
value: true
}
}],
deleteVisible: false,
centerDialogVisible: false,
imgInter: ''
}
},
methods: {
addLink () {
this.centerDialogVisible = true
},
handleRemove (file, fileList) {
console.log(file, fileList)
},
handlePreview (file) {
console.log(file)
},
handleExceed (files, fileList) {
this.$message.warning(`当前限制选择 3 个文件,本次选择了 ${files.length} 个文件,共选择了 ${files.length + fileList.length} 个文件`)
},
beforeRemove (file, fileList) {
return this.$confirm(`确定移除 ${file.name}?`)
}
}
}
</script>
<style scoped>
</style>
<template>
<div class="message-management">
<el-row type="flex" justify="space-between" class="mb20">
<el-col :span="6">
<el-select v-model="value" placeholder="请选择" size="small">
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-col>
<el-col :span="4" align="right">
<el-button type="primary" size="small">导出</el-button>
</el-col>
</el-row>
<el-table
:data="tableData"
style="width: 100%">
<el-table-column
type="index"
align="center"
label="序号"
width="60">
</el-table-column>
<el-table-column
prop="zhixinNum"
align="center"
label="知信号"
width="150">
</el-table-column>
<el-table-column
prop="name"
align="center"
label="姓名"
width="120">
</el-table-column>
<el-table-column
align="center"
prop="organizationalStructure"
label="组织架构"
width="320">
<template slot-scope="scope">
<el-popover
ref="popover{{$index}}"
placement="top-start"
width="350"
:popper-options="{
boundariesElement: 'body'
}"
trigger="hover">
<div class="tc">{{scope.row.organizationalStructure}}</div>
<a href="javascript:;" slot="reference" class="a_hover">{{scope.row.organizationalStructure}}</a>
</el-popover>
</template>
</el-table-column>
<el-table-column
prop="workingPlace"
align="center"
label="工作地点"
width="150">
</el-table-column>
<el-table-column
align="center"
prop="messageModule"
label="留言版块"
width="150">
</el-table-column>
<el-table-column
align="center"
prop="message"
label="留言"
width="250">
<template slot-scope="scope">
<el-popover
ref="popover{{$index}}"
placement="top-start"
width="300"
trigger="hover">
<div class="tc">{{scope.row.message}}</div>
<a href="javascript:;" slot="reference" class="a_hover">{{scope.row.message}}</a>
</el-popover>
</template>
</el-table-column>
<el-table-column
prop="messageDateTime"
align="center"
label="留言日期"
width="150">
</el-table-column>
<el-table-column
align="center"
prop="handleMan"
label="处理人"
width="120">
</el-table-column>
<el-table-column
align="center"
fixed="right"
label="操作"
width="150">
<template slot-scope="scope">
<el-button type="text" size="small">确认处理</el-button>
<el-button type="text" size="small" @click="noteHandle">备注</el-button>
</template>
</el-table-column>
</el-table>
<div class="tc mt10">
<el-pagination
layout="prev, pager, next"
:total="50">
</el-pagination>
</div>
<el-dialog
title="备注"
:visible.sync="centerDialogVisible"
width="35%"
center>
<div>
<el-input
type="textarea"
:rows="7"
placeholder="请输入内容"
v-model="textarea">
</el-input>
</div>
<span slot="footer" class="dialog-footer">
<el-row>
<el-col :span="15" :offset="4">
<div style="display: flex; justify-content: space-around">
<el-button @click="centerDialogVisible = false">取 消</el-button>
<el-button type="danger">确 定</el-button>
</div>
</el-col>
</el-row>
</span>
</el-dialog>
</div>
</template>
<script>
export default {
name: 'messageManagement',
data () {
return {
options: [{
value: '选项1',
label: '黄金糕'
}, {
value: '选项2',
label: '双皮奶'
}, {
value: '选项3',
label: '蚵仔煎'
}, {
value: '选项4',
label: '龙须面'
}, {
value: '选项5',
label: '北京烤鸭'
}],
value: '',
tableData: [{
id: '1',
zhixinNum: 'vguoying',
name: '王小虎',
organizationalStructure: '华夏幸福>股份公司总部>信息管理中心>平台应用管理部',
workingPlace: '食品科技大厦',
messageModule: '幸福健身',
message: '长跑节外部人员怎么报名长跑节外部人员怎么报名',
messageDateTime: '2019-04-09 11:29',
handleMan: '郭玉洁'
}, {
id: '2',
zhixinNum: 'vguoying',
name: '王小虎',
organizationalStructure: '华夏幸福>股份公司总部>信息管理中心>平台应用管理部',
workingPlace: '食品科技大厦',
messageModule: '幸福健身',
message: '长跑节外部人员怎么报名长跑节外部人员怎么报名',
messageDateTime: '2019-04-09 11:29',
handleMan: '郭玉洁'
}, {
id: '3',
zhixinNum: 'vguoying',
name: '王小虎',
organizationalStructure: '华夏幸福>股份公司总部>信息管理中心>平台应用管理部',
workingPlace: '食品科技大厦',
messageModule: '幸福健身',
message: '长跑节外部人员怎么报名长跑节外部人员怎么报名',
messageDateTime: '2019-04-09 11:29',
handleMan: '郭玉洁'
}, {
id: '4',
zhixinNum: 'vguoying',
name: '王小虎',
organizationalStructure: '华夏幸福>股份公司总部>信息管理中心>平台应用管理部',
workingPlace: '食品科技大厦',
messageModule: '幸福健身',
message: '长跑节外部人员怎么报名长跑节外部人员怎么报名',
messageDateTime: '2019-04-09 11:29',
handleMan: '郭玉洁'
}],
centerDialogVisible: false,
textarea: ''
}
},
methods: {
noteHandle () {
this.centerDialogVisible = true
}
}
}
</script>
<style scoped lang="less">
.a_hover {
display: block;
width: 100%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
&:hover {color: #4A90E2}
}
</style>
<template>
<div class="text-editing">
<div class="editor-head">
<el-row>
<el-col :span="17" :offset="1">
<div class="input_warp"><input type="text" placeholder="请输入标题…" /></div>
</el-col>
<el-col :span="6">
<div class="select-warp">
<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>
</div>
</el-col>
</el-row>
</div>
<div style="min-height: 500px">
<quill-editor
v-model="content"
ref="myQuillEditor"
:options="editorOption"
@blur="onEditorBlur($event)" @focus="onEditorFocus($event)"
@change="onEditorChange($event)">
</quill-editor>
</div>
</div>
</template>
<script>
export default {
name: 'TextEditing',
data () {
return {
options: [{
value: '选项1',
label: '黄金糕'
}, {
value: '选项2',
label: '双皮奶'
}, {
value: '选项3',
label: '蚵仔煎'
}, {
value: '选项4',
label: '龙须面'
}, {
value: '选项5',
label: '北京烤鸭'
}],
value: '',
content: '1121212',
editorOption: {}
}
},
methods: {
onEditorBlur () { // 失去焦点事件
},
onEditorFocus () { // 获得焦点事件
},
onEditorChange () { // 内容改变事件
}
}
}
</script>
<style scoped lang="less">
.editor-head {margin-bottom: 20px;
.input_warp {width: 100%; box-sizing: border-box; padding: 0 20px;
input {width: 100%; border-bottom: 1px solid #ccc; padding: 10px; text-align: center; font-size: 16px; box-sizing: border-box; color: #666666; line-height: 24px}
}
}
</style>
<template>
<div class="home"><router-view></router-view></div>
</template>
<script>
export default {
name: 'home'
}
</script>
<template>
<div>美食视频</div>
</template>
<script>
export default {
name: 'foodVideo'
}
</script>
<style scoped>
</style>
<template>
<div>
<el-form :inline="true" :model="formInline" class="demo-form-inline">
<el-form-item>
<el-select v-model="formInline.region" placeholder="活动区域">
<el-option label="区域一" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-select v-model="formInline.region" placeholder="活动区域">
<el-option label="区域一" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
</el-select>
</el-form-item>
<el-form-item label="餐厅名称">
<el-input v-model="formInline.user" placeholder="审批人"></el-input>
</el-form-item>
<el-form-item>
<el-button>搜索</el-button>
</el-form-item>
<el-form-item style="float: right">
<el-button type="primary"><router-link to="/restaurant/restaurantAdd" style="color: #fff">新增餐厅</router-link></el-button>
<el-button>导出</el-button>
</el-form-item>
</el-form>
<el-table
:data="tableData"
class="mb20"
:header-cell-style="{'background-color': '#F5F7FA', 'color': '#333', 'line-height': '45px', 'height': '45px', 'padding': 0}"
style="width: 100%">
<el-table-column
type="index"
align="center"
label="序号"
width="80">
</el-table-column>
<el-table-column
prop="restaurantName"
align="center"
:show-overflow-tooltip="true"
label="餐厅名称">
</el-table-column>
<el-table-column
prop="province"
align="center"
width="100"
label="省">
</el-table-column>
<el-table-column
prop="city"
align="center"
label="市">
</el-table-column>
<el-table-column
prop="county"
align="center"
label="区/县"
width="100">
</el-table-column>
<el-table-column
prop="address"
align="center"
label="详细地址">
</el-table-column>
<el-table-column
prop="responsibleMan"
align="center"
label="负责人">
</el-table-column>
<el-table-column
prop="contactTel"
align="center"
label="联系方式">
</el-table-column>
<el-table-column
prop="uploadMan"
align="center"
label="上传人">
</el-table-column>
<el-table-column
prop="uploadTime"
align="center"
label="上传时间">
</el-table-column>
<el-table-column
align="center"
label="操作">
<template>
<div>
<el-button icon="el-icon-delete" size="small"></el-button>
</div>
</template>
</el-table-column>
</el-table>
</div>
</template>
<script>
export default {
name: 'ationalRestaurant',
data () {
return {
formInline: {
user: '',
region: ''
},
tableData: [{
restaurantName: '产新保定区域事业部涞源项目餐厅',
provinces: '河北省',
city: '保定市',
county: '涞源县',
address: '广平大街凉城美景',
responsibleMan: '商亭亭',
contactTel: '13999999999',
uploadMan: '郭玉洁',
uploadTime: '2019-04-09 11:29'
}, {
restaurantName: '产新保定区域事业部涞源项目餐厅',
provinces: '河北省',
city: '保定市',
county: '涞源县',
address: '广平大街凉城美景',
responsibleMan: '商亭亭',
contactTel: '13999999999',
uploadMan: '郭玉洁',
uploadTime: '2019-04-09 11:29'
}]
}
}
}
</script>
<style scoped>
</style>
<template>
<div>
<el-form ref="form" :model="form" label-width="100px">
<el-form-item label="所在省">
<el-col :sm="5">
<el-select v-model="form.region" placeholder="省份" style="width: 100%">
<el-option label="区域一" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
</el-select>
</el-col>
</el-form-item>
<el-form-item label="所在市">
<el-col :sm="5">
<el-select v-model="form.region" placeholder="市区" style="width: 100%">
<el-option label="区域一" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
</el-select>
</el-col>
<el-col :sm="10">
<div style="position: relative; width: 100%; height: 100%">
<div class="map" id="map" style="width: 450px; height: 220px; position: absolute; left: 50px"></div>
</div>
</el-col>
</el-form-item>
<el-form-item label="区/县">
<el-col :sm="5">
<el-select v-model="form.region" placeholder="区/县" style="width: 100%">
<el-option label="区域一" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
</el-select>
</el-col>
</el-form-item>
<el-form-item label="详细地址">
<el-col :sm="5">
<el-input v-model="form.name"></el-input>
<a href="" class="link">点击此处查询地区经纬度</a>
</el-col>
</el-form-item>
<el-form-item label="所在经度">
<el-col :sm="5">
<el-input v-model="form.name"></el-input>
</el-col>
</el-form-item>
<el-form-item label="所在纬度">
<el-col :sm="5">
<el-input v-model="form.name"></el-input>
</el-col>
</el-form-item>
<el-form-item label="餐厅名称">
<el-col :sm="5">
<el-input v-model="form.name"></el-input>
</el-col>
</el-form-item>
<el-form-item label="负责人">
<el-col :sm="4">
<el-input v-model="form.name"></el-input>
</el-col>
<el-col :sm="12" :offset="1">
<el-form-item label="联系方式">
<el-col :sm="8">
<el-input v-model="form.name"></el-input>
</el-col>
</el-form-item>
</el-col>
</el-form-item>
</el-form>
<el-row>
<el-col :span="3" :offset="2">
<el-row type="flex" justify="space-between">
<el-col :span="2">
<el-button>取消</el-button>
</el-col>
<el-col :span="2">
<el-button type="danger">确认</el-button>
</el-col>
</el-row>
</el-col>
</el-row>
</div>
</template>
<script>
export default {
name: 'restaurantAdd',
data () {
return {
form: {
name: '',
region: '',
date1: '',
date2: '',
delivery: false,
type: [],
resource: '',
desc: ''
}
}
},
mounted () {
this.createMap()
},
methods: {
createMap () {
/* eslint-disable */
var map = new BMap.Map('map') // 创建地图实例
var point = new BMap.Point(116.404, 39.915) // 创建点坐标
map.centerAndZoom(point, 15)
/* eslint-disable */
}
}
}
</script>
<style scoped>
</style>
<template>
<div>餐厅菜单</div>
</template>
<script>
export default {
name: 'restaurantMenus'
}
</script>
<style scoped>
</style>
<template>
<div>节气日历</div>
</template>
<script>
export default {
name: 'solarCalendar'
}
</script>
<style scoped>
</style>
<template>
<div>主题活动</div>
</template>
<script>
export default {
name: 'ThemeActivities'
}
</script>
<style scoped>
</style>
<template>
<div class="restaurant"><router-view></router-view></div>
</template>
<script>
export default {
name: 'restaurant'
}
</script>
<template>
<div class="commonSense">
<div style="min-height: 500px">
<quill-editor
v-model="content"
ref="myQuillEditor"
:options="editorOption"
@blur="onEditorBlur($event)" @focus="onEditorFocus($event)"
@change="onEditorChange($event)">
</quill-editor>
</div>
<div class="btn-warp tc">
<el-button>默认按钮</el-button>
<el-button type="primary" style="margin-left: 30px; margin-right: 30px">主要按钮</el-button>
<el-button type="danger">危险按钮</el-button>
</div>
</div>
</template>
<script>
export default {
name: 'commonSense',
data () {
return {
content: '1121212',
editorOption: {
style: {
'height': '400px'
}
}
}
},
methods: {
onEditorBlur () { // 失去焦点事件
},
onEditorFocus () { // 获得焦点事件
},
onEditorChange () { // 内容改变事件
}
}
}
</script>
<style scoped lang="less">
</style>
<template>
<div>
<el-form ref="form" :model="form" label-width="100px">
<el-form-item label="所在省">
<el-col :sm="5">
<el-select v-model="form.region" placeholder="省份" style="width: 100%">
<el-option label="区域一" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
</el-select>
</el-col>
</el-form-item>
<el-form-item label="所在市">
<el-col :sm="5">
<el-select v-model="form.region" placeholder="市区" style="width: 100%">
<el-option label="区域一" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
</el-select>
</el-col>
<el-col :sm="10">
<div style="position: relative; width: 100%; height: 100%">
<div class="map" id="map" style="width: 450px; height: 220px; position: absolute; left: 50px"></div>
</div>
</el-col>
</el-form-item>
<el-form-item label="网点名称">
<el-col :sm="5">
<el-input v-model="form.name"></el-input>
</el-col>
</el-form-item>
<el-form-item label="详细地址">
<el-col :sm="5">
<el-input v-model="form.name"></el-input>
<a href="" class="link">点击此处查询地区经纬度</a>
</el-col>
</el-form-item>
<el-form-item label="所在经度">
<el-col :sm="5">
<el-input v-model="form.name"></el-input>
</el-col>
</el-form-item>
<el-form-item label="所在纬度">
<el-col :sm="5">
<el-input v-model="form.name"></el-input>
</el-col>
</el-form-item>
<el-form-item label="送取方式">
<el-col :sm="4">
<el-select v-model="form.region" placeholder="省份" style="width: 100%">
<el-option label="区域一" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
</el-select>
</el-col>
</el-form-item>
<el-form-item label="联系人">
<el-col :sm="4">
<el-input v-model="form.name"></el-input>
</el-col>
<el-col :sm="12" :offset="1">
<el-form-item label="联系方式">
<el-col :sm="8">
<el-input v-model="form.name"></el-input>
</el-col>
</el-form-item>
</el-col>
</el-form-item>
<el-form-item label="行政对接人">
<el-col :sm="4">
<el-input v-model="form.name"></el-input>
</el-col>
<el-col :sm="12" :offset="1">
<el-form-item label="对接人电话">
<el-col :sm="8">
<el-input v-model="form.name"></el-input>
</el-col>
</el-form-item>
</el-col>
</el-form-item>
<el-form-item label="时间">
<el-col :sm="5">
<el-input v-model="form.name"></el-input>
</el-col>
</el-form-item>
<el-form-item label="供应商">
<el-col :sm="5">
<el-input v-model="form.name"></el-input>
</el-col>
</el-form-item>
</el-form>
<el-row>
<el-col :span="3" :offset="2">
<el-row type="flex" justify="space-between">
<el-col :span="2">
<el-button>取消</el-button>
</el-col>
<el-col :span="2">
<el-button type="danger">确认</el-button>
</el-col>
</el-row>
</el-col>
</el-row>
</div>
</template>
<script>
export default {
name: 'newBranches',
data () {
return {
form: {
name: '',
region: '',
date1: '',
date2: '',
delivery: false,
type: [],
resource: '',
desc: ''
}
}
},
mounted () {
this.createMap()
},
methods: {
createMap () {
/* eslint-disable */
var map = new BMap.Map('map') // 创建地图实例
var point = new BMap.Point(116.404, 39.915) // 创建点坐标
map.centerAndZoom(point, 15)
/* eslint-disable */
}
}
}
</script>
<style scoped>
</style>
<template>
<div class="WashBranches">
<el-form :inline="true" :model="formInline" class="demo-form-inline">
<el-form-item>
<el-select v-model="formInline.region" placeholder="活动区域">
<el-option label="区域一" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-select v-model="formInline.region" placeholder="活动区域">
<el-option label="区域一" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-select v-model="formInline.region" placeholder="活动区域">
<el-option label="区域一" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
</el-select>
</el-form-item>
<el-form-item label="网点名称">
<el-input v-model="formInline.user" placeholder="审批人"></el-input>
</el-form-item>
<el-form-item>
<el-button>搜索</el-button>
</el-form-item>
<el-form-item style="float: right">
<el-button type="primary">新增网点</el-button>
<el-button>导出</el-button>
</el-form-item>
</el-form>
<el-table
:data="tableData"
class="mb20"
:header-cell-style="{'background-color': '#F5F7FA', 'color': '#333', 'line-height': '45px', 'height': '45px', 'padding': 0}"
style="width: 100%">
<el-table-column
type="index"
align="center"
label="序号"
width="80">
</el-table-column>
<el-table-column
prop="provinces"
align="center"
width="80"
label="省">
</el-table-column>
<el-table-column
prop="city"
align="center"
width="100"
label="市">
</el-table-column>
<el-table-column
prop="washShop"
align="center"
label="洗衣店名称">
</el-table-column>
<el-table-column
prop="sendType"
align="center"
label="送取方式"
width="100">
</el-table-column>
<el-table-column
prop="address"
align="center"
label="详细地址">
</el-table-column>
<el-table-column
prop="contactMan"
align="center"
label="联系人">
</el-table-column>
<el-table-column
prop="contactTel"
align="center"
label="联系方式">
</el-table-column>
<el-table-column
prop="time"
align="center"
label="时间">
</el-table-column>
<el-table-column
prop="supplier"
align="center"
label="供应商">
</el-table-column>
</el-table>
</div>
</template>
<script>
export default {
name: 'washBranches',
data () {
return {
formInline: {
user: '',
region: ''
},
tableData: [{
provinces: '北京',
city: '朝阳区',
washShop: '北京珀力酒店',
sendType: '自由送取',
address: '北京市朝阳区将',
contactMan: '康振',
contactTel: '13999999999',
time: '周一到周五 10:00-18:00',
supplier: '北京布瑞琳洗染服务有限公司'
}, {
provinces: '北京',
city: '朝阳区',
washShop: '北京珀力酒店',
sendType: '自由送取',
address: '北京市朝阳区将',
contactMan: '康振',
contactTel: '13999999999',
time: '周一到周五 10:00-18:00',
supplier: '北京布瑞琳洗染服务有限公司'
}]
}
}
}
</script>
<style scoped>
</style>
<template>
<div class="wash"><router-view></router-view></div>
</template>
<script>
export default {
name: 'wash'
}
</script>
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 sign in to comment