Commit c4aa0fbb by lijinqi

1.我的资源:算力资源分类筛选条件bug修复

2.算力资源列表 卡片布局切列表布局bug修复
3.我的订单:属性值为空时的异常处理
4.活动资讯页面,修复列表被导航栏遮挡bug
5.面包屑去掉
6.行业应用新增详情页,从详情页跳转到试用
parent c3c1c0ba
...@@ -25,6 +25,15 @@ export function assemblyList (query) { ...@@ -25,6 +25,15 @@ export function assemblyList (query) {
}) })
} }
// 获取组件服务详情
export function assemblyDetail (query) {
return request({
url: '/biz/industry-application/get',
method: 'get',
params: query
})
}
export function assemblyType (query) { export function assemblyType (query) {
return request({ return request({
url: '/api/v1/assemblyType', url: '/api/v1/assemblyType',
......
...@@ -18,11 +18,12 @@ export function getAppCategoryList(params) { ...@@ -18,11 +18,12 @@ export function getAppCategoryList(params) {
} }
export function getAppInfoDetail(params) { export function getAppInfoDetail(params, config) {
return request({ return request({
url: '/apihub/api/get', url: '/apihub/api/get',
method: 'get', method: 'get',
params: params params: params,
...(config || {})
}) })
} }
...@@ -59,4 +60,4 @@ export function createPay(query){ ...@@ -59,4 +60,4 @@ export function createPay(query){
method: 'post', method: 'post',
data: query data: query
}) })
} }
\ No newline at end of file
...@@ -119,6 +119,15 @@ export function updateMobile(data) { ...@@ -119,6 +119,15 @@ export function updateMobile(data) {
}) })
} }
// 用户通过短信验证码修改密码
export function updateUserPwdByCode(data) {
return request({
url: '/member/user/update-password',
method: 'put',
data: data
})
}
// 用户头像上传 // 用户头像上传
export function uploadAvatar(data) { export function uploadAvatar(data) {
return request({ return request({
......
// cover some element-ui styles // cover some element-ui styles
.el-breadcrumb__inner,
.el-breadcrumb__inner a {
font-weight: 400 !important;
}
.el-upload { .el-upload {
input[type="file"] { input[type="file"] {
......
...@@ -103,23 +103,6 @@ aside { ...@@ -103,23 +103,6 @@ aside {
box-sizing: border-box; box-sizing: border-box;
} }
.com-breadcrumb{
background-color: #FFFFFF;
border-bottom: 1px solid #EBEDED;
padding: 30px;
margin-top:30px;
.el-breadcrumb{
font-size: 16px ;
}
.el-breadcrumb__inner{
color: #333!important;
}
.el-breadcrumb__item {
&:last-child .el-breadcrumb__inner {
color: #999!important;
}
}
}
.components-container { .components-container {
margin: 30px 50px; margin: 30px 50px;
...@@ -314,21 +297,7 @@ aside { ...@@ -314,21 +297,7 @@ aside {
.com-breadcrumb-1 {
font-size: 14px;
color: #fff;
background: var(--el-color-primary);
padding: 12px 24px;
padding: 30px;
.el-breadcrumb {
font-size: 16px;
}
.el-breadcrumb__inner,
.el-breadcrumb__separator,
.el-breadcrumb__item:last-child .el-breadcrumb__inner {
color: #fff !important;
}
}
// 控制台的全局样式 // 控制台的全局样式
......
...@@ -16,6 +16,7 @@ const whiteList = [ ...@@ -16,6 +16,7 @@ const whiteList = [
'/industryApplications/index', '/industryApplications/index',
'/industryApplications/detail', '/industryApplications/detail',
'/componentServices/componentServicesList', '/componentServices/componentServicesList',
'/componentServices/detail',
'/partnership/partnershipList', '/partnership/partnershipList',
'/information/informationDetail', '/information/informationDetail',
'/information/informationList', '/information/informationList',
......
...@@ -131,6 +131,12 @@ export const constantRoutes = [ ...@@ -131,6 +131,12 @@ export const constantRoutes = [
component: () => import('@/views/componentServices/list.vue'), component: () => import('@/views/componentServices/list.vue'),
name: 'ComponentServicesList', name: 'ComponentServicesList',
meta: {title: '行业应用'} meta: {title: '行业应用'}
},
{
path: 'detail',
component: () => import('@/views/componentServices/detail.vue'),
name: 'ComponentServicesDetail',
meta: {title: '行业应用详情'}
} }
] ]
}, },
......
...@@ -110,6 +110,13 @@ service.interceptors.response.use(res => { ...@@ -110,6 +110,13 @@ service.interceptors.response.use(res => {
}, },
error => { error => {
console.log('err' + error) console.log('err' + error)
// 忽略被取消/中止的请求错误,避免无意义的报错提示
if (axios.isCancel && axios.isCancel(error)) {
return Promise.reject(error)
}
if (error && (error.code === 'ERR_CANCELED' || error.message === 'canceled' || error.name === 'CanceledError')) {
return Promise.reject(error)
}
let { message } = error; let { message } = error;
if (message == "Network Error") { if (message == "Network Error") {
message = "后端接口连接异常"; message = "后端接口连接异常";
......
<template> <template>
<div class="app-container custom-main-w "> <div class="app-container custom-main-w ">
<div style="margin: 0 auto;padding: 0 84px;'"> <div style="margin: 0 auto; padding: 0 84px;">
<el-row :gutter="24"> <el-row :gutter="24">
<el-col v-for="(item,index) in assemblyData" :key="item.id" :span="6"> <el-col v-for="(item,index) in assemblyData" :key="item.id" :span="6">
<div class="item flex"> <div class="item flex">
...@@ -9,36 +9,22 @@ ...@@ -9,36 +9,22 @@
<div class="title">{{ item.title }}</div> <div class="title">{{ item.title }}</div>
<p v-html="item.description"></p> <p v-html="item.description"></p>
<el-button round @click="openPage(item,index)">点击试用</el-button> <el-button round @click="openPage(item,index)">了解详情</el-button>
</div> </div>
</div> </div>
</el-col> </el-col>
</el-row> </el-row>
</div> </div>
<el-dialog
v-model="dialogTableVisible"
style="width: 80% !important;"
:title="dialogTitle"
@close="handleDialogClose"
>
<div>
<iframe v-show="iframeShow" ref="iframe" :src="iframeSrc" width="100%" height="700px"></iframe>
</div>
</el-dialog>
</div> </div>
</template> </template>
<script setup name="ComponentServicesList"> <script setup name="ComponentServicesList">
import {ref} from 'vue' import {ref} from 'vue'
import {assemblyList} from '@/api/home.js' import {assemblyList} from '@/api/home.js'
import {assemblyType} from "../../api/home.js"; import { useRouter } from 'vue-router'
const assemblyData = ref([]) const assemblyData = ref([])
const iframeSrc = ref('') const router = useRouter()
const iframeShow = ref(false)
const dialogTableVisible = ref(false)
const dialogTitle = ref('')
const indexNum = ref(0)
function getAassemblyList() { function getAassemblyList() {
assemblyList().then(res => { assemblyList().then(res => {
...@@ -47,22 +33,9 @@ function getAassemblyList() { ...@@ -47,22 +33,9 @@ function getAassemblyList() {
} }
function openPage(data, index) { function openPage(data, index) {
indexNum.value = index if (data && data.id) {
dialogTitle.value = data.title router.push({ path: '/componentServices/detail', query: { id: data.id } })
iframeSrc.value = data.url }
dialogTableVisible.value = true
iframeShow.value = true
// window.open(data.url)
}
function cancel() {
dialogTableVisible.value = false
iframeShow.value = false
}
// 关闭弹窗
function handleDialogClose() {
iframeSrc.value = null
} }
getAassemblyList() getAassemblyList()
...@@ -123,45 +96,9 @@ getAassemblyList() ...@@ -123,45 +96,9 @@ getAassemblyList()
} }
} }
.iframe-container { /* 旧iframe容器样式已移除 */
position: absolute;
top: 10%;
left: 6%;
}
.iframe-container iframe {
position: absolute;
top: 0;
left: 0;
}
:deep(.el-dialog__body) {
padding-top: unset !important;
}
.el-tabs {
--el-border-color-light: #2E77E3;
--el-tabs-header-height: 48px;
:deep(.el-tabs__content) { /* 清理过期的弹窗与Tab样式 */
overflow: visible
}
:deep(.el-tabs__active-bar) {
display: none;
}
:deep(.el-tabs__item) {
--el-font-size-base: 16px;
padding-left: 24px !important;
padding-right: 24px !important;
&.is-active {
color: #ffffff;
background-color: #2E77E3;
}
}
}
.el-button { .el-button {
height: 40px; height: 40px;
......
<template> <template>
<div class="app-container confirm-order"> <div class="app-container confirm-order">
<div class="breadcrumb">
<div class="flex-justify-end">
<el-breadcrumb separator="/">
<el-breadcrumb-item>首页</el-breadcrumb-item>
<el-breadcrumb-item>计算资源</el-breadcrumb-item>
<el-breadcrumb-item>确认订单</el-breadcrumb-item>
</el-breadcrumb>
</div>
</div>
<div class="page-title"> <div class="page-title">
<div>确认订单</div> <div>确认订单</div>
</div> </div>
...@@ -136,24 +127,6 @@ function submit () { ...@@ -136,24 +127,6 @@ function submit () {
min-height: 100%; min-height: 100%;
} }
.breadcrumb {
background-color: #FFFFFF;
border-bottom: 1px solid #EBEDED;
padding-top: 12px;
padding-bottom: 12px;
> div {
width: 1280px;
margin: 0 auto;
}
:deep(.el-breadcrumb__item) {
&:last-child .el-breadcrumb__inner {
color: #222222;
}
}
}
.page-title { .page-title {
font-weight: bold; font-weight: bold;
font-size: 24px; font-size: 24px;
......
<template> <template>
<div class="app-container computing-resource"> <div class="app-container computing-resource">
<div class="breadcrumb">
<div class="flex-justify-end">
<el-breadcrumb separator="/">
<el-breadcrumb-item>首页</el-breadcrumb-item>
<el-breadcrumb-item>计算资源</el-breadcrumb-item>
</el-breadcrumb>
</div>
</div>
<div class="top-banner-list flex-justify-center"> <div class="top-banner-list flex-justify-center">
<div class="banner-item flex-align-center"> <div class="banner-item flex-align-center">
...@@ -505,28 +497,11 @@ const clearProtocol = () => { ...@@ -505,28 +497,11 @@ const clearProtocol = () => {
<style scoped lang="scss"> <style scoped lang="scss">
.app-container { .app-container {
padding-top: 0; padding-top: 20px;
padding-left: 0; padding-left: 0;
padding-right: 0; padding-right: 0;
} }
.breadcrumb {
border-bottom: 1px solid #EBEDED;
padding-top: 12px;
padding-bottom: 12px;
> div {
width: 1280px;
margin: 0 auto;
}
:deep(.el-breadcrumb__item) {
&:last-child .el-breadcrumb__inner {
color: #222222;
}
}
}
.top-banner-list { .top-banner-list {
margin-top: 84px; margin-top: 84px;
......
<template> <template>
<div class="app-container shopping-cart"> <div class="app-container shopping-cart">
<div class="breadcrumb">
<div class="flex-justify-end">
<el-breadcrumb separator="/">
<el-breadcrumb-item>首页</el-breadcrumb-item>
<el-breadcrumb-item>计算资源</el-breadcrumb-item>
<el-breadcrumb-item>购物车</el-breadcrumb-item>
</el-breadcrumb>
</div>
</div>
<div class="page-title"> <div class="page-title">
<div>购物车 (总共{{ tableData.length }})</div> <div>购物车 (总共{{ tableData.length }})</div>
</div> </div>
...@@ -233,24 +224,6 @@ function submit() { ...@@ -233,24 +224,6 @@ function submit() {
min-height: 100%; min-height: 100%;
} }
.breadcrumb {
background-color: #FFFFFF;
border-bottom: 1px solid #EBEDED;
padding-top: 12px;
padding-bottom: 12px;
> div {
width: 1280px;
margin: 0 auto;
}
:deep(.el-breadcrumb__item) {
&:last-child .el-breadcrumb__inner {
color: #222222;
}
}
}
.page-title { .page-title {
font-weight: bold; font-weight: bold;
font-size: 22px; font-size: 22px;
......
...@@ -113,13 +113,18 @@ ...@@ -113,13 +113,18 @@
</el-table-column> </el-table-column>
<el-table-column label="资源类型" align="center" prop="categoryName"/> <el-table-column label="资源类型" align="center" prop="categoryName"/>
<el-table-column <el-table-column label="商品属性" align="center" width="400">
v-for="(item, index) in orderList[0]?.properties.length!==0?orderList[0]?.properties.slice(0,4):orderList[0]?.properties"
:key="index"
:label="item.propertyName"
>
<template #default="{ row }"> <template #default="{ row }">
{{ row.properties?.[index]?.valueName || '-' }} <div class="mt-1 properties-cell" v-if="row.properties && row.properties.length">
<el-tag
v-for="(property, i) in row.properties"
:key="property.propertyId ?? i"
class="mb-1 mr-1"
>
{{ property.propertyName }}: {{ property.valueName }}
</el-tag>
</div>
<span v-else>-</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="订单状态" align="center" prop="statusName"/> <el-table-column label="订单状态" align="center" prop="statusName"/>
...@@ -438,4 +443,14 @@ loadCategories() ...@@ -438,4 +443,14 @@ loadCategories()
color: #303233; color: #303233;
} }
} }
/* Limit properties column to 200px width and 2 lines */
.properties-cell {
width: 400px;
overflow: hidden;
display: -webkit-box;
-webkit-line: 2;
-webkit-box-orient: vertical;
white-space: normal;
}
</style> </style>
...@@ -3,15 +3,19 @@ ...@@ -3,15 +3,19 @@
<el-table v-loading="loading" :data="resourcesList" :max-height="620"> <el-table v-loading="loading" :data="resourcesList" :max-height="620">
<el-table-column label="订单编号" align="center" prop="tradeOrderNo"/> <el-table-column label="订单编号" align="center" prop="tradeOrderNo"/>
<!-- <el-table-column label="商品类别" align="center" prop="categoryName"/>--> <!-- <el-table-column label="商品类别" align="center" prop="categoryName"/>-->
<el-table-column <el-table-column label="资源属性" align="center" width="400">
v-for="(item, index) in resourcesList[0]?.properties.length!==0?resourcesList[0]?.properties.slice(0,4):resourcesList[0]?.properties"
:key="index"
:label="item.propertyName"
>
<template #default="{ row }"> <template #default="{ row }">
{{ row.properties?.[index]?.valueName || '-' }} <div class="mt-1 properties-cell" v-if="row.properties && row.properties.length">
<el-tag
v-for="(property, i) in row.properties"
:key="property.propertyId ?? i"
class="mb-1 mr-1"
>
{{ property.propertyName }}: {{ property.valueName }}
</el-tag>
</div>
<span v-else>-</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="申请时间" align="center" prop="createTime" width="180"> <el-table-column label="申请时间" align="center" prop="createTime" width="180">
<template #default="scope"> <template #default="scope">
......
...@@ -83,25 +83,7 @@ getDetail() ...@@ -83,25 +83,7 @@ getDetail()
<style scoped lang="scss"> <style scoped lang="scss">
.app-container { .app-container {
padding-top: 100px; padding-top: 90px;
}
.breadcrumb {
background-color: #FFFFFF;
border-bottom: 1px solid #EBEDED;
padding-top: 12px;
padding-bottom: 12px;
> div {
width: 1280px;
margin: 0 auto;
}
:deep(.el-breadcrumb__item) {
&:last-child .el-breadcrumb__inner {
color: #222222;
}
}
} }
.block-title { .block-title {
......
...@@ -213,7 +213,7 @@ function handleSolution(id) { ...@@ -213,7 +213,7 @@ function handleSolution(id) {
} }
.app-container { .app-container {
padding-top: 100px; padding-top: 90px;
flex-grow: 1; flex-grow: 1;
flex-shrink: 1; flex-shrink: 1;
position: relative; position: relative;
......
...@@ -33,23 +33,6 @@ getInformationDetail() ...@@ -33,23 +33,6 @@ getInformationDetail()
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
.breadcrumb {
background-color: #FFFFFF;
padding-top: 12px;
padding-bottom: 12px;
> div {
width: 1280px;
margin: 0 auto;
}
:deep(.el-breadcrumb__item) {
&:last-child .el-breadcrumb__inner {
color: #222222;
}
}
}
.app-container { .app-container {
background-color: #F7F8F9; background-color: #F7F8F9;
padding: 0 0 90px; padding: 0 0 90px;
......
...@@ -59,23 +59,6 @@ getInformation() ...@@ -59,23 +59,6 @@ getInformation()
min-height: 100%; min-height: 100%;
} }
.breadcrumb {
background-color: #FFFFFF;
padding-top: 12px;
padding-bottom: 12px;
> div {
width: 1280px;
margin: 0 auto;
}
:deep(.el-breadcrumb__item) {
&:last-child .el-breadcrumb__inner {
color: #222222;
}
}
}
.form { .form {
width: 1280px; width: 1280px;
margin: 24px auto 24px auto; margin: 24px auto 24px auto;
......
...@@ -298,4 +298,8 @@ export default { ...@@ -298,4 +298,8 @@ export default {
margin-top: 30px; margin-top: 30px;
margin-bottom: 50px; margin-bottom: 50px;
} }
.app-container {
padding-top: 90px;
}
</style> </style>
<template> <template>
<div class="custom-wrapper order-confirm-container"> <div class="custom-wrapper order-confirm-container">
<div class="com-breadcrumb-1">
<div class="custom-main-w">
<el-breadcrumb separator=">">
</el-breadcrumb>
</div>
</div>
<div class="custom-main-w order-main"> <div class="custom-main-w order-main">
<h2 class="order-title">确认订单</h2> <h2 class="order-title">确认订单</h2>
<div class="order-info-list"> <div class="order-info-list">
......
...@@ -16,12 +16,12 @@ ...@@ -16,12 +16,12 @@
<li class="list-group-item"> <li class="list-group-item">
<svg-icon icon-class="user"/> <svg-icon icon-class="user"/>
用户名称 用户名称
<div class="pull-right">{{ state.userName }}</div> <div class="pull-right">{{ state.user.nickname }}</div>
</li> </li>
<li class="list-group-item"> <li class="list-group-item">
<svg-icon icon-class="phone"/> <svg-icon icon-class="phone"/>
手机号码 手机号码
<div class="pull-right">{{ state.mobile}}</div> <div class="pull-right">{{ state.user.mobile}}</div>
</li> </li>
</ul> </ul>
</div> </div>
......
<template> <template>
<el-form ref="pwdRef" :model="user" :rules="rules" label-width="80px" style="width: 400px;height: 260px;"> <el-form ref="pwdRef" :model="user" :rules="rules" label-width="140px" style="width: 500px;height: 260px;">
<el-form-item label="旧密码" prop="oldPassword"> <el-form-item label="手机号码">
<el-input v-model="user.oldPassword" placeholder="请输入旧密码" type="password" show-password /> <el-input :model-value="props.user?.mobile" placeholder="请输入手机号码" type="text" disabled />
</el-form-item> </el-form-item>
<el-form-item label="新密码" prop="newPassword"> <el-form-item label="验证码" prop="code">
<el-input v-model="user.newPassword" placeholder="请输入新密码" type="password" show-password /> <el-input
</el-form-item> v-model="user.code"
<el-form-item label="确认密码" prop="confirmPassword"> type="text"
<el-input v-model="user.confirmPassword" placeholder="请确认新密码" type="password" show-password/> size="large"
</el-form-item> auto-complete="off"
<el-form-item> placeholder="请输入短信验证码"
>
<template #append>
<el-button @click="startCountdown" :disabled="isCounting">
{{ isCounting ? `重新发送(${countdown})` : '发送验证码' }}
</el-button>
</template>
</el-input>
</el-form-item>
<el-form-item label="新密码" prop="newPassword">
<el-input v-model="user.newPassword" placeholder="请输入新密码" type="password" show-password />
</el-form-item>
<el-form-item label="确认密码" prop="confirmPassword">
<el-input v-model="user.confirmPassword" placeholder="请确认新密码" type="password" show-password />
</el-form-item>
<el-form-item>
<el-button type="primary" @click="submit">保存</el-button> <el-button type="primary" @click="submit">保存</el-button>
<!-- <el-button type="danger" @click="close">关闭</el-button>--> <!-- <el-button type="danger" @click="close">关闭</el-button>-->
</el-form-item> </el-form-item>
</el-form> </el-form>
</template> </template>
<script setup> <script setup>
import { updateUserPwd } from "@/api/system/user"; import { updateUserPwdByCode } from "@/api/system/user";
import { sendCode } from "@/api/login.js";
import { ElMessage, ElMessageBox } from "element-plus";
import useUserStore from "@/store/modules/user.js";
const userStore = useUserStore();
const { proxy } = getCurrentInstance(); const { proxy } = getCurrentInstance();
const props = defineProps({
user: {
type: Object
}
});
const user = reactive({ const user = reactive({
oldPassword: undefined, code: "",
newPassword: undefined, newPassword: undefined,
confirmPassword: undefined confirmPassword: undefined
}); });
const countdown = ref(60);
const isCounting = ref(false);
const pwdRef = ref(null);
const equalToPassword = (rule, value, callback) => { const equalToPassword = (rule, value, callback) => {
if (user.newPassword !== value) { if (user.newPassword !== value) {
callback(new Error("两次输入的密码不一致")); callback(new Error("两次输入的密码不一致"));
...@@ -34,24 +63,74 @@ const equalToPassword = (rule, value, callback) => { ...@@ -34,24 +63,74 @@ const equalToPassword = (rule, value, callback) => {
callback(); callback();
} }
}; };
const rules = ref({ const rules = ref({
oldPassword: [{ required: true, message: "旧密码不能为空", trigger: "blur" }], code: [{ required: true, message: "验证码不能为空", trigger: "blur" }],
newPassword: [{ required: true, message: "新密码不能为空", trigger: "blur" }, { min: 6, max: 20, message: "长度在 6 到 20 个字符", trigger: "blur" }, { pattern: /^[^<>"'|\\]+$/, message: "不能包含非法字符:< > \" ' \\\ |", trigger: "blur" }], newPassword: [
confirmPassword: [{ required: true, message: "确认密码不能为空", trigger: "blur" }, { required: true, validator: equalToPassword, trigger: "blur" }] { required: true, message: "新密码不能为空", trigger: "blur" },
{ min: 6, max: 20, message: "长度在 6 到 20 个字符", trigger: "blur" },
{ pattern: /^[^<>\"'|\\\\]+$/, message: "不能包含非法字符:< > \\\" ' \\\\ |", trigger: "blur" }
],
confirmPassword: [
{ required: true, message: "确认密码不能为空", trigger: "blur" },
{ required: true, validator: equalToPassword, trigger: "blur" }
]
}); });
function getCode() {
const mobile = props.user?.mobile;
if (!mobile) {
ElMessage({ message: "未获取到手机号", type: "warning" });
return;
}
// 场景: 会员用户 - 修改密码 -> scene = 3
sendCode({ mobile, scene: 3 }).then((res) => {
if (res.data === true) {
ElMessage({ message: "短信已发送请注意查收", type: "success" });
}
});
}
const startCountdown = () => {
if (isCounting.value) return;
getCode();
isCounting.value = true;
const timer = setInterval(() => {
if (countdown.value > 0) {
countdown.value--;
} else {
clearInterval(timer);
isCounting.value = false;
countdown.value = 60;
}
}, 1000);
};
/** 提交按钮 */ /** 提交按钮 */
function submit() { function submit() {
proxy.$refs.pwdRef.validate(valid => { proxy.$refs.pwdRef.validate((valid) => {
if (valid) { if (valid) {
updateUserPwd(user.oldPassword, user.newPassword).then(response => { updateUserPwdByCode({ code: user.code, password: user.newPassword }).then((res) => {
proxy.$modal.msgSuccess("修改成功"); if (res.code === 0 && res.data) {
ElMessageBox.confirm("修改成功,请重新登录", "提示", {
confirmButtonText: "确认",
showCancelButton: false,
showClose: false,
type: "warning"
}).then(() => {
userStore.logOut().then(() => {
location.href = "/index";
});
});
}
}); });
} }
}); });
}; }
/** 关闭按钮 */ /** 关闭按钮 */
function close() { function close() {
proxy.$tab.closePage(); proxy.$tab.closePage();
}; }
</script> </script>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment