Skip to content

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

20201207更新

parent 28728079
Hide whitespace changes
Inline Side-by-side
Showing with 1359 additions and 526 deletions
src/api/website/newsCategory/index.js
View file @ d12fda14
/*
* @Author: Jenkins
* @Date: 2020-12-02 09:18:01
* @LastEditTime: 2020-12-03 11:07:18
* @LastEditTime: 2020-12-07 16:03:52
* @LastEditors: Please set LastEditors
* @Description: 星云动态页请求接口
* @FilePath: \rs-cloud-platform-ui\src\api\wsmanagement\newsCategory\index.js
......@@ -9,12 +9,13 @@
import fetch from 'utils/fetch';
/**
* 获取所有新闻类型
*/
export function getAllnewsType(){
return fetch({
url: '/api/admin/user/front/menu/all',
url: '/api/website/newsType/app/unauth/getAll',
method: 'get'
});
}
......@@ -78,3 +79,4 @@ export function uploadFile(obj){
data: obj
});
}
src/utils/md5.js 0 → 100644
View file @ d12fda14
window.MD5 = function (string) {
function RotateLeft(lValue, iShiftBits) {
return (lValue<<iShiftBits) | (lValue>>>(32-iShiftBits));
}
function AddUnsigned(lX,lY) {
var lX4,lY4,lX8,lY8,lResult;
lX8 = (lX & 0x80000000);
lY8 = (lY & 0x80000000);
lX4 = (lX & 0x40000000);
lY4 = (lY & 0x40000000);
lResult = (lX & 0x3FFFFFFF)+(lY & 0x3FFFFFFF);
if (lX4 & lY4) {
return (lResult ^ 0x80000000 ^ lX8 ^ lY8);
}
if (lX4 | lY4) {
if (lResult & 0x40000000) {
return (lResult ^ 0xC0000000 ^ lX8 ^ lY8);
} else {
return (lResult ^ 0x40000000 ^ lX8 ^ lY8);
}
} else {
return (lResult ^ lX8 ^ lY8);
}
}
function F(x,y,z) { return (x & y) | ((~x) & z); }
function G(x,y,z) { return (x & z) | (y & (~z)); }
function H(x,y,z) { return (x ^ y ^ z); }
function I(x,y,z) { return (y ^ (x | (~z))); }
function FF(a,b,c,d,x,s,ac) {
a = AddUnsigned(a, AddUnsigned(AddUnsigned(F(b, c, d), x), ac));
return AddUnsigned(RotateLeft(a, s), b);
};
function GG(a,b,c,d,x,s,ac) {
a = AddUnsigned(a, AddUnsigned(AddUnsigned(G(b, c, d), x), ac));
return AddUnsigned(RotateLeft(a, s), b);
};
function HH(a,b,c,d,x,s,ac) {
a = AddUnsigned(a, AddUnsigned(AddUnsigned(H(b, c, d), x), ac));
return AddUnsigned(RotateLeft(a, s), b);
};
function II(a,b,c,d,x,s,ac) {
a = AddUnsigned(a, AddUnsigned(AddUnsigned(I(b, c, d), x), ac));
return AddUnsigned(RotateLeft(a, s), b);
};
function ConvertToWordArray(string) {
var lWordCount;
var lMessageLength = string.length;
var lNumberOfWords_temp1=lMessageLength + 8;
var lNumberOfWords_temp2=(lNumberOfWords_temp1-(lNumberOfWords_temp1 % 64))/64;
var lNumberOfWords = (lNumberOfWords_temp2+1)*16;
var lWordArray=Array(lNumberOfWords-1);
var lBytePosition = 0;
var lByteCount = 0;
while ( lByteCount < lMessageLength ) {
lWordCount = (lByteCount-(lByteCount % 4))/4;
lBytePosition = (lByteCount % 4)*8;
lWordArray[lWordCount] = (lWordArray[lWordCount] | (string.charCodeAt(lByteCount)<<lBytePosition));
lByteCount++;
}
lWordCount = (lByteCount-(lByteCount % 4))/4;
lBytePosition = (lByteCount % 4)*8;
lWordArray[lWordCount] = lWordArray[lWordCount] | (0x80<<lBytePosition);
lWordArray[lNumberOfWords-2] = lMessageLength<<3;
lWordArray[lNumberOfWords-1] = lMessageLength>>>29;
return lWordArray;
};
function WordToHex(lValue) {
var WordToHexValue="",WordToHexValue_temp="",lByte,lCount;
for (lCount = 0;lCount<=3;lCount++) {
lByte = (lValue>>>(lCount*8)) & 255;
WordToHexValue_temp = "0" + lByte.toString(16);
WordToHexValue = WordToHexValue + WordToHexValue_temp.substr(WordToHexValue_temp.length-2,2);
}
return WordToHexValue;
};
function Utf8Encode(string) {
string = string.replace(/\r\n/g,"\n");
var utftext = "";
for (var n = 0; n < string.length; n++) {
var c = string.charCodeAt(n);
if (c < 128) {
utftext += String.fromCharCode(c);
}
else if((c > 127) && (c < 2048)) {
utftext += String.fromCharCode((c >> 6) | 192);
utftext += String.fromCharCode((c & 63) | 128);
}
else {
utftext += String.fromCharCode((c >> 12) | 224);
utftext += String.fromCharCode(((c >> 6) & 63) | 128);
utftext += String.fromCharCode((c & 63) | 128);
}
}
return utftext;
};
var x=Array();
var k,AA,BB,CC,DD,a,b,c,d;
var S11=7, S12=12, S13=17, S14=22;
var S21=5, S22=9 , S23=14, S24=20;
var S31=4, S32=11, S33=16, S34=23;
var S41=6, S42=10, S43=15, S44=21;
string = Utf8Encode(string);
x = ConvertToWordArray(string);
a = 0x67452301; b = 0xEFCDAB89; c = 0x98BADCFE; d = 0x10325476;
for (k=0;k<x.length;k+=16) {
AA=a; BB=b; CC=c; DD=d;
a=FF(a,b,c,d,x[k+0], S11,0xD76AA478);
d=FF(d,a,b,c,x[k+1], S12,0xE8C7B756);
c=FF(c,d,a,b,x[k+2], S13,0x242070DB);
b=FF(b,c,d,a,x[k+3], S14,0xC1BDCEEE);
a=FF(a,b,c,d,x[k+4], S11,0xF57C0FAF);
d=FF(d,a,b,c,x[k+5], S12,0x4787C62A);
c=FF(c,d,a,b,x[k+6], S13,0xA8304613);
b=FF(b,c,d,a,x[k+7], S14,0xFD469501);
a=FF(a,b,c,d,x[k+8], S11,0x698098D8);
d=FF(d,a,b,c,x[k+9], S12,0x8B44F7AF);
c=FF(c,d,a,b,x[k+10],S13,0xFFFF5BB1);
b=FF(b,c,d,a,x[k+11],S14,0x895CD7BE);
a=FF(a,b,c,d,x[k+12],S11,0x6B901122);
d=FF(d,a,b,c,x[k+13],S12,0xFD987193);
c=FF(c,d,a,b,x[k+14],S13,0xA679438E);
b=FF(b,c,d,a,x[k+15],S14,0x49B40821);
a=GG(a,b,c,d,x[k+1], S21,0xF61E2562);
d=GG(d,a,b,c,x[k+6], S22,0xC040B340);
c=GG(c,d,a,b,x[k+11],S23,0x265E5A51);
b=GG(b,c,d,a,x[k+0], S24,0xE9B6C7AA);
a=GG(a,b,c,d,x[k+5], S21,0xD62F105D);
d=GG(d,a,b,c,x[k+10],S22,0x2441453);
c=GG(c,d,a,b,x[k+15],S23,0xD8A1E681);
b=GG(b,c,d,a,x[k+4], S24,0xE7D3FBC8);
a=GG(a,b,c,d,x[k+9], S21,0x21E1CDE6);
d=GG(d,a,b,c,x[k+14],S22,0xC33707D6);
c=GG(c,d,a,b,x[k+3], S23,0xF4D50D87);
b=GG(b,c,d,a,x[k+8], S24,0x455A14ED);
a=GG(a,b,c,d,x[k+13],S21,0xA9E3E905);
d=GG(d,a,b,c,x[k+2], S22,0xFCEFA3F8);
c=GG(c,d,a,b,x[k+7], S23,0x676F02D9);
b=GG(b,c,d,a,x[k+12],S24,0x8D2A4C8A);
a=HH(a,b,c,d,x[k+5], S31,0xFFFA3942);
d=HH(d,a,b,c,x[k+8], S32,0x8771F681);
c=HH(c,d,a,b,x[k+11],S33,0x6D9D6122);
b=HH(b,c,d,a,x[k+14],S34,0xFDE5380C);
a=HH(a,b,c,d,x[k+1], S31,0xA4BEEA44);
d=HH(d,a,b,c,x[k+4], S32,0x4BDECFA9);
c=HH(c,d,a,b,x[k+7], S33,0xF6BB4B60);
b=HH(b,c,d,a,x[k+10],S34,0xBEBFBC70);
a=HH(a,b,c,d,x[k+13],S31,0x289B7EC6);
d=HH(d,a,b,c,x[k+0], S32,0xEAA127FA);
c=HH(c,d,a,b,x[k+3], S33,0xD4EF3085);
b=HH(b,c,d,a,x[k+6], S34,0x4881D05);
a=HH(a,b,c,d,x[k+9], S31,0xD9D4D039);
d=HH(d,a,b,c,x[k+12],S32,0xE6DB99E5);
c=HH(c,d,a,b,x[k+15],S33,0x1FA27CF8);
b=HH(b,c,d,a,x[k+2], S34,0xC4AC5665);
a=II(a,b,c,d,x[k+0], S41,0xF4292244);
d=II(d,a,b,c,x[k+7], S42,0x432AFF97);
c=II(c,d,a,b,x[k+14],S43,0xAB9423A7);
b=II(b,c,d,a,x[k+5], S44,0xFC93A039);
a=II(a,b,c,d,x[k+12],S41,0x655B59C3);
d=II(d,a,b,c,x[k+3], S42,0x8F0CCC92);
c=II(c,d,a,b,x[k+10],S43,0xFFEFF47D);
b=II(b,c,d,a,x[k+1], S44,0x85845DD1);
a=II(a,b,c,d,x[k+8], S41,0x6FA87E4F);
d=II(d,a,b,c,x[k+15],S42,0xFE2CE6E0);
c=II(c,d,a,b,x[k+6], S43,0xA3014314);
b=II(b,c,d,a,x[k+13],S44,0x4E0811A1);
a=II(a,b,c,d,x[k+4], S41,0xF7537E82);
d=II(d,a,b,c,x[k+11],S42,0xBD3AF235);
c=II(c,d,a,b,x[k+2], S43,0x2AD7D2BB);
b=II(b,c,d,a,x[k+9], S44,0xEB86D391);
a=AddUnsigned(a,AA);
b=AddUnsigned(b,BB);
c=AddUnsigned(c,CC);
d=AddUnsigned(d,DD);
}
var temp = WordToHex(a)+WordToHex(b)+WordToHex(c)+WordToHex(d);
return temp.toLowerCase();
}
src/utils/translate.js 0 → 100644
View file @ d12fda14
/*
* @Author: your name
* @Date: 2020-12-07 15:45:49
* @LastEditTime: 2020-12-07 16:24:54
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: \rs-cloud-platform-ui\src\utils\translate.js
*/
import "utils/md5";
window.transResult = ""
// 初始化翻译
window.toTranslate = function(words,toLanguage) {
if (words == "") {
return;
}
//获取创建的script标签
var s = document.getElementById('urlData');
//如果script标签已经存在删除了重新创建
if (s) {
s.parentNode.removeChild(s);
translate(words,toLanguage);
} else {
translate(words,toLanguage);
}
}
// 初始翻译标签
window.translate = function(words,lang = "en") {
// appId和appSecret需要更改
let appId = "2015063000000001"
let appSecret = "12345678"
//获取接口
let url = 'http://api.fanyi.baidu.com/api/trans/vip/translate?';
// 当前时间戳
let salt = (new Date).getTime()
// 组合字段
let str = appId + words + salt + appSecret; //秘钥
//此处拼接接口数据,好转换成jsonp数据格式,实现跨域访问
// var str = '20170605000052254' + words + salt + '63r1c42X7_buc4OrXm1g';
//使用加密算法计算数据
let md5 = window.MD5(str);
//然后得到的数据
let data = 'q=' + words + '&from=auto&to=' + lang + '&appid=' + appId + '&salt=' + salt + '&sign=' + md5 + "&callback=callbackName";
//引入src路径
let src = url + data;
//调用创建script标签函数
createScript(src);
}
// 创建翻译脚本
window.createScript = function(src) {
//创建一个script标签
var script = document.createElement('script');
//添加src和id属性
script.id = 'urlData';
script.src = src;
//将script标签添加到body页面中
document.body.appendChild(script);
}
//回调函数定义
window.callbackName = function(str){
window.transResult = str
console.log("翻译结果=>",window.transResult)
}
\ No newline at end of file
src/utils/uuid.js 0 → 100644
View file @ d12fda14
/*
* @Author: your name
* @Date: 2020-12-07 18:47:48
* @LastEditTime: 2020-12-07 18:48:54
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: \rs-cloud-platform-ui\src\utils\uuid.js
*/
export function uuid() {
var s = [];
var hexDigits = "0123456789abcdef";
for (var i = 0; i < 36; i++) {
s[i] = hexDigits.substr(Math.floor(Math.random() * 0x10), 1);
}
s[14] = "4"; // bits 12-15 of the time_hi_and_version field to 0010
s[19] = hexDigits.substr((s[19] & 0x3) | 0x8, 1); // bits 6-7 of the clock_seq_hi_and_reserved to 01
s[8] = s[13] = s[18] = s[23] = "-";
var uuid = s.join("");
return uuid;
}
export function guid() {
return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
var r = Math.random() * 16 | 0,
v = c == 'x' ? r : (r & 0x3 | 0x8);
return v.toString(16);
});
}
export function guid2() {
function S4() {
return (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1);
}
return (S4() + S4() + "-" + S4() + "-" + S4() + "-" + S4() + "-" + S4() + S4() + S4());
}
export /*
指定长度和基数
*/
function uuid2(len, radix) {
var chars = '0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz'.split('');
var uuid = [],
i;
radix = radix || chars.length;
if (len) {
// Compact form
for (i = 0; i < len; i++) uuid[i] = chars[0 | Math.random() * radix];
} else {
// rfc4122, version 4 form
var r;
// rfc4122 requires these characters
uuid[8] = uuid[13] = uuid[18] = uuid[23] = '-';
uuid[14] = '4';
// Fill in random data. At i==19 set the high bits of clock sequence as
// per rfc4122, sec. 4.1.5
for (i = 0; i < 36; i++) {
if (!uuid[i]) {
r = 0 | Math.random() * 16;
uuid[i] = chars[(i == 19) ? (r & 0x3) | 0x8 : r];
}
}
}
return uuid.join('');
}
src/views/webSiteManagement/newsCategory/index.vue
View file @ d12fda14
<!--
* @Author: your name
* @Date: 2020-12-01 09:54:12
* @LastEditTime: 2020-12-02 16:35:10
* @LastEditTime: 2020-12-07 18:31:07
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: \rs-cloud-platform-ui\src\views\webSiteManagement\newsCategory\index.vue
......@@ -26,6 +26,7 @@ export default {
data(){
return {
componentName: 'nebulaDynamics',
regions:[]
}
},
mounted() {
......
src/views/webSiteManagement/newsCategory/nebulaDynamics/index.vue
View file @ d12fda14
<!--
* @Author: Jenkins
* @Date: 2020-12-01 09:54:12
* @LastEditTime: 2020-12-03 17:39:59
* @LastEditTime: 2020-12-07 18:53:34
* @LastEditors: Please set LastEditors
* @Description: 星云动态
* @FilePath: \rs-cloud-platform-ui\src\views\webSiteManagement\newsCategory\index.vue
-->
<template>
<div id='nebulaDynamics'>
<!-- 顶部功能栏 -->
<div class="top">
<div class="title">星云动态</div>
<div class="controls">
<div class="item" v-for="(val,index) in topControls" :key="index" @click="topControlActive(val.key)">
{{val.name}}
</div>
</div>
<div id="nebulaDynamics">
<!-- 顶部功能栏 -->
<div class="top">
<div class="title">星云动态</div>
<div class="controls">
<div
class="item"
v-for="(val, index) in topControls"
:key="index"
@click="topControlActive(val.key)"
>
{{ val.name }}
</div>
</div>
<!-- 类型管理弹框 -->
<el-dialog title="类型管理" :visible.sync="typeManagerVisible" append-to-body>
<div id="typeManager">
<div class="controls">
<div class="addUpdate" @click="typeCreatorVisible = true">
添加类型
</div>
</div>
<div class="content">
<el-table :data="tableType" border fit highlight-current-row style="width: 100%" max-height="400">
<el-table-column label="序号" align="center">
<template slot-scope="scope">
<span>{{scope.row.id}}</span>
</template>
</el-table-column>
<el-table-column label="类型名称" align="center">
<template slot-scope="scope">
<span>{{scope.row.name}}</span>
</template>
</el-table-column>
<el-table-column label="排序" align="center">
<template slot-scope="scope">
<span>{{scope.row.sort}}</span>
</template>
</el-table-column>
<el-table-column label="操作" align="center">
<template slot-scope="scope">
<span>
<div class="operators">
<div class="edit">编辑</div>
<div class="offshelf">下架</div>
<div class="delete">删除</div>
</div>
</span>
</template>
</el-table-column>
</el-table>
</div>
</div>
<!-- 类型管理弹框 -->
<el-dialog title="类型管理" :visible.sync="typeManagerVisible" append-to-body>
<div id="typeManager">
<div class="controls">
<div class="addUpdate" @click="typeCreatorVisible = true">
添加类型
</div>
</div>
<!-- 添加类型弹框 -->
<el-dialog width="40%" title="添加类型" :visible.sync="typeCreatorVisible" append-to-body>
<div id="typeCreator">
<div class="content">
<span>*类型名称</span>
<el-col :span="14">
<el-input v-model="newType" placeholder="请输入类型名称" size="100px"></el-input>
</el-col>
</div>
<div class="content">
<span>*类型排序</span>
<el-col :span="14">
<el-input v-model="newSort" placeholder="请设置排序0-10000,数值越大排序越靠前"></el-input>
</el-col>
</div>
<div class="operators">
<div class="cancel">取消</div>
<div class="confirm">确定</div>
</div>
</div>
</el-dialog>
</el-dialog>
<!-- 操作表格栏 -->
<div class="operators">
<div class="status">
<span>所有状态</span>
<el-select v-model="currentStatus" placeholder="全部">
<el-option v-for="item in status" :key="item.value" :label="item.label" :value="item.value">
</el-option>
</el-select>
<div class="content">
<el-table
:data="tableType"
border
fit
highlight-current-row
style="width: 100%"
max-height="400"
>
<el-table-column label="序号" align="center">
<template slot-scope="scope">
<span>{{ scope.row.id }}</span>
</template>
</el-table-column>
<el-table-column label="类型名称(中文)" align="center">
<template slot-scope="scope">
<span>{{ scope.row.name }}</span>
</template>
</el-table-column>
<el-table-column label="排序" align="center">
<template slot-scope="scope">
<span>{{ scope.row.sort }}</span>
</template>
</el-table-column>
<el-table-column label="操作" align="center">
<template slot-scope="scope">
<span>
<div class="operators">
<div class="edit" @click.stop="clickTypeEditor(scope.row)">编辑</div>
<div class="offshelf" v-if="scope.row.status==1">下架</div>
<div class="upshelf" v-else>上架</div>
<div class="delete">删除</div>
</div>
</span>
</template>
</el-table-column>
</el-table>
</div>
<div class="typePagination">
<el-pagination
@size-change="changeHandleSize"
@current-change="changeHandleCurrent"
:current-page.sync="typePagination.currentPage"
:page-sizes="[2,4,6]"
:page-size="typePagination.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="typePagination.total">
</el-pagination>
</div>
</div>
<!-- 编辑类型弹框 -->
<el-dialog
width="40%"
title="添加类型"
:visible.sync="typeEditorVisible"
append-to-body
>
<div id="typeCreator">
<div class="content">
<span>*中文名称</span>
<el-col :span="14">
<el-input
v-model="editorType.name"
placeholder="请输入类型名称(中文)"
size="100px"
></el-input>
</el-col>
</div>
<div class="types">
<span>资讯类型</span>
<el-select v-model="currentTypes" placeholder="全部">
<el-option v-for="item in types" :key="item.value" :label="item.label" :value="item.value">
</el-option>
</el-select>
<div class="content">
<span>*英文名称</span>
<el-col :span="14">
<el-input
v-model="editorType.nameEn"
placeholder="请输入类型名称(英文)"
></el-input>
</el-col>
</div>
<div class="sorts">
<span>排序</span>
<el-select v-model="currentSorts" placeholder="全部">
<el-option v-for="item in sorts" :key="item.value" :label="item.label" :value="item.value">
</el-option>
</el-select>
<div class="content">
<span>*类型排序</span>
<el-col :span="14">
<el-input
v-model="editorType.sort"
placeholder="请设置排序0-10000,数值越大排序越靠前"
></el-input>
</el-col>
</div>
<div class="controls">
<div class="item" v-for="(item,index) in operatorControls" :key="index">
{{item.name}}
</div>
<div class="operators">
<div class="cancel" @click.stop="typeEditorVisible = false">取消</div>
<div class="confirm" @click.stop="confirmEditor">确定</div>
</div>
</div>
</el-dialog>
<!-- 添加类型弹框 -->
<el-dialog
width="40%"
title="编辑类型"
:visible.sync="typeCreatorVisible"
append-to-body
>
<div id="typeEditor">
<div class="content">
<span>*类型名称</span>
<el-col :span="14">
<el-input
v-model="newType"
placeholder="请输入类型名称(中文)"
size="100px"
></el-input>
</el-col>
</div>
<div class="content">
<span>*类型排序</span>
<el-col :span="14">
<el-input
v-model="newSort"
placeholder="请设置排序0-10000,数值越大排序越靠前"
></el-input>
</el-col>
</div>
<div class="operators">
<div class="cancel" @click.stop="typeCreatorVisible = false">取消</div>
<div class="confirm" @click.stop="createType">确定</div>
</div>
</div>
</el-dialog>
</el-dialog>
<!-- 操作表格栏 -->
<div class="operators">
<div class="status">
<span>所有状态</span>
<el-select v-model="currentStatus" placeholder="全部">
<el-option
v-for="item in status"
:key="item.value"
:label="item.label"
:value="item.value"
>
</el-option>
</el-select>
</div>
<!-- 表格 -->
<div class="table">
<el-table :data="tableData" border fit highlight-current-row style="width: 100%">
<el-table-column label="序号" width="100" align="center">
<template slot-scope="scope">
<span>{{scope.row.id}}</span>
</template>
</el-table-column>
<el-table-column label="资讯标题" width="200" align="center">
<template slot-scope="scope">
<span>{{scope.row.title}}</span>
</template>
</el-table-column>
<el-table-column label="缩略图" width="150" align="center">
<template slot-scope="scope">
<span>
<img class="icon" :src="scope.row.icon.url" @click="showPreview(scope.row.icon)"/>
</span>
</template>
</el-table-column>
<el-table-column label="简介" align="center">
<template slot-scope="scope">
<span class="introduce">{{scope.row.introduce}}</span>
</template>
</el-table-column>
<el-table-column label="类型" width="150" align="center">
<template slot-scope="scope">
<span>{{scope.row.type}}</span>
</template>
</el-table-column>
<el-table-column label="排序" width="150" align="center">
<template slot-scope="scope">
<span>{{scope.row.sort}}</span>
</template>
</el-table-column>
<el-table-column label="状态" width="150" align="center">
<template slot-scope="scope">
<span>{{scope.row.status}}</span>
</template>
</el-table-column>
<el-table-column label="操作" width="150" align="center">
<template slot-scope="scope">
<!-- <span>{{scope.row.operator}}</span> -->
<span>
<div class="operators">
<div class="edit">编辑</div>
<div class="offshelf">下架</div>
<div class="delete">删除</div>
</div>
</span>
</template>
</el-table-column>
</el-table>
<div class="types">
<span>资讯类型</span>
<el-select v-model="currentType" placeholder="全部">
<el-option
v-for="item in types"
:key="item.value"
:label="item.label"
:value="item.value"
>
</el-option>
</el-select>
</div>
<div class="sorts">
<span>排序</span>
<el-select v-model="currentSort" placeholder="全部">
<el-option
v-for="item in sorts"
:key="item.value"
:label="item.label"
:value="item.value"
>
</el-option>
</el-select>
</div>
<!-- 使用图片查看器预览当前缩略图 -->
<el-image-viewer v-if="currentIcon.showPreview" :on-close="closePreview" :url-list="[currentIcon.url]" />
<div class="controls">
<div
class="item"
v-for="(item, index) in operatorControls"
:key="index"
@click.stop="clickOperator(item.type)"
>
{{ item.name }}
</div>
</div>
</div>
<!-- 表格 -->
<div class="table">
<el-table
:data="tableData"
border
fit
highlight-current-row
style="width: 100%"
>
<el-table-column label="序号" width="100" align="center">
<template slot-scope="scope">
<span>{{ scope.row.id }}</span>
</template>
</el-table-column>
<el-table-column label="资讯标题" align="center">
<template slot-scope="scope">
<span>{{ scope.row.title }}</span>
</template>
</el-table-column>
<el-table-column label="缩略图" align="center">
<template slot-scope="scope">
<span>
<img class="icon" :src="scope.row.icon.url" @click="showPreview(scope.row.icon)"/>
</span>
</template>
</el-table-column>
<el-table-column label="简介" align="center">
<template slot-scope="scope">
<span class="introduce">{{ scope.row.introduce }}</span>
</template>
</el-table-column>
<el-table-column label="类型" align="center">
<template slot-scope="scope">
<span>{{ scope.row.type }}</span>
</template>
</el-table-column>
<el-table-column label="排序" width="150" align="center">
<template slot-scope="scope">
<span>{{ scope.row.sort }}</span>
</template>
</el-table-column>
<el-table-column label="状态" width="150" 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>{{scope.row.operator}}</span> -->
<span>
<div class="operators">
<div class="edit">编辑</div>
<div class="offshelf" v-if="scope.row.status == 1">下架</div>
<div class="upshelf" v-else>上架</div>
<div class="delete">删除</div>
</div>
</span>
</template>
</el-table-column>
</el-table>
</div>
<div class="infoPagination" v-show="infoPagination">
<el-pagination
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page.sync="infoPagination.currentPage"
:page-sizes="[10, 20, 30, 40]"
:page-size="infoPagination.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="infoPagination.total">
</el-pagination>
</div>
<!-- 使用图片查看器预览当前缩略图 -->
<el-image-viewer v-if="currentIcon.showPreview" :on-close="closePreview" :url-list="[currentIcon.url]"/>
</div>
</template>
<script>
// 导入组件
import ElImageViewer from 'element-ui/packages/image/src/image-viewer';
import ElImageViewer from "element-ui/packages/image/src/image-viewer";
// 导入请求
import { getAllnewsType,getListnewsType,addUpdateNewsType,getListNewsInfo,addUpdateNewsInfo } from '@/api/website/newsCategory/index';
import {
getAllnewsType,
getListnewsType,
addUpdateNewsType,
getListNewsInfo,
} from "@/api/website/newsCategory/index";
export default {
name: 'nebulaDynamics',
name: "nebulaDynamics",
components: {
ElImageViewer
ElImageViewer,
},
data(){
data() {
return {
// 功能按钮
topControls: [{
key: 'manager',
name: '类型管理',
},{
key: 'creator',
name: '创建资讯文章',
}],
typeManagerVisible: false,
typeCreatorVisible: false,
newType: "",
newSort: "",
// 状态下拉
status: [{
value: '1',
label: '全部'
}, {
value: '2',
label: '上架'
}, {
value: '3',
label: '下架'
}],
currentStatus: '全部',
// 类型下拉
types: [{
value: '1',
label: '全部'
}, {
value: '2',
label: '新闻动态'
}, {
value: '3',
label: '行业新闻'
}, {
value: '4',
label: '新闻发布'
}],
currentTypes: '全部',
// 排序下拉
sorts: [{
value: '1',
label: '全部'
}, {
value: '2',
label: '降序'
}, {
value: '3',
label: '升序'
}],
currentSorts: '全部',
// 功能按钮
operatorControls: [{
name: '搜索',
},{
name: '清空搜索',
}],
// 表格数据
tableData: [{
id: '1',
title: '王小虎',
icon: {
url: 'https://onemap.obtdata.com/wx/download/world.png',
showPreview: false
},
introduce: '介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍',
type: '类型',
sort: '排序',
status: '状态',
operator: '操作',
}],
currentIcon: '',
// 类型表格数据
tableType: [{
id: '1',
name: '类型名称',
sort: '排序',
operator: '操作'
}],
}
},
mounted() {
/**
// 获取所有新闻类型
getAllnewsType().then(res => {
console.log("获取所有新闻类型=>",res)
});
// 获取分页新闻类型
getListnewsType({
page: "0",
limit: "10",
name: ""
}).then(res => {
console.log("获取分页新闻类型=>",res)
});
// 新增或更新新闻类型
addUpdateNewsType({
nameCn: "行业创新",
nameEn: "News creation",
rank: 0,
status: 1,
id: "11"
}).then(res => {
console.log("新增或更新新闻类型=>",res)
});
// 获取分页新闻资讯
getListNewsInfo({
page: "0",
limit: "10",
typeId: "1"
}).then(res => {
console.log("获取分页新闻资讯=>",res)
});
// 新增或更新新闻资讯
addUpdateNewsInfo({
id: 1001,
title: "",
detail: "",
coverImg: "",
content: "",
newsDate: "2020-12-25 17:29:34",
typeId: 1,
status: 1,
indexShow: 1,
typeName: ""
}).then(res => {
console.log("新增或更新新闻资讯",res)
});
*/
// 功能按钮
topControls: [
{
key: "manager",
name: "类型管理",
},
{
key: "creator",
name: "创建资讯文章",
},
],
typeManagerVisible: false,
typeCreatorVisible: false,
newType: "",
newSort: "",
// 状态框
status: [
{
value: "",
label: "全部",
},
{
value: "1",
label: "上架",
},
{
value: "2",
label: "下架",
},
],
currentStatus: "",
// 类型框
typesState: [],
types: [
{
value: "",
label: "全部",
},
],
currentType: "",
// 排序框
sorts: [
{
value: "",
label: "全部",
},
{
value: "1",
label: "降序",
},
{
value: "2",
label: "升序",
},
],
currentSort: "",
// 功能按钮
operatorControls: [
{
type: "search",
name: "搜索",
},
{
type: "clearSearch",
name: "清空搜索",
},
],
canPull: false,
// 表格数据
tableData: [
// {
// id: "1",
// title: "王小虎",
// icon: {
// url: "https://onemap.obtdata.com/wx/download/world.png",
// showPreview: false,
// },
// introduce: "介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍",
// type: "类型",
// sort: "排序",
// status: "状态",
// operator: "操作",
// },
],
tableDataState: [],// 缓存当前的表格数据
infoPagination: {
currentPage: 1,// 当前页码
pageSize: 10,// 每页查询数量
total: 0,// 总记录数量
},
// 当前查看器显示的图片
currentIcon: "",
// 类型表格数据
tableType: [
// {
// id: "1",
// name: "类型名称",
// sort: "排序",
// },
],
typePagination: {
currentPage: 1,// 当前页码
pageSize: 2,// 每页查询数量
total: 0,// 总记录数量
},
typeEditorVisible: false,
editorType: {},// 编辑中的类型
};
},
methods: {
topControlActive(key){
if(key=='manager'){
this.typeManagerVisible = true
}else{
this.$parent.componentName = "newsCreator"
watch:{
// // 筛选状态发生改变
// currentStatus(newVal) {
// console.log("状态=>",newVal)
// this.screenTableData()
// },
// // 筛选类型发生改变
// currentType(newVal) {
// console.log("类型=>",newVal)
// this.screenTableData()
// },
// // 筛选排序发生改变
// currentSort(newVal) {
// console.log("排序=>",newVal)
// this.screenTableData()
// },
canPull(newVal){
// 分页获取新闻信息
newVal&&(this.pullListNewsInfo())
},
// 当前页码有改变时重新拉取分页数据
"infoPagination.currentPage": {
deep: true,
handler: function(){
this.pullListNewsInfo()
}
},
showPreview(icon){
this.currentIcon=icon
this.currentIcon.showPreview=true
// 当查询数量有改变时重新拉取分页数据
"infoPagination.pageSize": {
deep: true,
handler: function(newVal){
this.pullListNewsInfo()
}
},
// 类型表格筛选页码改变
"typePagination.currentPage": {
deep: true,
handler(){
this.changeTableType()
}
},
closePreview(){
this.currentIcon.showPreview=false
// 类型表格筛选数量改变
"typePagination.pageSize": {
deep: true,
handler(){
this.changeTableType()
}
}
},
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
#nebulaDynamics{
margin: 0 1% 0 1%;
width: 98%;
height: auto;
.top{
width: 100%;
height: 68px;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
overflow: hidden;
border-bottom: 1px solid #EEEEEE;
.title{
width: 114px;
height: 46px;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
color: #000000;
overflow: hidden;
mounted() {
// 获取所有新闻类型
this.pullAllNewsType()
// // 获取分页新闻类型
// getListnewsType({
// page: "0",
// limit: "10",
// name: "",
// }).then((res) => {
// console.log("获取分页新闻类型=>", res);
// });
// // 新增或更新新闻类型
// addUpdateNewsType({
// nameCn: "行业创新",
// nameEn: "News creation",
// rank: 0,
// status: 1,
// id: "11",
// }).then((res) => {
// console.log("新增或更新新闻类型=>", res);
// });
},
methods: {
handleSizeChange(val) {
// console.log(`每页 ${val} 条`);
this.infoPagination.pageSize = val
},
handleCurrentChange(val) {
// console.log(`当前页: ${val}`);
this.infoPagination.currentPage = val
},
// 获取所有的新闻类型
pullAllNewsType(isInit = true){
this.typesState = []
this.types = []
// 获取所有新闻类型
getAllnewsType().then((res) => {
// console.log("所有的新闻类型=>",res)
if(res.status == 200){
res.data.forEach(element => {
// 未被删除的类型且已启用
if(element.isDel==0&&element.status==1){
this.types.push({
value: element.id,
label: element.nameCn
});
}
// 缓存所有类型
this.typesState.push(element);
});
// 升序排序
this.types.sort((obj1,obj2)=>{
let val1 = parseInt((obj1.value+""))
let val2 = parseInt((obj2.value+""))
if(val1<val2){
return -1
}else if(val1>val2){
return 1
}else{
return 0
}
});
console.log("获取到的所有类型=>",this.typesState)
this.canPull = isInit
}
.controls{
width: 296px;
height: 46px;
display: flex;
flex-direction: row;
justify-content: space-around;
align-items: center;
overflow: hidden;
.item{
width: 138px;
height: 46px;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
background-color: #5178F2;
border: 1px solid #5178F2;
border-radius: 5px;
color: #FFFFFF;
font-weight: 400;
cursor: pointer;
overflow: hidden;
}
});
},
// 分页获取新闻资讯
pullListNewsInfo(){
getListNewsInfo({
page: this.infoPagination.currentPage,
limit: this.infoPagination.pageSize,
typeId: this.currentType,
}).then((res) => {
if(res.status == 200){
// console.log("res=>",res)
this.tableDataState = [] // 先清空当前缓存
this.infoPagination.total = res.data.totalCount // 更改总记录数
res.data.data.forEach(element => {
// 缓存当前的表格数据
this.tableDataState.push(element)
// 将缓存的数据作进一步的筛选
this.screenTableData()
})
}
}
.operators{
// margin: 0 1% 0 1%;
width: 100%;
height: 68px;
display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: center;
.status,.types,.sorts{
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;
}
console.log("获取分页新闻资讯=>", res);
});
},
// 筛选表格数据
screenTableData(){
// 先清空当前表格数据
this.tableData = []
// 先把未被删除的数据放入到表格
this.tableDataState.forEach((element,index) => {
// 未被删除则显示
if(element.isDel == 0){
this.tableData.push({
id: element.id,
title: element.title,
icon: {
url: element.coverImg,
showPreview: false,
},
introduce: element.detail,
type: (this.typesState.find(ele => ele.id == element.typeId)).nameCn,
typeId: element.typeId,
sort: index+1,
status: element.status,
});
}
})
// 状态码不为空字符串(全部,上架1,下架2)
if(this.currentStatus!=""){
this.tableData = this.tableData.filter(element => element.status == this.currentStatus)
}
.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;
}
.operators{
width: 300px;
height: 46px;
display: flex;
flex-direction: row;
justify-content: space-around;
align-items: center;
.edit,.offshelf,.delete{
width: auto;
height: 36px;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
cursor: pointer;
}
.edit,.offshelf{
color: #1890FF;
// 类型id不为空字符串(类型的id,若为空则筛选全部)
if(this.currentType!=""){
this.tableData = this.tableData.filter(element => element.typeId == this.currentType)
}
// 排序码不为空字符串(全部,升序1,降序2s)
if(this.currentSort!=""){
// 按升序
if(this.currentSort==1){
this.tableData.sort((obj1,obj2)=>{
let val1 = parseInt((obj1.id+""))
let val2 = parseInt((obj2.id+""))
if(val1<val2){
return -1
}else if(val1>val2){
return 1
}else{
return 0
}
.delete{
color: #FE4066;
})
}else{
// 按降序
this.tableData.sort((obj1,obj2)=>{
let val1 = parseInt((obj1.id+""))
let val2 = parseInt((obj2.id+""))
if(val1<val2){
return 1
}else if(val1>val2){
return -1
}else{
return 0
}
}
})
}
}
}
#typeManager{
width: 100%;
height: auto;
.controls{
margin: 0 0 30px 0;
width: 100%;
height: 46px;
display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: center;
.addUpdate{
width: 120px;
height: 100%;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
color: #5178F2;
border: 1px solid #5178F2;
border-radius: 5px;
cursor: pointer;
},
// 顶部栏功能按钮
topControlActive(key) {
if (key == "manager") {
this.typeManagerVisible = true;
// 将获取到的所有新闻类型按字段放入到弹框表格中
// console.log("所有新闻类型缓存数据=>",this.typesState)
this.changeTableType()
} else {
this.$parent.componentName = "newsCreator";
this.$parent.regions = this.typesState
}
},
// 更改类型表格
changeTableType(){
this.tableType = []
let startIndex = (this.typePagination.currentPage * this.typePagination.pageSize) - this.typePagination.pageSize; // 开始截取的索引位置
let endIndex = startIndex + this.typePagination.pageSize // 结束截取的索引位置
this.typePagination.total = this.typesState.length
this.typesState.slice(startIndex,endIndex).forEach((element,index) => {
// 未被删除的类型
if(element.isDel==0){
this.tableType.push({
id: element.id,
name: element.nameCn,
nameEn: element.nameEn,
sort: element.rank,
status: element.status
})
}
}
.content{
width: 100%;
height: auto;
display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: center;
.operators{
width: auto;
height: 16px;
display: flex;
flex-direction: row;
justify-content: space-around;
align-items: center;
.edit,.offshelf,.delete{
width: auto;
height: 16px;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
cursor: pointer;
}
.edit,.offshelf{
color: #1890FF;
});
this.typesState.sort((obj1,obj2)=>{
let val1 = parseInt((obj1.id+""))
let val2 = parseInt((obj2.id+""))
if(val1<val2){
return -1
}else if(val1>val2){
return 1
}else{
return 0
}
});
console.log("类型表格数据改变=>",this.tableType)
},
createType(){
if(this.newType&&this.newSort){
// 必须是中文名称
if(/^(?:[\u3400-\u4DB5\u4E00-\u9FEA\uFA0E\uFA0F\uFA11\uFA13\uFA14\uFA1F\uFA21\uFA23\uFA24\uFA27-\uFA29]|[\uD840-\uD868\uD86A-\uD86C\uD86F-\uD872\uD874-\uD879][\uDC00-\uDFFF]|\uD869[\uDC00-\uDED6\uDF00-\uDFFF]|\uD86D[\uDC00-\uDF34\uDF40-\uDFFF]|\uD86E[\uDC00-\uDC1D\uDC20-\uDFFF]|\uD873[\uDC00-\uDEA1\uDEB0-\uDFFF]|\uD87A[\uDC00-\uDFE0])+$/.test(this.newType)){
if(this.newSort>=0&&this.newSort<10000){
addUpdateNewsType({
nameCn: this.newType,
nameEn: "",
rank: this.newSort,
status: 1 // 创建即启用
}).then(res => {
if(res.status == 200){
this.$message({
message: '创建成功!!!',
type: 'success'
})
this.typeCreatorVisible = false
this.pullAllNewsType(false)
}
})
}else{
this.$message.error('排序值不在指定范围,请输入正确的排序值!!!');
}
.delete{
color: #FE4066;
}else{
this.$message.error('请输入中文名称!!!');
}
}else{
this.$message.error('必填框有缺乏值,请完善输入!!!');
}
},
clickTypeEditor(type){
this.typeEditorVisible = true
this.editorType = type
},
confirmEditor(){
// 中文对应
if(/^(?:[\u3400-\u4DB5\u4E00-\u9FEA\uFA0E\uFA0F\uFA11\uFA13\uFA14\uFA1F\uFA21\uFA23\uFA24\uFA27-\uFA29]|[\uD840-\uD868\uD86A-\uD86C\uD86F-\uD872\uD874-\uD879][\uDC00-\uDFFF]|\uD869[\uDC00-\uDED6\uDF00-\uDFFF]|\uD86D[\uDC00-\uDF34\uDF40-\uDFFF]|\uD86E[\uDC00-\uDC1D\uDC20-\uDFFF]|\uD873[\uDC00-\uDEA1\uDEB0-\uDFFF]|\uD87A[\uDC00-\uDFE0])+$/.test(this.editorType.name)){
// 非中文对应
if(!/^(?:[\u3400-\u4DB5\u4E00-\u9FEA\uFA0E\uFA0F\uFA11\uFA13\uFA14\uFA1F\uFA21\uFA23\uFA24\uFA27-\uFA29]|[\uD840-\uD868\uD86A-\uD86C\uD86F-\uD872\uD874-\uD879][\uDC00-\uDFFF]|\uD869[\uDC00-\uDED6\uDF00-\uDFFF]|\uD86D[\uDC00-\uDF34\uDF40-\uDFFF]|\uD86E[\uDC00-\uDC1D\uDC20-\uDFFF]|\uD873[\uDC00-\uDEA1\uDEB0-\uDFFF]|\uD87A[\uDC00-\uDFE0])+$/.test(this.editorType.nameEn)){
if(this.editorType.sort>=0&&this.editorType.sort<10000){
// 上传修改
this.typeEditorVisible = false
}else{
this.$message.error('排序值不在指定范围,请输入正确的排序值!!!');
}
}else{
this.$message.error('英文名称不正确!!!');
}
}else{
this.$message.error('中文名称不正确!!!');
}
},
// 功能按钮
clickOperator(type){
if(type == "search"){
this.screenTableData()
}else{
this.currentStatus = ""
this.currentType = ""
this.currentSort = ""
this.screenTableData()
}
},
changeHandleSize(val) {
// console.log(`每页 ${val} 条`);
this.typePagination.pageSize = val
},
changeHandleCurrent(val) {
// console.log(`当前页: ${val}`);
this.typePagination.currentPage = val
},
// 显示图片查看器
showPreview(icon) {
this.currentIcon = icon;
this.currentIcon.showPreview = true;
},
// 关闭图片查看器
closePreview() {
this.currentIcon.showPreview = false;
},
},
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
#nebulaDynamics {
margin: 0 1% 0 1%;
width: 98%;
height: auto;
.top {
width: 100%;
height: 68px;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
overflow: hidden;
border-bottom: 1px solid #eeeeee;
.title {
width: 114px;
height: 46px;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
color: #000000;
overflow: hidden;
}
#typeCreator{
width: 100%;
height: auto;
.controls {
width: 296px;
height: 46px;
display: flex;
flex-direction: row;
justify-content: space-around;
align-items: center;
overflow: hidden;
.item {
width: 138px;
height: 46px;
display: flex;
flex-direction: column;
justify-content: flex-start;
flex-direction: row;
justify-content: center;
align-items: center;
.content{
margin-bottom: 25px;
width: 100%;
height: 26px;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
span{
width: 100px;
height: 26px;
}
background-color: #5178f2;
border: 1px solid #5178f2;
border-radius: 5px;
color: #ffffff;
font-weight: 400;
cursor: pointer;
overflow: hidden;
}
}
}
.operators {
// margin: 0 1% 0 1%;
width: 100%;
height: 68px;
display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: center;
.status,
.types,
.sorts {
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;
}
}
}
.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;
}
.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;
}
.operators{
margin: 25px 0 0 0;
width: 100%;
height: 30px;
display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: center;
.cancel,.confirm{
margin-left: 20px;
width: 82px;
height: 100%;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
border-radius: 5px;
}
.cancel{
border: 1px solid #bdbdbd;
color: #000000;
cursor: pointer;
}
.confirm{
border: 1px solid #5178F2;
background-color: #5178F2;
color: #FFFFFF;
cursor: pointer;
}
.edit,.upshelf{
color: #1890ff;
}
.offshelf {
color: #A6A9AD;
}
.delete {
color: #fe4066;
}
}
}
}
.infoPagination {
margin: 1% 1% 0 1%;
width: 98%;
}
}
#typeManager {
width: 100%;
height: auto;
.controls {
margin: 0 0 30px 0;
width: 100%;
height: 46px;
display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: center;
.addUpdate {
width: 120px;
height: 100%;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
color: #5178f2;
border: 1px solid #5178f2;
border-radius: 5px;
cursor: pointer;
}
}
.content {
width: 100%;
height: auto;
display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: center;
.operators {
width: auto;
height: 16px;
display: flex;
flex-direction: row;
justify-content: space-around;
align-items: center;
.edit,
.upshelf,
.offshelf,
.delete {
width: auto;
height: 16px;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
cursor: pointer;
}
.edit,.upshelf{
color: #1890ff;
}
.offshelf {
color: #A6A9AD;
}
.delete {
color: #fe4066;
}
}
}
.typePagination{
margin: 30px 0;
width: 100%;
}
}
#typeCreator,#typeEditor {
width: 100%;
height: auto;
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: center;
.content {
margin-bottom: 25px;
width: 100%;
height: 26px;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
span {
width: 100px;
height: 26px;
}
}
.operators {
margin: 25px 0 0 0;
width: 100%;
height: 30px;
display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: center;
.cancel,
.confirm {
margin-left: 20px;
width: 82px;
height: 100%;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
border-radius: 5px;
}
.cancel {
border: 1px solid #bdbdbd;
color: #000000;
cursor: pointer;
}
.confirm {
border: 1px solid #5178f2;
background-color: #5178f2;
color: #ffffff;
cursor: pointer;
}
}
}
</style>
\ No newline at end of file
src/views/webSiteManagement/newsCategory/newsCreator/index.vue
View file @ d12fda14
<!--
* @Author: Jenkins
* @Date: 2020-12-02 14:49:10
* @LastEditTime: 2020-12-04 13:53:59
* @LastEditTime: 2020-12-07 18:52:23
* @LastEditors: Please set LastEditors
* @Description: 创建新闻
* @FilePath: \rs-cloud-platform-ui\src\views\webSiteManagement\newsCategory\newsCreator\index.vue
......@@ -32,8 +32,15 @@
<el-form-item label="*资讯类型">
<el-col :span="8">
<el-select v-model="form.region" placeholder="请选择选择资讯类型">
<el-option label="类型一" value="type1"></el-option>
<el-option label="类型二" value="type2"></el-option>
<el-option
v-for="item in types"
:key="item.value"
:label="item.label"
:value="item.value"
></el-option>
<!-- <el-option v-for="item in types" :key="item.key" :label="item.label" :value="item.key" v-show="types.length>0"></el-option> -->
<!-- <el-option label="类型一" value="type1"></el-option>
<el-option label="类型二" value="type2"></el-option> -->
</el-select>
</el-col>
</el-form-item>
......@@ -59,6 +66,11 @@
<script>
import singleImageX from '@/components/Upload/singleImageX';
import KindEditor from "@/components/Kindeditor";
import {timestamp2Date} from '@/utils/dateUtils';
import {uuid} from "@/utils/uuid";// 导入请求
import {
addUpdateNewsInfo,
} from "@/api/website/newsCategory/index";
export default {
name: 'newsCreator',
components: {
......@@ -67,7 +79,9 @@ export default {
},
data(){
return {
types: [],
form: {
id: '',
title: '',
coverImg: '',
introduce: '',
......@@ -78,7 +92,15 @@ export default {
}
},
mounted() {
this.types = []
this.$parent.regions.forEach(element => {
if(element.status==1){
this.types.push({
value: element.id,
label: element.nameCn,
})
}
});
},
methods: {
onContentChange (val) {
......@@ -91,7 +113,45 @@ export default {
this.form.coverImg = url
},
onSubmit() {
console.log('submit!');
if(this.form.title==""){
this.$message.error('请输入资讯标题!!!');
}else if(this.form.coverImg==""){
this.$message.error('请输入上传封面图!!!');
}else if(this.form.introduce==""){
this.$message.error('请输入资讯简介!!!');
}else if(this.form.region==""){
this.$message.error('请选择选择资讯类型!!!');
}else if(this.form.sort==""){
this.$message.error('请输入序号!!!');
}else if(this.form.content==""){
this.$message.error('请输入资讯详情!!!');
}else{
// 新增新闻资讯
addUpdateNewsInfo({
id: uuid(),
title: this.form.title,
detail: this.form.introduce,
coverImg: this.form.coverImg,
content: this.form.content,
newsDate: timestamp2Date((new Date()).getTime()),
typeId: this.form.region,
status: 0, // 默认上传即为下架状态
indexShow: 1,
typeName: (this.types.find(ele => ele.value == this.form.region)).label,
}).then((res) => {
if(res.status==200){
let _this = this
this.$message({
message: '创建成功!!!',
type: 'success',
duration: 2000,
});
setTimeout(()=>{
_this.componentName = "nebulaDynamics"
},2100);
}
});
}
}
},
}
......
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