前端
This commit is contained in:
xvv
parent
60e073493e
commit
20e7b1ab0e
@ -1,64 +1,150 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="app-container">
|
<div class="app-container">
|
||||||
<el-card >
|
<el-card >
|
||||||
<el-row :gutter="24">
|
<div class="top-box">
|
||||||
<el-form ref="queryParams" :model="queryParams" label-width="40px">
|
<div class="d-s">
|
||||||
<el-col :span="4">
|
<el-input v-model="form.name" placeholder="请输入油站名称" style="width: 200px;margin-right: 15px;"></el-input>
|
||||||
|
<el-select v-model="value" placeholder="请选择所属机构" style="width: 200px;margin-right: 15px;">
|
||||||
|
<el-option
|
||||||
|
v-for="item in options"
|
||||||
|
:key="item.value"
|
||||||
|
:label="item.label"
|
||||||
|
:value="item.value">
|
||||||
|
</el-option>
|
||||||
|
</el-select>
|
||||||
|
<el-select v-model="value" placeholder="请选择油站状态" style="width: 200px;margin-right: 15px;">
|
||||||
|
<el-option
|
||||||
|
v-for="item in options"
|
||||||
|
:key="item.value"
|
||||||
|
:label="item.label"
|
||||||
|
:value="item.value">
|
||||||
|
</el-option>
|
||||||
|
</el-select>
|
||||||
|
<el-select v-model="value" placeholder="请选择计费方式" style="width: 200px;margin-right: 15px;">
|
||||||
|
<el-option
|
||||||
|
v-for="item in options"
|
||||||
|
:key="item.value"
|
||||||
|
:label="item.label"
|
||||||
|
:value="item.value">
|
||||||
|
</el-option>
|
||||||
|
</el-select>
|
||||||
|
<el-date-picker
|
||||||
|
v-model="value"
|
||||||
|
type="date"
|
||||||
|
placeholder="选择日期">
|
||||||
|
</el-date-picker>
|
||||||
|
</div>
|
||||||
|
<div class="d-s">
|
||||||
|
<el-button type="primary" icon="el-icon-search">搜索</el-button>
|
||||||
|
<el-button icon="el-icon-refresh-right">重置</el-button>
|
||||||
|
</div>
|
||||||
|
|
||||||
<el-form-item label="名称">
|
</div>
|
||||||
<el-input v-model="queryParams.storeName"></el-input>
|
<el-table
|
||||||
</el-form-item>
|
:data="tableData"
|
||||||
|
border
|
||||||
|
style="width: 100%">
|
||||||
|
<el-table-column
|
||||||
|
type="index"
|
||||||
|
label="序号"
|
||||||
|
align="center"
|
||||||
|
width="50">
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column
|
||||||
|
prop="date"
|
||||||
|
align="center"
|
||||||
|
label="油站名称"
|
||||||
|
>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column
|
||||||
|
prop="name"
|
||||||
|
align="center"
|
||||||
|
label="所属机构"
|
||||||
|
>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column
|
||||||
|
prop="name"
|
||||||
|
align="center"
|
||||||
|
width="100"
|
||||||
|
label="油站负责人"
|
||||||
|
>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column
|
||||||
|
prop="name"
|
||||||
|
align="center"
|
||||||
|
label="联系电话"
|
||||||
|
>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column
|
||||||
|
prop="name"
|
||||||
|
align="center"
|
||||||
|
width="80"
|
||||||
|
label="计费方式"
|
||||||
|
>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column
|
||||||
|
prop="name"
|
||||||
|
align="center"
|
||||||
|
label="到期提醒"
|
||||||
|
>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column
|
||||||
|
prop="name"
|
||||||
|
align="center"
|
||||||
|
label="会员人数"
|
||||||
|
width="80"
|
||||||
|
>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column
|
||||||
|
prop="name"
|
||||||
|
align="center"
|
||||||
|
width="80"
|
||||||
|
label="油站状态"
|
||||||
|
>
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<el-switch
|
||||||
|
v-model="scope.row.status"
|
||||||
|
active-color="#13ce66"
|
||||||
|
inactive-color="#ff4949">
|
||||||
|
</el-switch>
|
||||||
|
|
||||||
</el-col>
|
</template>
|
||||||
<el-col :span="4">
|
</el-table-column>
|
||||||
|
<el-table-column
|
||||||
|
prop="name"
|
||||||
|
align="center"
|
||||||
|
label="创建时间"
|
||||||
|
>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column
|
||||||
|
prop="date"
|
||||||
|
align="center"
|
||||||
|
width="180"
|
||||||
|
label="操作">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<div style="display: flex;justify-content: center;width: 100%">
|
||||||
|
<div style="color: #409EFF;cursor: pointer;margin: 0 10px">进入油站</div>
|
||||||
|
<div style="color: #409EFF;cursor: pointer;margin: 0 10px">查看详情</div>
|
||||||
|
|
||||||
<el-form-item label="状态">
|
</div>
|
||||||
<el-select v-model="queryParams.status" placeholder="店铺状态">
|
|
||||||
<el-option label="启用" value="qy"></el-option>
|
|
||||||
<el-option label="禁用" value="jy"></el-option>
|
|
||||||
</el-select>
|
|
||||||
</el-form-item>
|
|
||||||
|
|
||||||
</el-col>
|
</template>
|
||||||
<!-- <el-col :span="4">
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
<el-form-item label="套餐">
|
<div style="margin-top: 20px">
|
||||||
<el-select v-model="form.region" placeholder="店铺套餐">
|
<el-pagination
|
||||||
<el-option label="店铺套餐一" value="shanghai"></el-option>
|
background
|
||||||
<el-option label="店铺套餐二" value="beijing"></el-option>
|
layout="prev, pager, next"
|
||||||
</el-select>
|
:total="1000">
|
||||||
</el-form-item>
|
</el-pagination>
|
||||||
|
</div>
|
||||||
</el-col> -->
|
|
||||||
<!-- <el-col :span="6">
|
|
||||||
|
|
||||||
<el-form-item label="时间">
|
|
||||||
<el-date-picker
|
|
||||||
v-model="value1"
|
|
||||||
type="daterange"
|
|
||||||
range-separator="至"
|
|
||||||
start-placeholder="开始日期"
|
|
||||||
end-placeholder="结束日期">
|
|
||||||
</el-date-picker>
|
|
||||||
</el-form-item>
|
|
||||||
|
|
||||||
</el-col> -->
|
|
||||||
<el-col :span="4">
|
|
||||||
<el-button type="primary" icon="el-icon-search" @click="getlist()">搜索</el-button>
|
|
||||||
<el-button type="" icon="el-icon-refresh" @click="res()">重置</el-button>
|
|
||||||
|
|
||||||
|
|
||||||
</el-col>
|
|
||||||
|
|
||||||
</el-form>
|
|
||||||
|
|
||||||
</el-row>
|
|
||||||
|
|
||||||
</el-card>
|
</el-card>
|
||||||
|
|
||||||
<el-card style="margin-top: 20px" v-for="(item,index) in arrlist" :key="index">
|
<el-card style="margin-top: 20px" v-for="(item,index) in arrlist" :key="index">
|
||||||
<div slot="header" class="clearfix">
|
<div slot="header" class="clearfix">
|
||||||
<span>{{item.storeName || ''}}</span>
|
<span>{{item.storeName || ''}}</span>
|
||||||
<!-- <el-button style="float: right; padding: 3px 0" type="text">进入</el-button>-->
|
|
||||||
</div>
|
</div>
|
||||||
<div class="box-wrap">
|
<div class="box-wrap">
|
||||||
<div class="zong-box" v-for="(items,index) in item.storeList" :key="index" >
|
<div class="zong-box" v-for="(items,index) in item.storeList" :key="index" >
|
||||||
@ -118,6 +204,41 @@ export default {
|
|||||||
dicts: ['zhzt'],
|
dicts: ['zhzt'],
|
||||||
data(){
|
data(){
|
||||||
return{
|
return{
|
||||||
|
total:0,
|
||||||
|
options: [{
|
||||||
|
value: '选项1',
|
||||||
|
label: '黄金糕'
|
||||||
|
}, {
|
||||||
|
value: '选项2',
|
||||||
|
label: '双皮奶'
|
||||||
|
}, {
|
||||||
|
value: '选项3',
|
||||||
|
label: '蚵仔煎'
|
||||||
|
}, {
|
||||||
|
value: '选项4',
|
||||||
|
label: '龙须面'
|
||||||
|
}, {
|
||||||
|
value: '选项5',
|
||||||
|
label: '北京烤鸭'
|
||||||
|
}],
|
||||||
|
value: '',
|
||||||
|
tableData: [{
|
||||||
|
date: '2016-05-02',
|
||||||
|
name: '王小虎',
|
||||||
|
address: '上海市普陀区金沙江路 1518 弄'
|
||||||
|
}, {
|
||||||
|
date: '2016-05-04',
|
||||||
|
name: '王小虎',
|
||||||
|
address: '上海市普陀区金沙江路 1517 弄'
|
||||||
|
}, {
|
||||||
|
date: '2016-05-01',
|
||||||
|
name: '王小虎',
|
||||||
|
address: '上海市普陀区金沙江路 1519 弄'
|
||||||
|
}, {
|
||||||
|
date: '2016-05-03',
|
||||||
|
name: '王小虎',
|
||||||
|
address: '上海市普陀区金沙江路 1516 弄'
|
||||||
|
}],
|
||||||
form: {
|
form: {
|
||||||
name: '',
|
name: '',
|
||||||
region: '',
|
region: '',
|
||||||
@ -183,7 +304,7 @@ export default {
|
|||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
/* height: 100vh; */
|
/* height: 100vh; */
|
||||||
background: white;
|
background: #f9f9f9;
|
||||||
}
|
}
|
||||||
.ding-top{
|
.ding-top{
|
||||||
width: 100%;
|
width: 100%;
|
||||||
@ -263,4 +384,15 @@ export default {
|
|||||||
text-align: center;
|
text-align: center;
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
}
|
}
|
||||||
|
.top-box{
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
}
|
||||||
|
.d-s{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@ -269,12 +269,6 @@
|
|||||||
</el-form-item>
|
</el-form-item>
|
||||||
</div>
|
</div>
|
||||||
<div style="margin-left: 80px">启用成功后其他规则的规则状态变为停用！</div>
|
<div style="margin-left: 80px">启用成功后其他规则的规则状态变为停用！</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
|
|
||||||
</el-form>
|
</el-form>
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user