Skip to content

R
rs-cloud-platform-ui
Commit 05d95699 authored by lixy's avatar lixy
Browse files
Options

Merge branch 'master' of http://113.105.137.151:22280/zhoujw/rs-cloud-platform-ui

parents 29b45057 1e0df149
Hide whitespace changes
Inline Side-by-side
Showing with 782 additions and 59 deletions
package-lock.json
View file @ 05d95699
...@@ -4572,6 +4572,11 @@ ...@@ -4572,6 +4572,11 @@
"integrity": "sha512-F/1DnUGPopORZi0ni+CvrCgHQ5FyEAHRLSApuYWMmrbSwoN2Mn/7k+Gl38gJnR7yyDZk6WLXwiGod1JOWNDKGw==", "integrity": "sha512-F/1DnUGPopORZi0ni+CvrCgHQ5FyEAHRLSApuYWMmrbSwoN2Mn/7k+Gl38gJnR7yyDZk6WLXwiGod1JOWNDKGw==",
"dev": true "dev": true
}, },
"highlight.js": {
"version": "9.18.5",
"resolved": "https://registry.npm.taobao.org/highlight.js/download/highlight.js-9.18.5.tgz",
"integrity": "sha1-0Yo1mGfzeME41oGe38KorNXymCU="
},
"hmac-drbg": { "hmac-drbg": {
"version": "1.0.1", "version": "1.0.1",
"resolved": "https://registry.npmjs.org/hmac-drbg/-/hmac-drbg-1.0.1.tgz", "resolved": "https://registry.npmjs.org/hmac-drbg/-/hmac-drbg-1.0.1.tgz",
...@@ -10617,6 +10622,15 @@ ...@@ -10617,6 +10622,15 @@
"integrity": "sha1-IpnwLG3tMNSllhsLn3RSShj2NPw=", "integrity": "sha1-IpnwLG3tMNSllhsLn3RSShj2NPw=",
"dev": true "dev": true
}, },
"vcolorpicker": {
"version": "1.0.3",
"resolved": "https://registry.npm.taobao.org/vcolorpicker/download/vcolorpicker-1.0.3.tgz",
"integrity": "sha1-7qbNU7tZnOY8KEZSLW2D1rFdZJI=",
"requires": {
"highlight.js": "^9.12.0",
"vue": "^2.5.17"
}
},
"vendors": { "vendors": {
"version": "1.0.4", "version": "1.0.4",
"resolved": "https://registry.npmjs.org/vendors/-/vendors-1.0.4.tgz", "resolved": "https://registry.npmjs.org/vendors/-/vendors-1.0.4.tgz",
......
src/api/website/aboutUs/index.js 0 → 100644
View file @ 05d95699
import fetch from 'utils/fetch';
// 获取详情
export function getCompanyInfo(params) {
return fetch({
url: "/api/website/companyInfo",
method: 'get',
params: params
})
}
//编辑详情
export function setCompanyInfo(params){
return fetch({
url: "/api/website/companyInfo/addUpdate/",
method: 'post',
data: params
})
}
\ No newline at end of file
src/api/website/industryApplication/index.js
View file @ 05d95699
/* /*
* @Author: Jenkins * @Author: Jenkins
* @Date: 2020-12-02 09:20:18 * @Date: 2020-12-02 09:20:18
* @LastEditTime: 2020-12-08 17:59:51 * @LastEditTime: 2020-12-18 10:34:09
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: 行业应用页请求接口 * @Description: 行业应用页请求接口
* @FilePath: \rs-cloud-platform-ui\src\api\wsmanagement\industryApplication\index.js * @FilePath: \rs-cloud-platform-ui\src\api\wsmanagement\industryApplication\index.js
...@@ -68,3 +68,27 @@ export function addUpdateApplicationInfo(obj){ ...@@ -68,3 +68,27 @@ export function addUpdateApplicationInfo(obj){
data: obj data: obj
}); });
} }
/**
* 新增或更新交易保障
* @param {Object} obj
*/
export function addUpdateProtection(obj){
return fetch({
url: "/api/website/commonInfo/addUpdate",
method: "post",
data: obj
})
}
/**
* 获取分页的交易保障
* @param {Object} obj
*/
export function getListProtections(obj){
return fetch({
url: "/api/website/commonInfo/getAll",
method: "get",
param: obj
})
}
\ No newline at end of file
src/main.js
View file @ 05d95699
...@@ -66,11 +66,17 @@ import '../static/utf8-jsp/lang/zh-cn/zh-cn.js' ...@@ -66,11 +66,17 @@ import '../static/utf8-jsp/lang/zh-cn/zh-cn.js'
import '../static/utf8-jsp/ueditor.parse.min.js' import '../static/utf8-jsp/ueditor.parse.min.js'
import Viewer from 'v-viewer' import Viewer from 'v-viewer'
import 'viewerjs/dist/viewer.css' import 'viewerjs/dist/viewer.css'
Vue.use(Viewer, { Vue.use(Viewer, {
defaultOptions: { defaultOptions: {
zIndex: 9999 zIndex: 9999
} }
}) })
// 颜色选择器
import vcolorpicker from 'vcolorpicker'
Vue.use(vcolorpicker)
import VCharts from 'v-charts' import VCharts from 'v-charts'
Vue.use(VCharts) Vue.use(VCharts)
// register globally // register globally
......
src/router/index.js
View file @ 05d95699
...@@ -121,6 +121,11 @@ export const asyncRouterMap = [{ ...@@ -121,6 +121,11 @@ export const asyncRouterMap = [{
component: _import('webSiteManagement/industryApplication/applicationCate/index'), component: _import('webSiteManagement/industryApplication/applicationCate/index'),
name: '类别管理', name: '类别管理',
authority: 'applicationCate' authority: 'applicationCate'
},{
path: 'transactionProtection',
component: _import('webSiteManagement/industryApplication/transactionProtection/index'),
name: '交易保障',
authority: 'transactionProtection'
}], }],
}, },
{ {
......
src/views/webSiteManagement/aboutUs/index.vue
View file @ 05d95699
<!-- <!--
* @Author: your name * @Author: your name
* @Date: 2020-12-01 09:07:41 * @Date: 2020-12-01 09:07:41
* @LastEditTime: 2020-12-04 15:18:16 * @LastEditTime: 2020-12-18 13:19:25
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: In User Settings Edit * @Description: In User Settings Edit
* @FilePath: \rs-cloud\src\views\webSiteManagement\aboutUs.vue * @FilePath: \rs-cloud\src\views\webSiteManagement\aboutUs.vue
...@@ -80,7 +80,11 @@ ...@@ -80,7 +80,11 @@
</div> </div>
</template> </template>
<script type="javascript"> <script>
import {
getCompanyInfo,
setCompanyInfo,
} from "@/api/website/aboutUs/index";
import KindEditor from "@/components/Kindeditor"; import KindEditor from "@/components/Kindeditor";
import loadBMap from '@/utils/loadBMap.js' import loadBMap from '@/utils/loadBMap.js'
import { addUpdate, companyInfo } from "api/website/aboutUs" import { addUpdate, companyInfo } from "api/website/aboutUs"
...@@ -140,7 +144,7 @@ export default { ...@@ -140,7 +144,7 @@ export default {
}, },
async mounted() { async mounted() {
await loadBMap('gvQPveN9YrlPSgKUMPK2u2u2BA4yQFRm') await loadBMap('gvQPveN9YrlPSgKUMPK2u2u2BA4yQFRm')
this.getCompanyInfo() // 获取关于我们详情 this.initMap()
}, },
methods: { methods: {
/** /**
......
src/views/webSiteManagement/bannerSetting/index.vue
View file @ 05d95699
...@@ -56,11 +56,20 @@ ...@@ -56,11 +56,20 @@
<!-- 分页 --> <!-- 分页 -->
<div class="page-foot"> <div class="page-foot">
<el-pagination <el-pagination
@size-change="handleSizeChange"
@current-change="currentChange"
:current-page.sync="listQuery.page"
:page-sizes="[10, 20, 30, 40]"
:page-size="listQuery.limit"
layout="total, sizes, prev, pager, next, jumper"
:total="total">
</el-pagination>
<!-- <el-pagination
background background
layout="prev, pager, next" layout="prev, pager, next"
:page-size="listQuery.limit" :page-size="listQuery.limit"
:total="total" @current-change="currentChange"> :total="total" @current-change="currentChange">
</el-pagination> </el-pagination> -->
</div> </div>
<!-- 使用图片查看器预览当前缩略图 --> <!-- 使用图片查看器预览当前缩略图 -->
...@@ -140,6 +149,11 @@ export default { ...@@ -140,6 +149,11 @@ export default {
this.getList()//获取数据 this.getList()//获取数据
}, },
methods: { methods: {
handleSizeChange(val) {
this.listQuery.limit = val
this.getList();
},
closePreview() { closePreview() {
this.currentIcon.showPreview = false; this.currentIcon.showPreview = false;
}, },
...@@ -180,27 +194,6 @@ export default { ...@@ -180,27 +194,6 @@ export default {
} }
this.getList() this.getList()
}, },
// //清除搜索
// filterData() {
// if (this.searchForm.status === 0 && this.searchForm.title === '') {
// this.list = this.data;
// return ;
// }
// let temp = this.data.filter(v => this.searchForm.status === 0 ? true: !!(this.searchForm.status === v.status))
// if (!!this.searchForm.title) {
// temp = temp.filter(v => v.title.includes(this.searchForm.title))
// }
// this.list = temp
// },
// //清除搜索
// clearFilterData() {
// this.searchForm = {
// status: 0,
// title: ""
// }
// this.list = this.data;
// },
//切换页码 //切换页码
currentChange(val) { currentChange(val) {
this.listQuery.page = val; this.listQuery.page = val;
...@@ -210,14 +203,7 @@ export default { ...@@ -210,14 +203,7 @@ export default {
edit(row) { edit(row) {
this.dialogTitle = "编辑banner"; this.dialogTitle = "编辑banner";
this.formObject.formVal = this.filterParams(row) this.formObject.formVal = this.filterParams(row)
// this.formObject = {
// formVal: this.filterParams(row),
// rules: this.formObject.rules,//表单规则
// formItem: banner.formInfo,//表单项。
// }
this.dialogVisible = true; this.dialogVisible = true;
// console.log(this.formObject.formVal)
}, },
closeDialog() { closeDialog() {
this.$bus.$emit('upload-clearFiles') this.$bus.$emit('upload-clearFiles')
...@@ -245,24 +231,6 @@ export default { ...@@ -245,24 +231,6 @@ export default {
this.formObject.formVal = banner.init(); this.formObject.formVal = banner.init();
}, },
// //打开弹窗
// onOpen() {
// this.$nextTick(() => {
// this.formObject = {
// formVal: {
// title: "",
// cover: "",
// rank: "",
// url: "",
// status: 1,
// jumpType: 0,
// jumpId: '',
// },
// rules: this.formObject.rules,//表单规则
// formItem: banner.formInfo,//表单项。
// }
// })
// },
filterParams(row) { filterParams(row) {
let a = {}; let a = {};
for (let i in this.formObject.formVal) { for (let i in this.formObject.formVal) {
...@@ -329,8 +297,6 @@ export default { ...@@ -329,8 +297,6 @@ export default {
cursor: pointer; cursor: pointer;
} }
.page-foot { .page-foot {
display: flex;
justify-content: center;
margin-top: 20px; margin-top: 20px;
} }
</style> </style>
src/views/webSiteManagement/imageLibrary/list.vue
View file @ 05d95699
...@@ -48,12 +48,21 @@ ...@@ -48,12 +48,21 @@
<div class="page-foot"> <div class="page-foot">
<el-pagination <el-pagination
@size-change="handleSizeChange"
@current-change="currentChange"
:current-page.sync="listQuery.page"
:page-sizes="[10, 20, 30, 40]"
:page-size="listQuery.limit"
layout="total, sizes, prev, pager, next, jumper"
:total="~~total">
</el-pagination>
<!-- <el-pagination
background background
layout="prev, pager, next" layout="prev, pager, next"
:total="~~total" :total="~~total"
:current-page="listQuery.page" :current-page="listQuery.page"
@current-change="currentChange"> @current-change="currentChange">
</el-pagination> </el-pagination> -->
</div> </div>
</div> </div>
...@@ -106,6 +115,11 @@ export default { ...@@ -106,6 +115,11 @@ export default {
this.getList() this.getList()
}, },
methods: { methods: {
handleSizeChange(val) {
this.listQuery.limit = val
this.getList();
},
changePageInfo(page) { changePageInfo(page) {
// this.listQuery = page; // this.listQuery = page;
this.$emit('recordPageInfo', page) this.$emit('recordPageInfo', page)
...@@ -244,8 +258,6 @@ export default { ...@@ -244,8 +258,6 @@ export default {
height: auto; height: auto;
} }
.page-foot { .page-foot {
display: flex;
justify-content: center;
margin-top: 20px; margin-top: 20px;
} }
</style> </style>
src/views/webSiteManagement/industryApplication/transactionProtection/index.vue 0 → 100644
View file @ 05d95699
<!--
* @Author: your name
* @Date: 2020-12-17 16:06:03
* @LastEditTime: 2020-12-18 13:15:37
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: \rs-cloud-platform-ui\src\views\webSiteManagement\industryApplication\transactionProtection\index.vue
-->
<template>
<div id="TransactionProtection">
<!-- 操作表格栏 -->
<div class="operators">
<div class="searchList">
<div class="theme">
<span>保障标题</span>
<el-col :span="16">
<el-input
v-model="currentTheme"
placeholder="请输入保障标题"
size="100px"
></el-input>
</el-col>
</div>
<div class="controls">
<div
class="item"
v-for="(item, index) in operatorControls"
:key="index"
@click.stop="clickOperator(index)"
>
{{ item.name }}
</div>
</div>
</div>
<div class="addCate">
<div class="add" @click.stop="addProtect">新增保障</div>
</div>
</div>
<!-- 添加与修改弹框 -->
<el-dialog
:title="managerTitle"
:visible.sync="managerVisible"
append-to-body
>
<div id="manager">
<el-form ref="form" :rules="rules" :model="form" label-width="80px">
<el-form-item label="排序" prop="rank">
<el-col :span="12">
<el-input
type="number"
v-model="form.rank"
placeholder="请输入排序号"
></el-input>
</el-col>
</el-form-item>
<el-form-item label="标题" prop="title">
<el-col :span="12">
<el-input
v-model="form.title"
placeholder="请输入标题"
></el-input>
</el-col>
<el-col :span="6">
<div class="colorPicker">
<colorPicker
v-model="form.color"
@change="handleChangeColor"
></colorPicker>
</div>
</el-col>
</el-form-item>
<el-form-item label="内容" prop="content">
<el-col :span="24">
<div
class="content"
v-for="(item, index) in form.detail"
:key="index"
>
<el-input
v-model="item.content"
placeholder="请输入内容"
></el-input>
<div class="operators">
<i
class="el-icon-delete"
v-show="form.detail.length > 1"
@click.stop="removeContent(index)"
></i>
<div
class="addContent"
v-show="index == form.detail.length - 1"
@click.stop="addContent"
>
<i class="el-icon-plus"></i>添加内容
</div>
</div>
</div>
</el-col>
</el-form-item>
<el-form-item>
<el-button @click="closeManager">取消</el-button>
<el-button type="primary" @click="onSubmit">确定</el-button>
</el-form-item>
</el-form>
</div>
</el-dialog>
<!-- 表格数据 -->
<div class="table">
<el-table
:data="tableData"
border
fit
highlight-current-row
style="width: 100%"
>
<el-table-column
label="序号"
prop="index"
align="center"
></el-table-column>
<el-table-column
label="保障标题"
prop="title"
align="center"
></el-table-column>
<el-table-column label="保障内容" align="center">
<template slot-scope="scope">
<div v-html="scope.row.content">
{{scope.row.content}}
</div>
</template>
</el-table-column>
<el-table-column
label="发布时间"
prop="updTime"
align="center"
></el-table-column>
<el-table-column
label="排序"
prop="rank"
align="center"
></el-table-column>
<el-table-column label="状态" width="100" align="center">
<template slot-scope="scope">
<span>{{ scope.row.status == 1 ? "上架" : "下架" }}</span>
</template>
</el-table-column>
<el-table-column label="操作" width="150" align="center">
<template slot-scope="scope">
<span>
<div class="operators">
<div class="edit" @click.stop="editProtection(scope.row)">编辑</div>
<div
class="offshelf"
v-if="scope.row.status == 1"
@click.stop="changeStatus(scope.row)"
>
下架
</div>
<div class="upshelf" v-else @click.stop="changeStatus(scope.row)">上架</div>
<div class="delete" @click.stop="delInfo(scope.row)">删除</div>
</div>
</span>
</template>
</el-table-column>
</el-table>
</div>
<div class="pagination">
<el-pagination
@size-change="changeHandleSize"
@current-change="changeHandleCurrent"
:current-page.sync="pagination.currentPage"
:page-sizes="[10, 20, 30, 40]"
:page-size="pagination.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="pagination.total"
>
</el-pagination>
</div>
</div>
</template>
<script>
import {
addUpdateProtection,
getListProtections,
} from "api/website/industryApplication/index";
import elementVue from '../../../admin/menu/components/element.vue';
export default {
name: "TransactionProtection",
components: {},
data() {
return {
currentTheme: "",
// 功能按钮
operatorControls: [
{
name: "搜索",
},
{
name: "清空搜索",
},
],
managerTitle: "交易保障", // 修改交易保障
managerVisible: false,
rules: {
rank: [{ required: true, message: "请输入排序号", trigger: "blur" }],
title: [{ required: true, message: "请输入标题", trigger: "blur" }],
content: [{ required: true, message: "请输入内容", trigger: "blur" }],
},
currentEidtInfo: "",
form: {
rank: "",
title: "",
detail: [
{
content: "",
},
],
color: "#000000",
},
tableDataCache: [],
tableData: [
// {
// index: 1,
// title: "保障标题",
// detail: "保障内容",
// updTime: "发布时间",
// rank: 100,
// status: 1,
// },
],
pagination: {
total: 0,
pageSize: 10,
currentPage: 0
},
};
},
watch: {
managerVisible(newVal){
if(!newVal){
this.form.rank = ""
this.form.title = ""
this.form.detail = [{content:""}]
this.form.color = ""
}
},
},
mounted() {
this.pullListProtections()
},
methods: {
pullListProtections(){
getListProtections({
page: this.pagination.currentPage,
limit: this.pagination.pageSize
}).then(res => {
if(res.status == 200){
console.log("获取的保障分页数据为=>",res)
this.tableDataCache = []
this.pagination.total = res.data.totalCount
res.data.data.forEach(element => {
this.tableDataCache.push(element)
})
this.screenListProtections()
}
})
},
screenListProtections(){
this.tableData = []
let index = 0
this.tableDataCache.forEach(element => {
this.tableData.push({
content: this.transDetailToContent(element.detail),
index: ((this.pagination.currentPage-1)*this.pagination.pageSize)+(++index),
id: element.id,
title: element.title,
crtTime: element.crtTime,
updTime: element.updTime,
detail: element.detail,
isDel: element.isDel,
rank: element.rank,
status: element.status,
type: element.type,
color: !!element.color ? element.color : "#000000"
})
})
if(this.currentTheme!=""){
this.tableData = this.tableData.filter(element => {
//正则表达式
let reg = new RegExp(this.currentTheme);
return element.title.match(reg)
})
}
},
changeStatus(info){
let message = ""
if(info.status == 1){
info.status = 2
message = "下架成功!!!"
}else{
info.status = 1
message = "上架成功!!!"
}
addUpdateProtection({
type: info.type,
title: info.title,
detail: info.detail,
status: info.status,
isDel: info.isDel,
color: info.color,
rank: info.rank,
id: info.id,
}).then((res) => {
if (res.status == 200) {
this.$message({
message: message,
type: "success",
});
this.pullListProtections()
}else{
this.$message.error('操作失败,请稍后重试!!!');
}
});
},
delInfo(info){
this.$confirm('确定继续执行该操作吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
addUpdateProtection({
type: info.type,
title: info.title,
detail: info.detail,
status: info.status,
isDel: 1,
color: info.color,
rank: info.rank,
id: info.id,
}).then((res) => {
if (res.status == 200) {
this.$message({
message: "删除成功!!!",
type: "success",
});
this.pullListProtections()
}else{
this.$message.error('操作失败,请稍后重试!!!');
}
});
})
},
changeHandleSize(val) {
// console.log(`每页 ${val} 条`);
this.pagination.pageSize = val
this.pullListApplicationType()
},
changeHandleCurrent(val) {
// console.log(`当前页: ${val}`);
this.pagination.currentPage = val
this.pullListProtections()
},
clickOperator(index) {
console.log("index=>", index);
if (index == 1) {
this.currentTheme = ""
}
this.screenListProtections()
},
addProtect() {
this.managerTitle = "交易保障"
this.managerVisible = true;
},
editProtection(info){
this.managerTitle = "修改交易保障"
let detail = JSON.parse(info.detail)
this.managerVisible = true;
this.form.rank = info.rank
this.form.title = info.title
this.form.detail = Array.isArray(detail) ? detail : [{content:""}]
this.form.color = !!info.color ? info.color : ""
this.currentEidtInfo = info
},
closeManager() {
this.managerVisible = false;
},
onSubmit() {
if (this.form.rank == "") {
this.$message.error("请输入序号!!!");
} else if (this.form.title == "") {
this.$message.error("请输入保障标题!!!");
} else if (this.detailHasNull()) {
this.$message.error("保障内容有缺值,请输入!!!");
} else {
let data,message
if(this.managerTitle=="交易保障"){
data = {
rank: this.form.rank,
type: 1, // 类型，1、交易保障，暂时默认值为1
title: this.form.title,
detail: JSON.stringify(this.form.detail),
status: 1, // 默认为启用
color: this.form.color,
}
message = "添加成功!!!"
}else{
data = {
type: this.currentEidtInfo.type,
title: this.form.title,
detail: JSON.stringify(this.form.detail),
status: this.currentEidtInfo.status,
isDel: this.currentEidtInfo.isDel,
color: this.form.color,
rank: this.form.rank,
id: this.currentEidtInfo.id,
}
message = "修改成功!!!"
}
addUpdateProtection(data).then((res) => {
if (res.status == 200) {
this.$message({
message: message,
type: "success",
});
this.pullListProtections()
this.managerVisible = false;
}
});
}
},
detailHasNull() {
let bool = false;
this.form.detail.forEach((element) => {
if (element.content == "") {
bool = true;
}
});
return bool;
},
transDetailToContent(detail){
let contents = JSON.parse(detail)
let content = ""
if(contents.constructor==Array){
if(contents.length>1){
contents.forEach((element,index) => {
content += (index+1) + "." + element.content + "<br/>"
})
}else{
contents.forEach((element,index) => {
content += element.content
})
}
}else{
content = detail
}
return content
},
handleChangeColor(val) {
console.log("输出颜色值", val); // 颜色 #6c8198
},
addContent() {
this.form.detail.push({
content: "",
});
},
removeContent(index) {
this.form.detail.splice(index, 1);
},
},
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
#manager {
padding: 0 5%;
width: 90%;
height: auto;
.content {
padding: 2px 0;
width: auto;
height: 100%;
display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: center;
.operators {
padding: 0 5px;
width: 130px;
height: 100%;
display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: center;
.el-icon-delete {
cursor: pointer;
}
.addContent {
padding-left: 5px;
width: auto;
height: auto;
cursor: pointer;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
}
}
}
.colorPicker {
width: 100%;
height: auto;
padding: 5px;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
/deep/.m-colorPicker {
text-align: center;
/deep/.colorBtn {
width: 80px;
height: 30px;
padding: 0 10px;
}
}
}
}
#TransactionProtection {
margin: 0 1% 0 1%;
width: 98%;
height: auto;
.operators {
// margin: 0 1% 0 1%;
width: 100%;
height: 68px;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
.searchList {
width: auto;
height: 100%;
display: flex;
flex-direction: row;
justify-content: space-around;
align-items: center;
.theme {
width: auto;
height: 46px;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
overflow: hidden;
span {
margin: 0 10px 0 20px;
}
}
.controls {
margin-left: 40px;
width: 260px;
height: 46px;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
.item {
width: 120px;
height: 36px;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
font-weight: 400;
color: #5178f2;
border: 1px solid #5178f2;
border-radius: 5px;
cursor: pointer;
}
}
}
.addCate {
width: 240px;
height: 46px;
display: flex;
flex-direction: row;
justify-content: flex-end;
align-items: center;
overflow: hidden;
.add {
width: 50%;
height: 36px;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
border-radius: 5px;
background-color: #5178f2;
color: #ffffff;
cursor: pointer;
}
}
}
.table {
margin: 1% 1% 0 1%;
width: 98%;
height: auto;
span {
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
.icon {
width: 50px;
height: 50px;
object-fit: cover;
cursor: pointer;
}
.operators {
width: 300px;
height: 46px;
display: flex;
flex-direction: row;
justify-content: space-around;
align-items: center;
.edit,
.upshelf,
.offshelf,
.delete {
width: auto;
height: 36px;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
cursor: pointer;
}
.edit,
.upshelf {
color: #1890ff;
}
.offshelf {
color: #a6a9ad;
}
.delete {
color: #fe4066;
}
}
}
}
.pagination{
margin: 1% 1% 0 1%;
width: 98%;
height: auto;
}
}
</style>
\ No newline at end of file
src/views/webSiteManagement/satelliteIntroduction/list.vue
View file @ 05d95699
...@@ -52,12 +52,21 @@ ...@@ -52,12 +52,21 @@
/> />
<div class="page-foot"> <div class="page-foot">
<el-pagination <el-pagination
@size-change="handleSizeChange"
@current-change="currentChange"
:current-page.sync="listQuery.page"
:page-sizes="[10, 20, 30, 40]"
:page-size="listQuery.limit"
layout="total, sizes, prev, pager, next, jumper"
:total="~~total">
</el-pagination>
<!-- <el-pagination
background background
layout="prev, pager, next" layout="prev, pager, next"
:page-size="listQuery.limit" :page-size="listQuery.limit"
:current-page="listQuery.page" :current-page="listQuery.page"
:total="total" @current-change="currentChange"> :total="total" @current-change="currentChange">
</el-pagination> </el-pagination> -->
</div> </div>
</div> </div>
...@@ -109,6 +118,11 @@ export default { ...@@ -109,6 +118,11 @@ export default {
this.getList() this.getList()
}, },
methods: { methods: {
handleSizeChange(val) {
this.listQuery.limit = val
this.getList();
},
showPreview(url) { showPreview(url) {
this.currentIcon.url = url; this.currentIcon.url = url;
this.currentIcon.showPreview = true; this.currentIcon.showPreview = true;
...@@ -246,8 +260,6 @@ export default { ...@@ -246,8 +260,6 @@ export default {
cursor: pointer; cursor: pointer;
} }
.page-foot { .page-foot {
display: flex;
justify-content: center;
margin-top: 20px; margin-top: 20px;
} }
</style> </style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment