Skip to content

R
rs-cloud-platform-ui
Commit 5109062d authored by obt's avatar obt
Browse files
Options

行业应用页面代码更新

parents e33c8909 7d53af86
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 472 additions and 484 deletions
src/api/website/imageLibrary/index.js
View file @ 5109062d
import fetch from 'utils/fetch';
//获取影像图库列表
export function page(query) {
return fetch({
url: '/api/website/imageImgStorage/getList',
......@@ -7,7 +7,7 @@ export function page(query) {
params: query
});
}
//新增或修改影像图库
export function update(query) {
return fetch({
url: '/api/website/imageImgStorage/addUpdate',
......@@ -15,3 +15,19 @@ export function update(query) {
data: query
});
}
//获取所有相似图像
export function getAll(query) {
return fetch({
url: '/api/website/imageInfoRelation/getAll',
method: 'get',
params: query
});
}
///api/website/imageImgStorage/getDetail/{id}
export function getDetail(query) {
return fetch({
url: `/api/website/imageImgStorage/getDetail/${query}`,
method: 'get'
});
}
src/api/website/industryApplication/index.js
View file @ 5109062d
/*
* @Author: Jenkins
* @Date: 2020-12-02 09:20:18
* @LastEditTime: 2020-12-08 14:59:18
* @LastEditTime: 2020-12-08 17:59:51
* @LastEditors: Please set LastEditors
* @Description: 行业应用页请求接口
* @FilePath: \rs-cloud-platform-ui\src\api\wsmanagement\industryApplication\index.js
......@@ -11,7 +11,7 @@ import fetch from 'utils/fetch';
/**
* 获取所有行业应用类型
* @param {Object} indexShow
* @param {Object} indexShow
*/
export function getAllApplicationType(obj){
return fetch({
......@@ -29,13 +29,13 @@ export function getListApplicationType(obj){
return fetch({
url: '/api/website/industryApplicationType/getList',
method: 'get',
param: obj
params: obj
});
}
/**
* 新增或更新行业应用类型
* @param {Object} obj
* @param {Object} obj
*/
export function addUpdateApplicationType(obj){
return fetch({
......@@ -47,19 +47,19 @@ export function addUpdateApplicationType(obj){
/**
* 分页获取行业应用信息
* @param {Object} obj
* @param {Object} obj
*/
export function getListApplicationInfo(obj){
return fetch({
url: '/api/website/industryApplicationInfo/getList',
method: 'get',
param: obj
params: obj
});
}
/**
* 新增或更新行业应用信息
* @param {Object} obj
* @param {Object} obj
*/
export function addUpdateApplicationInfo(obj){
return fetch({
......
src/components/CustomForm/index.vue
View file @ 5109062d
<!--
* @Author: your name
* @Description: 该组件，为表单组件。
* 关联js：@/utils/formDatas.js
* 使用到该组件的地方：
* 在@/views/webSiteManagement/bannerSetting/index.vue中使用 轮播图设置
* 在@/views/webSiteManagement/satelliteIntroduction/index.vue中使用 卫星介绍
* 在@/views/webSiteManagement/imageLibrary/index.vue中使用 影像图库
-->
<template>
<el-form
ref="ruleForm"
......@@ -20,7 +29,7 @@
</div>
<!-- 自定义 -->
<div v-else-if="item.type && item.type == 'custom'">
<custom-input ref="customInput" :value="getForm.formVal" @input="getCustomInput" @reset="resetParams"></custom-input>
<custom-input ref="customInput" :value="getForm.formVal" @input="getCustomInput"></custom-input><!-- @input="getCustomInput" @reset="resetParams"-->
</div>
<div v-else-if="item.type && item.type == 'kindEditor'">
......@@ -62,6 +71,16 @@ export default {
content: ""
}
},
// watch: {
// formData: {
// handler(newVal, oldVal) {
// console.log(22, newVal, oldVal)
// this.getForm = newVal
// // this.$set(this, 'getForm', newVal)
// }
// },
// deep: true
// },
computed: {
getForm() {
this.$nextTick(() => this.$refs.ruleForm.resetFields())
......@@ -70,7 +89,6 @@ export default {
},
methods: {
onContentChange (val) {
console.log(val)
this.getForm.formVal.content = val;
},
afterChange () {
......@@ -84,11 +102,15 @@ export default {
//获取图片链接
getSrc(index, val) {
let formVal = this.getForm.formVal
// console.log(index, val)
formVal[index] = val
// this.$set(this.getForm.formVal, index, val)
},
//获取自定义组件值
getCustomInput(val) {
let formVal = this.getForm.formVal
formVal.jumpType = val.jumpType;
if (val.jumpType == 1) {
formVal.url = val.value
} else {
......@@ -112,7 +134,7 @@ export default {
//校验自定义input
checkCustom() {
let form = this.getForm.formVal;
// console.log('自定义input', this.getForm.formVal)
if (form.jumpType === 1 && form.url == '') {
this.$refs.customInput[0].showErr('请输入链接地址')
return false
......
src/components/CustomInput/index.vue
View file @ 5109062d
This diff is collapsed.
src/components/Upload/singleImageX.vue
View file @ 5109062d
<template>
<div class="upload-container">
<el-upload
v-show="!imageUrl"
ref="upload"
v-show="!value"
:ref="refName"
drag
v-loading="uploading"
action="#"
......@@ -14,9 +14,9 @@
<div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
<div class="el-upload__text">只能上传1个文件</div>
</el-upload>
<div class="image-preview" v-show="imageUrl">
<div class="image-preview" v-show="value">
<div class="image-preview-wrapper">
<img :src="imageUrl" />
<img :src="value" />
<div class="image-preview-action">
<i @click="rmImage" class="el-icon-delete"></i>
</div>
......@@ -29,12 +29,16 @@
// 预览效果见专题
import { uploadFile } from "@/api/website/newsCategory/index";
export default {
name: "singleImageUpload2",
name: "singleImageX",
props: {
refName: {
type: String,
default: 'upload'
},
//图片地址
value: {
type: String,
default: "",
default: () => "",
},
},
data() {
......@@ -42,26 +46,39 @@ export default {
uploading: false
};
},
computed: {
imageUrl() {
return (!!this.value) ? this.value : ""
}
mounted() {
this.$bus.$on('upload-clearFiles', this.clearFiles)
},
beforeDestroy() {
this.$bus.$off('upload-clearFiles')
},
methods: {
//清空上传过的图片
clearFiles() {
this.$refs[this.refName].clearFiles()
},
//删除图片
rmImage() {
this.$refs.upload.clearFiles()
this.emitFunc("");
this.clearFiles();
this.emitFunc("", null);
},
//上传请求
onUploadRequest(data) {
this.uploading = true;
let fileObj = data.file;
console.log(data)
//获取图片详情信息
let imgInfo = {};
let temp = URL.createObjectURL(fileObj)
let img = new Image();
img.src = temp;
console.log(img.width, img.height)
img.onload = function () {
imgInfo.width = img.width;
imgInfo.height = img.height;
}
imgInfo.size = fileObj.size;
imgInfo.type = fileObj.type;
// FormData 对象
let form = new FormData();
......@@ -72,16 +89,16 @@ export default {
this.uploading = false;
if (res.status == 200) {
this.emitFunc(res.data)
this.emitFunc(res.data, imgInfo)
} else {
this.emitFunc("");
this.emitFunc("", null);
this.$message.error(res.message)
}
})
},
//组件通信
emitFunc(val) {
this.$emit('input', val)
emitFunc(val, info = null) {
this.$emit('input', val, info)
}
},
};
......
src/utils/formDatas.js
View file @ 5109062d
......@@ -19,7 +19,6 @@ let radioGroup = {
}
}
//banner表单项
export const banner = {
init: () => ({
......@@ -98,48 +97,48 @@ export const satelliteIntroduction = {
//影像图库
export const imageLibrary = {
init: () => ({
name: "",//标题名称
coverImg: "",//封面图
detailImg: "",//详情图
//产品分类
//影像分类
//文件格式
//分辨率
//拍摄地点
//拍摄时间
//可否商用
//是否水印
// //影像图库
// export const imageLibrary = {
// init: () => ({
// name: "",//标题名称
// coverImg: "",//封面图
// detailImg: "",//详情图
// //产品分类
// //影像分类
// //文件格式
// //分辨率
// //拍摄地点
// //拍摄时间
// //可否商用
// //是否水印
}),
rules: {
name: [
{ required: true, message: '请输入卫星名称', trigger: 'blur' }
],
resolution: [
{ required: true, message: '请输入分辨率', trigger: 'blur' }
],
rank: [
{ required: true, message: '请设置0-10000，数值越大排序越靠前', trigger: 'blur' }
],
coverImg: [
{ required: true, message: '请输入封面图链接', trigger: 'blur' }
],
iconImg: [
{ required: true, message: '请输入图标链接', trigger: 'blur' }
],
content: [
{ required: true, message: '请输入详细内容', trigger: 'blur' }
]
},
formInfo: {
name: { label: "卫星名称" },
resolution: { label: "分辨率" },
coverImg: { label: "封面图", type: 'file'},
iconImg: { label: "图标", type: 'file'},
rank: { label: "排序" },
content: { label: "详细内容", type: 'kindEditor'},
}
}
// }),
// rules: {
// name: [
// { required: true, message: '请输入卫星名称', trigger: 'blur' }
// ],
// resolution: [
// { required: true, message: '请输入分辨率', trigger: 'blur' }
// ],
// rank: [
// { required: true, message: '请设置0-10000，数值越大排序越靠前', trigger: 'blur' }
// ],
// coverImg: [
// { required: true, message: '请输入封面图链接', trigger: 'blur' }
// ],
// iconImg: [
// { required: true, message: '请输入图标链接', trigger: 'blur' }
// ],
// content: [
// { required: true, message: '请输入详细内容', trigger: 'blur' }
// ]
// },
// formInfo: {
// name: { label: "卫星名称" },
// resolution: { label: "分辨率" },
// coverImg: { label: "封面图", type: 'file'},
// iconImg: { label: "图标", type: 'file'},
// rank: { label: "排序" },
// content: { label: "详细内容", type: 'kindEditor'},
// }
// }
src/views/webSiteManagement/bannerSetting.vue deleted 100644 → 0
View file @ e33c8909
<template>
<div class="container">
<!-- 头部 -->
<div class="head">
<div>banner列表</div>
<el-button type="primary" @click="addItem">添加banner</el-button>
</div>
<!-- 主体 -->
<div class="app-container calendar-list-container">
<!-- 条件搜索 -->
<div class="filter-container">
<el-form :inline="true" :model="listQuery" class="demo-form-inline">
<el-form-item label="所有状态">
<el-select v-model="listQuery.status">
<el-option v-for="(item, index) in bannerStatus" :key="index" :label="item" :value="~~index"></el-option>
</el-select>
</el-form-item>
<el-form-item label="banner标题">
<el-input v-model="listQuery.title" placeholder="请输入banner标题"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" plain @click="search">搜索</el-button>
<el-button type="primary" plain @click="clearFilterData">清除搜索</el-button>
</el-form-item>
</el-form>
</div>
<!-- 数据列表 -->
<el-table :data="list" v-loading.body="listLoading" border fit highlight-current-row style="width: 100%">
<el-table-column align="center" type="index" label="序号" width="65"></el-table-column>
<el-table-column align="center" label="banner标题" prop="title"></el-table-column>
<el-table-column align="center" label="banner图">
<template slot-scope="scope">
<img class="cover" :src="scope.row.cover" />
</template>
</el-table-column>
<el-table-column align="center" label="状态">
<template slot-scope="scope">
<!-- 根据状态获取对应中文 -->
{{ getStatus(scope.row.status) }}
</template>
</el-table-column>
<el-table-column align="center" label="操作" width="250">
<template slot-scope="scope">
<el-button type="primary" size="mini" @click="edit(scope.row)">编辑</el-button>
<el-button :type="scope.row.status === 1 ? 'info': 'warning'" size="mini" @click="changeParams(scope.row, 'status')">{{scope.row.status === 1 ? '下架': '上架'}}</el-button>
<el-button type="danger" size="mini" @click="changeParams(scope.row, 'isDel')">删除</el-button>
</template>
</el-table-column>
</el-table>
<!-- 分页 -->
<div class="page-foot">
<el-pagination
background
layout="prev, pager, next"
:page-size="listQuery.limit"
:total="total" @current-change="currentChange">
</el-pagination>
</div>
<!-- 添加、编辑弹窗 -->
<el-dialog
top="10%"
:close-on-click-modal="false"
:title="dialogTitle"
:visible.sync="dialogVisible">
<custom-form
:formData="formObject"
@submitFunc="updateFunc"
@reset="resetForm"
></custom-form>
</el-dialog>
</div>
</div>
</template>
<script>
import { banner } from "@/utils/formDatas.js"//表单数据
import { page, update } from "@/api/website/banner"//接口
import CustomForm from "@/components/CustomForm"
export default {
name: "bannerSetting",
components: {
CustomForm
},
data() {
return {
data: null,//原数据
list: null,//赋值数据 | 过滤数据
total: null,//总个数
listLoading: true,//请求加载状态
//请求参数。页码页数等
listQuery: {
status: 0,
title: "",
page: 1,
limit: 20
},
//搜索表单
searchForm: {
status: 0,
title: ""
},
formObject: {
formVal: banner.init(),//提交的表单参数
rules: banner.rules,//表单规则
formItem: banner.formInfo,//表单项。
},
//是否启用，1、启用，2、禁用
bannerStatus: {
0: '全部',
1: '启用',
2: '禁用',
},
dialogVisible: false,//弹窗显示控制
dialogTitle: "新增banner"//弹窗标题
}
},
mounted() {
this.getList()//获取数据
},
methods: {
//获取图片链接
getSrc(val) {
this.editForm.cover = val
},
//获取自定义组件值
getCustomInput(val) {
this.editForm.url = val
},
search() {
this.listQuery.page = 1;
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) {
this.listQuery.page = val;
this.getList();
},
//编辑
edit(row) {
this.dialogTitle = "编辑banner";
this.formObject.formVal = this.filterParams(row)
this.dialogVisible = true;
console.log(this.formObject.formVal)
},
//更新方法
updateFunc(params) {
params.rank = ~~params.rank;
update(params).then(res => {
if (res.status == 200) {
this.dialogVisible = false;
this.getList();
} else {
this.$message.error(res.message);
}
})
},
//取消表单
resetForm() {
this.dialogVisible = false;
},
//新增banner
addItem() {
this.dialogTitle = "新增banner";
this.dialogVisible = true;
this.formObject.formVal = banner.init();
},
filterParams(obj) {
let p = {}
let b = ['isDel', 'updTime', 'crtTime']
for (let key in obj) {
if (!b.includes(key)) {
p[key] = obj[key]
}
}
return p;
},
//获取状态
getStatus(val) {
return this.bannerStatus[val]
},
//上下架、删除更新
changeParams(row, key) {
this.$confirm('确定继续执行该操作吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.formObject.formVal = this.filterParams(row)
console.log('过滤参数', this.formObject.formVal)
if (key == 'isDel') {
this.formObject.formVal[key] = row[key] == 0 ? 1 : 0;
} else {
this.formObject.formVal[key] = row[key] == 1 ? 2 : 1;
}
//更新专题
this.updateFunc(this.formObject.formVal);
})
},
//获取banner列表
getList() {
this.listLoading = true;
page(this.listQuery).then(res => {
this.list = res.data.data
this.data = res.data.data
this.total = res.data.totalCount;
this.listLoading = false;
}).catch(err => {
this.listLoading = false;
})
}
}
}
</script>
<style lang="scss" scoped>
.head {
display: flex;
align-items: center;
justify-content: space-between;
padding: 8px 20px;
width: 100%;
border-bottom: 1px solid #e6e6e6;
}
.cover {
max-width: 200px;
height: auto;
}
.page-foot {
display: flex;
justify-content: center;
margin-top: 20px;
}
</style>
src/views/webSiteManagement/bannerSetting/index.vue
View file @ 5109062d
......@@ -65,7 +65,7 @@
top="10%"
:close-on-click-modal="false"
:title="dialogTitle"
:visible.sync="dialogVisible">
:visible.sync="dialogVisible" @closed="closeDialog"> <!-- @open="onOpen" @closed="closeDialog">-->
<custom-form
:formData="formObject"
@submitFunc="updateFunc"
......@@ -82,7 +82,7 @@
import { banner } from "@/utils/formDatas.js"//表单数据
import { page, update } from "@/api/website/banner"//接口
import CustomForm from "@/components/CustomForm"
import CustomForm from "@/components/CustomForm"//自定义表单组件
export default {
name: "bannerSetting",
......@@ -132,6 +132,7 @@ export default {
getCustomInput(val) {
this.editForm.url = val
},
//搜索按钮
search() {
this.listQuery = {
status: this.searchForm.status || null,
......@@ -185,11 +186,18 @@ export default {
//编辑
edit(row) {
this.dialogTitle = "编辑banner";
this.formObject.formVal = this.filterParams(row)
// this.formObject = {
// formVal: this.filterParams(row),
// rules: this.formObject.rules,//表单规则
// formItem: banner.formInfo,//表单项。
// }
this.dialogVisible = true;
console.log(this.formObject.formVal)
// console.log(this.formObject.formVal)
},
closeDialog() {
this.$bus.$emit('upload-clearFiles')
},
//更新方法
updateFunc(params) {
......@@ -212,7 +220,26 @@ export default {
this.dialogTitle = "新增banner";
this.dialogVisible = true;
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) {
let a = {};
for (let i in this.formObject.formVal) {
......
src/views/webSiteManagement/imageLibrary/index.vue
View file @ 5109062d
......@@ -33,7 +33,7 @@ export default {
this.$nextTick(() => {
if (!!val) {
this.$bus.$emit('satelliteIntroduction-edit-renderData', val)
this.$bus.$emit('imageLibrary-edit-renderData', val)
}
})
......
src/views/webSiteManagement/imageLibrary/list.vue
View file @ 5109062d
......@@ -25,8 +25,8 @@
<el-table-column align="center" type="index" label="序号" width="65"></el-table-column>
<el-table-column align="center" label="产品名称" prop="name"></el-table-column>
<el-table-column align="center" label="产品类型" prop="type"></el-table-column>
<el-table-column align="center" label="尺寸" prop="imageInfoRelationList.ileWidth"></el-table-column>
<el-table-column align="center" label="价格" prop="name"></el-table-column>
<el-table-column align="center" label="尺寸" prop="imageInfoRelationList[0].fileWidth"></el-table-column>
<el-table-column align="center" label="价格" prop="imageInfoRelationList[0].price"></el-table-column>
<el-table-column align="center" label="状态">
<template slot-scope="scope">
{{ getStatus(scope.row.status) }}
......
src/views/webSiteManagement/satelliteIntroduction/edit.vue
View file @ 5109062d
......@@ -39,7 +39,7 @@ export default {
methods: {
renderData(val) {
this.formObject.formVal = val
console.log('bus end', this.formObject.formVal)
// console.log('bus end', this.formObject.formVal)
},
goBack() {
this.$emit('change', 'List')
......
src/views/webSiteManagement/satelliteIntroduction/index.vue
View file @ 5109062d
......@@ -28,9 +28,7 @@ export default {
},
methods: {
changePage(name, val) {
this.componentVal = name
this.$nextTick(() => {
if (!!val) {
this.$bus.$emit('satelliteIntroduction-edit-renderData', val)
......
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