Browse Source

修改步骤条、增加全局请求

pull/1/head
zq 4 months ago
parent
commit
5be4c7c6eb
  1. 8
      package-lock.json
  2. 2
      package.json
  3. 1
      src/assets/register/drop-selected.svg
  4. 1
      src/assets/register/edit-tem.svg
  5. 1
      src/assets/register/look-tem.svg
  6. BIN
      src/assets/register/tem-img-normal.png
  7. 170
      src/components/CustomDropdown.vue
  8. 2
      src/main.js
  9. 7
      src/store/index.js
  10. 384
      src/style/theme/common.scss
  11. 90
      src/utils/request.js
  12. 62
      src/views/Personalization.vue
  13. 511
      src/views/Register.vue
  14. 1
      src/views/SiteList.vue
  15. 49
      src/views/SiteSettings.vue

8
package-lock.json

@ -8,7 +8,7 @@
"name": "newkuaile-vue-project2",
"version": "0.1.0",
"dependencies": {
"axios": "^1.7.9",
"axios": "^1.8.3",
"core-js": "^3.40.0",
"element-ui": "^2.15.14",
"regenerator-runtime": "^0.14.1",
@ -3939,9 +3939,9 @@
}
},
"node_modules/axios": {
"version": "1.7.9",
"resolved": "https://registry.npmjs.org/axios/-/axios-1.7.9.tgz",
"integrity": "sha512-LhLcE7Hbiryz8oMDdDptSrWowmB4Bl6RCt6sIJKpRB4XtVf0iEgewX3au/pJqm+Py1kCASkb/FFKjxQaLtxJvw==",
"version": "1.8.3",
"resolved": "https://registry.npmjs.org/axios/-/axios-1.8.3.tgz",
"integrity": "sha512-iP4DebzoNlP/YN2dpwCgb8zoCmhtkajzS48JvwmkSkXvPI3DHc7m+XYL5tGnSlJtR6nImXZmdCuN5aP8dh1d8A==",
"license": "MIT",
"dependencies": {
"follow-redirects": "^1.15.6",

2
package.json

@ -8,7 +8,7 @@
"lint": "vue-cli-service lint"
},
"dependencies": {
"axios": "^1.7.9",
"axios": "^1.8.3",
"core-js": "^3.40.0",
"element-ui": "^2.15.14",
"regenerator-runtime": "^0.14.1",

1
src/assets/register/drop-selected.svg

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="none" version="1.1" width="16" height="16" viewBox="0 0 16 16"><g><g></g><g><path d="M13.5732,5.315390953125Q13.6985,5.197082953125,13.7668,5.0388329531250005Q13.835,4.880582953125,13.835,4.708251953125Q13.835,4.626011653125,13.819,4.545351953125Q13.8029,4.464691953125,13.7714,4.388710953125Q13.74,4.3127309531249995,13.6943,4.244350953125Q13.6486,4.175970953125,13.5904,4.117817953125Q13.5323,4.059664953125,13.4639,4.013974953125Q13.3955,3.968284953125,13.3195,3.936812953125Q13.2436,3.905340953125,13.1629,3.889295953125Q13.0822,3.873251953125,13,3.873251953125Q12.90746,3.873251953125,12.81716,3.8935169531250002Q12.72686,3.913781953125,12.64319,3.953328953125Q12.55951,3.992875953125,12.48654,4.049783953125Q12.41356,4.106692953125,12.35481,4.178200953125L7.06803,9.842611953125001L3.542182,7.198221953125Q3.428807,7.101421953125,3.288942,7.049841953125Q3.149076,6.998251953125,3,6.998251953125Q2.9177597,6.998251953125,2.8371,7.014291953124999Q2.75644,7.030341953125,2.680459,7.061811953125Q2.604479,7.093281953125,2.536099,7.138971953125Q2.4677189999999998,7.184661953125,2.409566,7.242821953125Q2.351413,7.300971953125,2.305723,7.369351953124999Q2.260033,7.437731953125001,2.228561,7.513711953125Q2.197089,7.589691953125,2.181044,7.6703519531249995Q2.165,7.7510119531249995,2.165,7.833251953125Q2.165,7.937161953125,2.190469,8.037911953125Q2.215938,8.138651953125,2.265322,8.230081953125Q2.314706,8.321511953125,2.384993,8.398041953125Q2.45528,8.474581953125,2.542182,8.531551953125L6.66667,11.624921953125Q6.72781,11.670781953125001,6.796279999999999,11.704751953125001Q6.864739999999999,11.738721953125001,6.93825,11.759671953125Q7.01175,11.780621953125,7.08784,11.787851953125Q7.16393,11.795081953124999,7.24006,11.788351953125Q7.31619,11.781621953125,7.38983,11.761151953125001Q7.46347,11.740681953125,7.53216,11.707161953125Q7.60084,11.673641953125,7.66229,11.628181953125Q7.72373,11.582721953124999,7.77588,11.526851953125L13.5732,5.315390953125Z" fill-rule="evenodd" fill="#006AFF" fill-opacity="1"/></g></g></svg>

After

Width:  |  Height:  |  Size: 2.1 KiB

1
src/assets/register/edit-tem.svg

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="none" version="1.1" width="16" height="16" viewBox="0 0 16 16"><defs><clipPath id="master_svg0_127_38782"><rect x="0" y="0" width="16" height="16" rx="0"/></clipPath></defs><g clip-path="url(#master_svg0_127_38782)"><g><path d="M2.666667,2.666667L7.33333,2.666667L7.33333,2.665Q7.39883,2.665,7.46307,2.652222Q7.52731,2.639444,7.58782,2.61438Q7.64833,2.589315,7.70279,2.552927Q7.75725,2.516539,7.80356,2.470226Q7.84987,2.4239129999999998,7.88626,2.369454Q7.92265,2.314996,7.94771,2.254484Q7.97278,2.193973,7.98555,2.129735Q7.99833,2.0654968,7.99833,2Q7.99833,1.9345032,7.98556,1.870265Q7.97278,1.806027,7.94771,1.745516Q7.92265,1.685004,7.88626,1.630546Q7.84987,1.576087,7.80356,1.529774Q7.75725,1.4834610000000001,7.70279,1.447073Q7.64833,1.410685,7.58782,1.3856199999999999Q7.52731,1.3605559999999999,7.46307,1.347778Q7.39883,1.335,7.33333,1.335L7.33333,1.333333L2.666667,1.333333Q2.114382,1.333333,1.723858,1.723858Q1.333333,2.114382,1.333333,2.666667L1.333333,13.3333Q1.333333,13.8856,1.72386,14.2761Q2.114382,14.6667,2.666667,14.6667L13.3333,14.6667Q13.8856,14.6667,14.2761,14.2761Q14.6667,13.8856,14.6667,13.3333L14.6667,8.66667L14.665,8.66667Q14.665,8.60117,14.6522,8.53693Q14.6394,8.47269,14.6144,8.41218Q14.5893,8.35167,14.5529,8.29721Q14.5165,8.242750000000001,14.4702,8.196439999999999Q14.4239,8.15013,14.3695,8.11374Q14.315,8.07735,14.2545,8.05229Q14.194,8.02722,14.1297,8.01444Q14.0655,8.00167,14,8.00167Q13.9345,8.00167,13.8703,8.01444Q13.806,8.02722,13.7455,8.05229Q13.685,8.07735,13.6305,8.11374Q13.5761,8.15013,13.5298,8.196439999999999Q13.4835,8.242750000000001,13.4471,8.29721Q13.4107,8.35167,13.3856,8.41218Q13.3606,8.47269,13.3478,8.53693Q13.335,8.60117,13.335,8.66667L13.3333,8.66667L13.3333,13.3333L2.666667,13.3333L2.666667,2.666667Z" fill-rule="evenodd" fill="#8A9099" fill-opacity="1"/></g><g><path d="M11.093726507720948,1.528492L11.093346507720948,1.528878L4.194979507720947,8.43551Q4.101341507720948,8.52926,4.050670507720947,8.6517Q3.9999995077209474,8.77413,3.9999995077209474,8.90663L3.9999995077209474,11.33333Q3.9999995077209474,11.39899,4.012809507720947,11.46339Q4.025619507720947,11.52779,4.050746507720947,11.58845Q4.075874507720947,11.64912,4.112353507720948,11.70371Q4.148832507720948,11.75831,4.1952625077209476,11.80474Q4.241691507720947,11.85117,4.296286507720947,11.88764Q4.350881507720947,11.92412,4.411544507720947,11.94925Q4.472207507720947,11.97438,4.536606507720947,11.98719Q4.601005607720947,12,4.666666507720947,12L7.105736507720947,12Q7.238376507720947,12,7.360926507720947,11.94922Q7.483466507720948,11.89845,7.577236507720947,11.80463L14.471506507720948,4.90733Q14.517916507720948,4.8609100000000005,14.554376507720947,4.8063199999999995Q14.590836507720947,4.75174,14.615946507720947,4.69109Q14.641056507720947,4.63044,14.653866507720947,4.56606Q14.666666507720947,4.50167,14.666666507720947,4.436030000000001Q14.666666507720947,4.37039,14.653866507720947,4.306010000000001Q14.641056507720947,4.24163,14.615946507720947,4.18098Q14.590836507720947,4.12033,14.554376507720947,4.06574Q14.517916507720948,4.01116,14.471506507720948,3.9647300000000003L12.036536507720946,1.528699Q11.990116507720948,1.482259,11.935536507720947,1.4457680000000002Q11.880946507720946,1.409277,11.820286507720947,1.384136Q11.759636507720948,1.3589959999999999,11.695236507720947,1.3461720000000001Q11.630836507720947,1.333348,11.565176507720947,1.333333Q11.499516507720948,1.333319,11.435116507720947,1.346115Q11.370716507720946,1.358911,11.310046507720948,1.3840249999999998Q11.249376507720946,1.4091390000000001,11.194776507720947,1.445606Q11.140166507720947,1.482073,11.093726507720948,1.528492ZM11.565216507720947,2.9431950000000002L5.333333507720948,9.18254L5.333333507720948,10.66667L6.829506507720947,10.66667L13.057396507720947,4.436030000000001L11.565216507720947,2.9431950000000002Z" fill-rule="evenodd" fill="#8A9099" fill-opacity="1"/></g></g></svg>

After

Width:  |  Height:  |  Size: 3.9 KiB

1
src/assets/register/look-tem.svg

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="none" version="1.1" width="16" height="16" viewBox="0 0 16 16"><defs><clipPath id="master_svg0_127_38792"><rect x="0" y="0" width="16" height="16" rx="0"/></clipPath></defs><g clip-path="url(#master_svg0_127_38792)"><g><path d="M0.7990253730697632,7.6013Q0.7670073730697632,7.64421,0.7422483730697632,7.69168Q0.7174883730697632,7.73914,0.7006203730697632,7.78995Q0.6837533730697631,7.8407599999999995,0.6752093730697631,7.89361Q0.6666663730697632,7.94646,0.6666663730697632,8Q0.6666663730697632,8.05354,0.6752093730697631,8.106390000000001Q0.6837533730697631,8.15924,0.7006203730697632,8.210049999999999Q0.7174883730697632,8.260860000000001,0.7422483730697632,8.30832Q0.7670073730697632,8.355789999999999,0.7990253730697632,8.3987Q3.983753373069763,12.66667,8.000003373069763,12.66667Q12.016233373069763,12.66666,15.200933373069763,8.3987Q15.233033373069762,8.355789999999999,15.257733373069764,8.30832Q15.282533373069763,8.260860000000001,15.299333373069762,8.210049999999999Q15.316233373069764,8.15924,15.324833373069763,8.106390000000001Q15.333333373069763,8.05354,15.333333373069763,8Q15.333333373069763,7.94646,15.324833373069763,7.89361Q15.316233373069764,7.8407599999999995,15.299333373069762,7.78995Q15.282533373069763,7.73914,15.257733373069764,7.69168Q15.233033373069762,7.64421,15.200933373069763,7.6013Q12.016233373069763,3.333332,8.000003373069763,3.333333Q3.983743373069763,3.333333,0.7990253730697632,7.6013ZM2.1752443730697633,8Q4.836313373069763,11.33333,8.000003373069763,11.33333Q11.163683373069762,11.33333,13.824733373069764,8Q11.163683373069762,4.666666,8.000003373069763,4.666667Q4.836313373069763,4.666667,2.1752443730697633,8Z" fill-rule="evenodd" fill="#8A9099" fill-opacity="1"/></g><g><path d="M6.3500871922790525,6.350087092279053Q5.666666492279052,7.033507492279052,5.666666492279052,8.000003492279053Q5.666666492279052,8.966493492279053,6.350086992279053,9.649913492279053Q7.033507492279052,10.333333492279053,8.000003492279053,10.333333492279053Q8.966493492279053,10.333333492279053,9.649913492279053,9.649913492279053Q10.333333492279053,8.966493492279053,10.333333492279053,8.000003492279053Q10.333333492279053,7.033507492279052,9.649913492279053,6.350086992279053Q8.966493492279053,5.666666492279052,8.000003492279053,5.666666492279052Q7.033507492279052,5.666666492279052,6.3500871922790525,6.350087092279053ZM7.292896492279053,8.707103492279053Q7.000000492279053,8.414203492279054,7.000000492279053,8.000003492279053Q7.000000492279053,7.585793492279053,7.292896492279053,7.292896492279053Q7.585793492279053,7.000000492279053,8.000003492279053,7.000000492279053Q8.414203492279054,7.000000492279053,8.707103492279053,7.292896492279053Q9.000003492279053,7.585793492279053,9.000003492279053,8.000003492279053Q9.000003492279053,8.414203492279054,8.707103492279053,8.707103492279053Q8.414203492279054,9.000003492279053,8.000003492279053,9.000003492279053Q7.585793492279053,9.000003492279053,7.292896492279053,8.707103492279053Z" fill-rule="evenodd" fill="#8A9099" fill-opacity="1"/></g></g></svg>

After

Width:  |  Height:  |  Size: 3.0 KiB

BIN
src/assets/register/tem-img-normal.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 630 KiB

170
src/components/CustomDropdown.vue

@ -0,0 +1,170 @@
<template>
<div class="custom-select" :class="{ 'is-open': isOpen }">
<!-- 触发按钮 -->
<div class="select-trigger" @click="toggleDropdown">
<slot name="trigger">
{{ selectedItem ? selectedItem.label : placeholder }}
</slot>
<span class="arrow-icon">{{ isOpen ? "▲" : "▼" }}</span>
</div>
<!-- 自定义内容 -->
<!-- 下拉内容 -->
<transition name="slide-fade">
<div v-if="isOpen" class="select-dropdown">
<slot v-if="isOpen" name="normal"></slot>
<div v-for="(item, index) in options" :key="index" class="dropdown-item"
:class="{ 'is-selected': isSelected(item) }" @click="selectItem(item)">
<slot name="item" :item="item">
{{ item.label }}
</slot>
</div>
<!-- <slot v-if="isOpen" name="options_null"></slot> -->
<div class="flex-between dropdown-item" v-if="options_null" @click="selectNullItem">
<div class="left">
<p class="one">暂无收款账号</p>
<p>暂时没有收款账号我想稍后配置</p>
</div>
<div class="right">
<img src="../assets/register/drop-selected.svg" alt="">
</div>
</div>
</div>
</transition>
</div>
</template>
<script>
export default {
props: {
options: {
type: Array,
required: true,
default: () => [],
},
options_null: {
type: Object,
default: () => {},
},
placeholder: {
type: String,
default: "请选择",
},
value: {
type: [String, Number, Object],
default: null,
},
},
data() {
return {
isOpen: false,
selectedItem: null,
};
},
watch: {
value: {
immediate: true,
handler(newVal) {
this.selectedItem = this.options.find((item) => item.value === newVal);
},
},
},
methods: {
toggleDropdown() {
this.isOpen = !this.isOpen;
},
selectItem(item) {
this.selectedItem = item;
this.$emit("input", item.value); // v-model
this.$emit("change", item); // change
this.isOpen = false;
},
isSelected(item) {
return this.selectedItem && this.selectedItem.value === item.value;
},
selectNullItem(){
// this.$emit("input", null); // v-model
this.$emit("changeNormal", ''); // change
this.isOpen = false;
}
},
};
</script>
<style scoped>
.custom-select {
height: 38px;
position: relative;
font-family: Arial, sans-serif;
}
.select-trigger {
border-radius: 2px;
opacity: 1;
background: #FFFFFF;
border: 1px solid #DFE2E6;
width: calc(100% - 24px);
padding: 10px 12px;
cursor: pointer;
display: flex;
justify-content: space-between;
align-items: center;
}
.is-open .select-trigger {
border: 1px solid #006AFF;
transition: all .5s;
}
.select-trigger:hover {
border-color: #006AFF;
transition: all .5s;
}
.arrow-icon {
font-size: 12px;
}
.select-dropdown {
position: absolute;
top: 100%;
left: 0;
width: calc(100% - 24px);
border: 1px solid #ccc;
border-radius: 4px;
background-color: #fff;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
z-index: 1000;
margin-top: 4px;
max-height: 384px;
overflow-y: auto;
padding: 0 12px 12px 12px;
}
.dropdown-item {
padding: 12px 10px;
cursor: pointer;
}
.dropdown-item:hover {
background: #F6F7FA;
}
.dropdown-item.is-selected {
background-color: transparent;
color: #fff;
}
/* 展开收起动画 */
.slide-fade-enter-active,
.slide-fade-leave-active {
transition: all 0.3s ease;
}
.slide-fade-enter-from,
.slide-fade-leave-to {
opacity: 0;
transform: translateY(-10px);
}
</style>

2
src/main.js

@ -3,12 +3,14 @@ import router from './router'
import store from './store'
import App from './App.vue'
import ElementUI from 'element-ui';
import request from "./utils/request";
import 'element-ui/lib/theme-chalk/index.css';
import './style/theme/index.css'
import './style/theme/common.scss'
import 'core-js/stable';
import 'regenerator-runtime/runtime';
Vue.config.productionTip = false
Vue.prototype.$http = request;
Vue.use(ElementUI);
new Vue({
router,

7
src/store/index.js

@ -10,6 +10,7 @@ export default new Vuex.Store({
showHeader:false,
menuList:[],//目录菜单
showBreadcrumb:false,//是否展示面包屑
pageTitle:'一般新文献'//页面标题
},
actions: {
SET_HEADER({ commit }) {
@ -24,6 +25,9 @@ export default new Vuex.Store({
SHOW_BREAD({ commit }) {
commit('SHOW_BREAD');
},
SET_PAGETITLE({ commit }) {
commit('SET_PAGETITLE');
},
},
mutations: {
SET_SIDEBAR(state, show) {
@ -37,6 +41,9 @@ export default new Vuex.Store({
},
SHOW_BREAD(state, show) {
state.showBreadcrumb = show;
},
SET_PAGETITLE(state, title) {
state.pageTitle = title;
}
},
getters: {

384
src/style/theme/common.scss

@ -1,89 +1,104 @@
body{
body {
font-family: Microsoft YaHei UI;
font-size: 14px;
margin: 0;
width: 100vw;
height: 100vh;
p{
p {
margin: 0;
padding: 0;
}
}
.el-container{
}
.el-container {
height: 100%;
.el-main{
.el-main {
padding: 0;
}
}
.min-width{
}
.min-width {
min-width: 1200px;
}
}
// 公共类名
.mb24{
.mb24 {
margin-bottom: 24px;
}
// 多数左右布局中间带竖线
.min-flex{
.min-flex {
min-width: 1100px;
max-width: 1556px;
width: 84.75%;
margin: 0 auto;
}
.desc{
.desc {
font-size: 12px;
font-weight: normal;
line-height: 13px;
letter-spacing: 0.08em;
font-variation-settings: "opsz" auto;
font-variation-settings: "opsz"auto;
/* text/text_4 */
color: #8A9099;
}
.flex-common{
.flex-common {
padding: 32px 36px;
background-color: #fff;
h3{
h3 {
text-align: left;
margin: 0 0 32px 0;
}
.flex-wrap{
.flex-wrap {
width: 100%;
display: flex;
justify-content: space-between;
}
.flex-line{
.flex-line {
border-left: 1px solid #DFE2E6;
margin: 0 54px;
}
.flex-left,.flex-right{
.flex-left,
.flex-right {
min-width: 460px;
max-width: 590px;
flex: 1;
}
}
// end---------
//radio 发生change事件时会有报错
::v-deep .el-radio__original {
::v-deep .el-radio__original {
display: none !important;
}
::v-deep.el-radio:focus:not(.is-focus):not(:active):not(.is-disabled){
.el-radio__inner {
box-shadow: none !important;
}
::v-deep.el-radio:focus:not(.is-focus):not(:active):not(.is-disabled) {
.el-radio__inner {
box-shadow: none !important;
}
}
::v-deep .el-popover {
}
::v-deep .el-popover {
display: none !important;
}
::v-deep.el-popover:focus:not(.is-focus):not(:active):not(.is-disabled){}
}
::v-deep.el-popover:focus:not(.is-focus):not(:active):not(.is-disabled) {}
// .el-radio__inner {
// box-shadow: none !important;
// }
/* button==== start */
.el-button{
.el-button {
width: 144px;
height: 46px;
font-family: Microsoft YaHei UI;
@ -94,174 +109,224 @@ body{
justify-content: center;
transition: all .3s;
}
.el-button--normal{
.el-button--normal {
color: #626573;
}
.el-button--mild{
.el-button--mild {
background: #FFFFFF;
border: 1px solid #006AFF;
color: #006AFF;
}
.el-button--primary,.el-button--success,.el-button--info,.el-button--warning,.el-button--danger{
.el-button--primary,
.el-button--success,
.el-button--info,
.el-button--warning,
.el-button--danger {
color: #fff !important;
}
.el-button--medium{//中等按钮
.el-button--medium {
//中等按钮
width: 97px;
height: 33px;
font-size: 14px;
line-height: 14px;
span{
span {
height: 14px;
}
}
.el-button--small{//小的按钮
.el-button--small {
//小的按钮
width: 80px;
height: 32px;
font-size: 12px;
}
.el-button--mini{ //迷你按钮
.el-button--mini {
//迷你按钮
width: 80px;
height: 28px;
font-size: 12px;
}
.el-button--reverseMild{
.el-button--reverseMild {
background: #E8F0FE;
color: #006AFF;
border: none;
}
.el-button--reverseMild:hover{
.el-button--reverseMild:hover {
border-color: #F2F7FF !important;
background-color:#F2F7FF !important;
background-color: #F2F7FF !important;
}
.el-button--reverseMild.is-disabled, .el-button--reverseMild.is-disabled:hover{
.el-button--reverseMild.is-disabled,
.el-button--reverseMild.is-disabled:hover {
color: #006AFF;
border-color: #E8F0FE;
background-color:#E8F0FE;
background-color: #E8F0FE;
opacity: .7;
}
.el-button--mild.is-disabled, .el-button--mild.is-disabled:hover{
.el-button--mild.is-disabled,
.el-button--mild.is-disabled:hover {
color: #006AFF;
opacity: .7;
border-color: #006AFF;
}
/* button==== end */
// radio ---start
.el-radio__input.is-checked .el-radio__inner::after {
content: ''; /* 清空默认的伪元素内容 */
content: '';
/* 清空默认的伪元素内容 */
width: 14px;
height: 14px;
background-image: url('../../assets/radio_checked.svg'); /* 使用你的自定义图标 */
background-image: url('../../assets/radio_checked.svg');
/* 使用你的自定义图标 */
background-size: contain;
background-repeat: no-repeat;
}
.el-radio__label{
}
.el-radio__label {
font-weight: normal;
}
}
// radio ---end
// input ---start
.el-input{
.el-input {
border-radius: 2px;
border: 1px solid transparent;
}
.el-input:focus-within{
.el-input:focus-within {
transition: all .5s;
outline: 3px solid #D8E9FA;
border-color: #006AFF !important;
}
.is-error .hoverclass{
.is-error .hoverclass {
border-color: transparent !important;
}
.is-error .el-input:focus-within{
.is-error .el-input:focus-within {
outline: none !important;
border-color: transparent !important;
}
.el-input__inner{
.el-input__inner {
height: 100%;
padding: 10px 12px;
border-radius: 4px;
}
.el-input__prefix{
.el-input__prefix {
display: flex;
align-items: center;
left: 12px;
cursor: pointer;
}
.el-input__suffix{
.el-input__suffix {
display: flex;
align-items: center;
right: 12px;
cursor: pointer;
}
.el-input__inner:focus{
.el-input__inner:focus {
border-color: transparent;
}
.el-input__inner:hover{
.el-input__inner:hover {
border-color: transparent;
}
.el-input__inner::placeholder{
.el-input__inner::placeholder {
color: #BABDC2;
}
.el-input--prefix .el-input__inner{
.el-input--prefix .el-input__inner {
padding-left: 36px;
}
.el-input--suffix .el-input__inner{
.el-input--suffix .el-input__inner {
padding-right: 36px;
}
.el-input.is-disabled .el-input__inner{
.el-input.is-disabled .el-input__inner {
background: #F6F7FA !important;
border-color: #DFE2E6 !important;
color: #BABDC2 !important;
}
.hoverclass{
.hoverclass {
border-color: #006AFF !important;
transition: all .5s;
}
// input ---end
// select start
.el-select{
.el-select {
width: 100%;
transition: all .5s;
}
.el-select:hover .el-input__inner{
.el-select:hover .el-input__inner {
transition: all .5s;
border-color: transparent;
}
.el-select .el-input.is-focus .el-input__inner{
.el-select .el-input.is-focus .el-input__inner {
border-color: transparent;
transition: all .5s;
}
.el-select .el-input__inner:focus{
.el-select .el-input__inner:focus {
border-color: transparent;
}
.el-select>.el-input{
.el-select>.el-input {
height: 100%;
}
// select end
// textarea start
.el-textarea__inner{
.el-textarea__inner {
padding: 10px 12px;
border-radius: 2px;
}
.el-textarea__inner:hover{
.el-textarea__inner:hover {
border-color: #006AFF;
}
.el-textarea__inner:focus{
.el-textarea__inner:focus {
transition: all .5s;
outline: 3px solid #D8E9FA;
}
// textarea end
.el-form-item.is-required:not(.is-no-asterisk) .el-form-item__label-wrap>.el-form-item__label:before, .el-form-item.is-required:not(.is-no-asterisk)>.el-form-item__label:before{
.el-form-item.is-required:not(.is-no-asterisk) .el-form-item__label-wrap>.el-form-item__label:before,
.el-form-item.is-required:not(.is-no-asterisk)>.el-form-item__label:before {
content: '';
}
.el-form-item.is-required:not(.is-no-asterisk) .el-form-item__label-wrap>.el-form-item__label::after, .el-form-item.is-required:not(.is-no-asterisk)>.el-form-item__label::after{
.el-form-item.is-required:not(.is-no-asterisk) .el-form-item__label-wrap>.el-form-item__label::after,
.el-form-item.is-required:not(.is-no-asterisk)>.el-form-item__label::after {
content: url(../../assets/require.svg);
display: inline-block;
// background-image: url(../../assets/require.svg);
@ -270,142 +335,173 @@ body{
margin-left: 4px;
}
.form-item1{
.form-item1 {
display: flex;
align-items: center;
label{
label {
min-width: 54px;
margin-right: 8px;
}
label.el-radio{
label.el-radio {
margin-right: 24px;
.el-radio__label{
.el-radio__label {
padding-left: 8px;
}
}
.form-item-top{
label.el-radio:last-child {
margin-right: 0px;
}
.form-item-top {
height: 18px;
display: flex;
align-items: center;
text-align: left;
}
.form-item-bottom{
.form-item-bottom {
flex: 1;
}
.rightdesc{
.rightdesc {
flex: 1;
text-align: right;
font-size: 12px;
line-height: 13px;
letter-spacing: 0.08em;
font-variation-settings: "opsz" auto;
font-variation-settings: "opsz"auto;
color: #8A9099;
}
.form-item{
.form-item {
margin-bottom: 0;
}
}
.el-form-item__content{
.el-form-item__content {
// width: 100%;
flex: 1;
position: relative;
.desc_right{
position: absolute;
right: 0;
top: -40px;
margin: 0;
font-size: 12px;
line-height: 40px;
letter-spacing: 0.08em;
font-variation-settings: "opsz" auto;
color: #8A9099;
.desc_right {
position: absolute;
right: 0;
top: -40px;
margin: 0;
font-size: 12px;
line-height: 40px;
letter-spacing: 0.08em;
font-variation-settings: "opsz"auto;
color: #8A9099;
}
}
.w510{
}
.w510 {
width: 510px;
}
.w388{
.w388 {
width: 388px;
}
.form-item{
.form-item {
display: flex;
align-items: center;
}
.column{
.column {
display: flex;
flex-direction: column !important;
align-items: self-start;
.form-item-top{
.form-item-top {
width: 100%;
margin-bottom: 12px;
justify-content: space-between;
}
.form-item-bottom{
.form-item-bottom {
width: 100%;
}
.el-form-item__content{
.el-form-item__content {
width: 100%;
display: flex;
justify-content: flex-start;
}
}
.form-top-icon{
.form-top-icon {
display: flex;
align-items: center;
img{
img {
width: 16px;
height: 16px;
margin-right: 8px;
}
span{
span {
color: #1E2226;
}
}
// table start
.el-table--enable-row-hover .el-table__body tr:hover>td.el-table__cell{
.el-table--enable-row-hover .el-table__body tr:hover>td.el-table__cell {
background-color: #F6F7FA;
}
.el-table td.el-table__cell{
.el-table td.el-table__cell {
border-bottom: 1px solid#EAECF0;
}
.el-table--fit{
.el-table--fit {
border: 1px solid#EAECF0;
}
.el-button--text{
.el-button--text {
padding: 0;
width: auto !important;
height: auto !important;
}
.el-table th.el-table__cell{
.el-table th.el-table__cell {
background: #F6F7FA;
padding: 18px 0;
}
.el-table th.el-table__cell>.cell{
.el-table th.el-table__cell>.cell {
padding-left: 16px;
padding-right: 16px;
}
.el-table .el-table__cell{
.el-table .el-table__cell {
padding: 18px 0;
}
.el-table .cell{
.el-table .cell {
padding-left: 16px;
padding-right: 16px;
}
.el-table .el-form-item{
.el-table .el-form-item {
margin-bottom: 0;
}
// table end
.el-pagination{
.el-pagination {
margin-top: 16px;
display: flex;
justify-content: flex-end;
}
// dialog--start
.el-dialog{
.el-dialog {
min-height: 344px;
max-height: 550px;
border-radius: 4px;
@ -413,7 +509,8 @@ body{
box-shadow: 0px 4px 16px 0px rgba(0, 0, 0, 0.16);
display: flex;
flex-direction: column;
.el-dialog__header{
.el-dialog__header {
font-size: 20px;
font-weight: bold;
line-height: 26px;
@ -421,24 +518,29 @@ body{
color: #1F2026;
padding: 32px 32px 12px;
}
.el-dialog__body{
.el-dialog__body {
padding: 0 32px 32px;
flex: 1;
}
}
.el-dialog__footer{
.el-dialog__footer {
display: flex;
justify-content: center;
padding: 0 32px 32px !important;
.dialog-footer{
.dialog-footer {
width: 100%;
justify-content: space-between;
}
button{
button {
width: 247px;
height: 44px;
}
}
// dialog--end
// switch --start
@ -451,14 +553,50 @@ body{
// switch --end
// 弹出气泡框
.el-popover{
.el-popover {
padding: 32px;
}
// 日历区间背景颜色
.el-date-table td.in-range div{
.el-date-table td.in-range div {
background: #F2F7FF;
}
.flex{
.flex {
display: flex;
align-items: center;
}
// 自定义下拉内容框
.noraml-jump {
padding: 24px 10px;
border-bottom: 1px solid #EAECF0;
}
.flex-between {
display: flex;
justify-content: space-between;
align-items: center;
font-family: Microsoft YaHei UI;
.left b {
display: block;
text-align: left;
margin-bottom: 12px;
}
.left p {
letter-spacing: 0.08em;
text-align: left;
line-height: 13px;
font-size: 12px;
color: #8A9099;
}
.left .one {
line-height: 18px;
font-size: 14px;
color: #1E2226;
margin-bottom: 4px;
}
}

90
src/utils/request.js

@ -0,0 +1,90 @@
// src/utils/request.js
import axios from "axios";
// 创建 axios 实例
const service = axios.create({
baseURL: process.env.VUE_APP_BASE_API, // 从环境变量中读取 API 基础地址
timeout: 10000, // 请求超时时间
});
// 请求拦截器
service.interceptors.request.use(
(config) => {
// 在发送请求之前做一些处理,例如添加 token
const token = localStorage.getItem("token");
if (token) {
config.headers["Authorization"] = `Bearer ${token}`;
}
return config;
},
(error) => {
// 对请求错误做些什么
return Promise.reject(error);
}
);
// 响应拦截器
service.interceptors.response.use(
(response) => {
// 对响应数据做一些处理
const res = response.data;
if (res.code !== 200) {
// 如果返回的 code 不是 200,则视为错误
return Promise.reject(new Error(res.message || "请求失败"));
}
return res;
},
(error) => {
// 对响应错误做些什么
if (error.response) {
switch (error.response.status) {
case 401:
// 未授权,跳转到登录页
window.location.href = "/login";
break;
case 404:
// 资源未找到
console.error("资源未找到");
break;
case 500:
// 服务器错误
console.error("服务器错误");
break;
default:
console.error("请求失败", error.message);
}
}
return Promise.reject(error);
}
);
/**
* 封装请求方法
* @param {string} method 请求方法 (GET, POST, PUT, DELETE )
* @param {string} url 请求地址
* @param {object} data 请求参数
* @param {object} config 其他 axios 配置
* @returns {Promise} 返回请求结果
*/
const request = (method, url, data = {}, config = {}) => {
const lowerCaseMethod = method.toLowerCase();
if (lowerCaseMethod === "get") {
// GET 请求将参数拼接到 URL 上
return service({
method: "get",
url,
params: data,
...config,
});
} else {
// 其他请求(POST, PUT, DELETE 等)将参数放在请求体中
return service({
method: lowerCaseMethod,
url,
data,
...config,
});
}
};
export default request;

62
src/views/Personalization.vue

@ -0,0 +1,62 @@
<template>
<div class="domain-wrap">
<p>设置自己的域名需要做 2 步站外操作如果暂时未准备好或打算稍后设置可以先选用平台免费域名平台随时支持域名修改 </p>
<div class="domain-box">
<div class="domain-item">
<p>1.&emsp;域名必须在阿里云完成 ICP 备案</p>
<p>备案网址https://beian.aliyun.com</p>
</div>
<div class="domain-item">
<p>2.&emsp;域名要解析到平台服务器上</p>
<p>备案网址https://beian.aliyun.com</p>
</div>
<div class="domain-item">
<p>3.&emsp;域名填写</p>
<el-input placeholder="填写完整域名" />
</div>
</div>
</div>
</template>
<script>
// import GuipInput from '@/components/GuipInput.vue';
export default {
name: '',
props: [''],
components: {
// GuipInput,
},
data() {
return {
}
},
methods: {
onSwitchChange(data) {
console.log(data, '---');
}
}
}
</script>
<style lang="scss">
.domain-wrap {
.domain-item{
margin-bottom: 10px;
}
.domain-item p:last-child{
padding-left: 23px;
color: #8A9099;
}
p{
text-align: left;
line-height: 18px;
margin-bottom: 8px;
}
.domain-box {
display: flex;
flex-direction: column;
justify-content: flex-start;
}
}
</style>

511
src/views/Register.vue

@ -10,59 +10,51 @@
<img src="@/assets/register/register-top-close.svg" alt="">
</div>
</div>
<!-- 步骤条 -->
<el-steps :active="activeStep" finish-status="success">
<el-step title="步骤 1">
<template #icon>
<img src="@/assets/register/step1_ing.svg" alt="icon1" class="custom-icon" />
<!-- <img src="@/assets/register/step_success.svg" alt="icon1" class="custom-icon" /> -->
</template>
<div>
<span>基础信息</span>
<span>填写站点信息选择模板样式</span>
</div>
</el-step>
<el-step title="步骤 2">
<template #icon>
<!-- <img src="@/assets/register/step2_ing.svg" alt="icon1" class="custom-icon" /> -->
<img src="@/assets/register/step2_null.svg" alt="icon2" class="custom-icon" />
<!-- <img src="@/assets/register/step_success.svg" alt="icon1" class="custom-icon" /> -->
</template>
<div>
<span>基础信息</span>
<span>填写站点信息选择模板样式</span>
<div class="sticky">
<div style="width: 100%;background: #fff;">
<div class="step-wrap min-flex">
<div :class="['step-item', activeStep == 1 ? 'checked' : 'success']">
<img v-if="activeStep == 1" src="@/assets/register/step1_ing.svg" alt="" class="custom-icon">
<img v-if="activeStep > 1" src="@/assets/register/step_success.svg" alt="" class="custom-icon">
<span>基础信息</span>
</div>
<div :class="['step-line', activeStep > 1 ? 'step_active-line' : '']"></div>
<div :class="['step-item', activeStep == 2 ? 'checked' : activeStep > 2 ? 'success' : '']">
<img v-if="activeStep == 1" src="@/assets/register/step2_null.svg" alt="" class="custom-icon">
<img v-if="activeStep == 2" src="@/assets/register/step2_ing.svg" alt="" class="custom-icon">
<img v-if="activeStep > 2" src="@/assets/register/step_success.svg" alt="" class="custom-icon">
<span>收款方式</span>
</div>
<div :class="['step-line', activeStep > 2 ? 'step_active-line' : '']"></div>
<div :class="['step-item', activeStep == 3 ? 'checked' : activeStep > 2 ? 'success' : '']">
<img v-if="activeStep != 3" src="@/assets/register/step3_null.svg" alt="" class="custom-icon">
<img v-if="activeStep == 3" src="@/assets/register/step3_ing.svg" alt="" class="custom-icon">
<!-- <img v-if="activeStep >2" src="@/assets/register/step_success.svg" alt=""> -->
<span>添加服务</span>
</div>
</div>
</el-step>
<el-step title="步骤 3">
<template #icon>
<!-- <img src="@/assets/register/step3_ing.svg" alt="icon1" class="custom-icon" /> -->
<img src="@/assets/register/step3_null.svg" alt="icon3" class="custom-icon" />
<!-- <img src="@/assets/register/step_success.svg" alt="icon1" class="custom-icon" /> -->
</template>
<div>
<span>基础信息</span>
<span>填写站点信息选择模板样式</span>
</div>
<div style="width: 100%;background: #fff;">
<div class="step-desc min-flex">
<span> {{ renderStepDesc('1') }}</span>
<span>{{ renderStepDesc('2') }}</span>
<span>{{ renderStepDesc('3') }}</span>
</div>
</el-step>
</el-steps>
<el-steps :active="activeStep" finish-status="success">
</div>
</div>
<!-- 步骤条 -->
<!-- <el-steps :active="activeStep" finish-status="success">
<el-step v-for="(step, index) in steps" :key="index" :status="getStepStatus(index)">
<!-- 自定义图标插槽 -->
<template #icon>
<div class="custom-icon">
<!-- 填写完毕状态 -->
<img v-if="isStepFinished(index)" src="@/assets/register/step1_ing.svg" alt="checked"
<img v-if="isStepFinished(index)" :src="step.finish" alt="checked"
style="width: 24px; height: 24px" />
<!-- 填写中状态 -->
<img v-else-if="isStepActive(index)" :src="step.checked" alt="editing" style="width: 24px; height: 24px" />
<!-- 未填写状态 -->
<img v-else :src="step.wait" alt="waiting" style="width: 24px; height: 24px" />
</div>
</template>
<!-- 自定义文案插槽 -->
<template #title>
<template #title>
<div class="step-title">
<span>{{ step.title }}</span>
<div class="step-status">
@ -70,8 +62,8 @@
</div>
</div>
</template>
</el-step>
</el-steps>
</el-step>
</el-steps> -->
<p class="pageDesc min-flex">搭建售卖渠道</p>
@ -119,13 +111,30 @@
</div>
<div class="step1-top2 flex-common">
<h3>模板选择</h3>
<el-form :model="form1" ref="formRef">
<div class="flex-wrap">
<div class="flex-left">
<div class="flex-wrap">
<div class="flex-left">
<div class="tem-home">
<img class="tem-home-top" src="@/assets/register/tem-img-normal.png" alt="">
<div class="tem-home-bottom">
<b>经典深蓝模板默认</b>
<div>
<div class="tem-look" @click="lookTemImg">
<img src="@/assets/register/look-tem.svg" alt="">
预览
</div>
<div @click="editTemImg">
<img src="@/assets/register/edit-tem.svg" alt="">
修改
</div>
</div>
</div>
</div>
</div>
</el-form>
<div class="flex-line"></div>
<div class="flex-right">
</div>
</div>
</div>
</div>
<!-- 电商渠道 -->
@ -161,8 +170,41 @@
</div>
<div slot="formRight" class="desc">可选择已有店铺或授权新店铺
</div>
<div slot="formDom" class="first_register">
<div slot="formDom">
<CustomDropdown v-model="selectedValue1" :options="options1" @change="changeSelect" placeholder="请选择">
<!-- 自定义触发按钮 -->
<template #trigger>
<span v-if="selectedItem" style="color: #1E2226;font-family: Microsoft YaHei UI;">{{
selectedItem.desc }}</span>
<span v-else>请选择</span>
</template>
<template #normal>
<div class="flex flex-between noraml-jump">
<div class="left">
<b>授权新店铺</b>
<p class="one">请确保使用要添加的淘宝主账号登录并授权</p>
<p>如未购买"快乐帮手"服务或已过期会跳转到购买服务页面</p>
</div>
<div class="right">
<GuipButton type="primary" size="medium">点击授权</GuipButton>
</div>
</div>
</template>
<!-- 自定义下拉选项 -->
<template #item="{ item }">
<div class="flex-between">
<div class="left">
<p class="one">{{ item.label }}</p>
<p>{{ item.desc }}</p>
</div>
<div class="right">
<img v-if="selectedItem.value == item.value" src="../assets/register/drop-selected.svg"
alt="">
</div>
</div>
</template>
</CustomDropdown>
</div>
</GuipFormItem>
</div>
@ -182,8 +224,55 @@
<div slot="formLeft" class="form-top-icon">
<img src="@/assets/register/weixin.svg" style="width: 26px;height: 26px;" alt=""><span>微信收款</span>
</div>
<GuipSelect slot="formDom" v-model="form3.weixin_pay" prop="weixin_pay" :options="options_weixin"
placeholder="未绑定微信收款" />
<!-- <GuipSelect slot="formDom" v-model="form3.weixin_pay" prop="weixin_pay" :options="options_weixin"
placeholder="未绑定微信收款" /> -->
<CustomDropdown slot="formDom" v-model="form3.weixin_pay" :options="options_weixin"
@change="changeSelectWeixin" placeholder="请选择" :options_null="options_weixin_null"
@changeNormal="changeNormalWeixin">
<!-- 自定义触发按钮 -->
<template #trigger>
<span v-if="selectedItemWeixin" style="color: #1E2226;font-family: Microsoft YaHei UI;">{{
select_placeholder_weixin ? select_placeholder_weixin :
selectedItemWeixin.desc }}</span>
<span v-else>请选择</span>
</template>
<template #normal>
<div class="flex flex-between noraml-jump">
<div class="left">
<b>绑定新微信收款</b>
<p class="one">需要使用您公司的微信支付</p>
<p>需在微信商户平台-产品中心开通Native支付</p>
</div>
<div class="right">
<GuipButton type="primary" size="medium">前往绑定</GuipButton>
</div>
</div>
</template>
<!-- 自定义下拉选项 -->
<template #item="{ item }">
<div class="flex-between">
<div class="left">
<p class="one">{{ item.label }}</p>
<p>{{ item.desc }}</p>
</div>
<div class="right">
<img v-if="selectedItem.value == item.value" src="../assets/register/drop-selected.svg" alt="">
</div>
</div>
</template>
<!-- <template #options_null>
<div class="flex-between dropdown-item" >
<div class="left">
<p class="one">暂无收款账号</p>
<p>暂时没有收款账号我想稍后配置</p>
</div>
<div class="right">
<img src="../assets/register/drop-selected.svg" alt="">
</div>
</div>
</template> -->
</CustomDropdown>
</GuipFormItem>
</div>
<div class="flex-line"></div>
@ -194,6 +283,39 @@
</div>
<GuipSelect slot="formDom" v-model="form3.zhifubao_pay" prop="zhifubao_pay" :options="options_zhifubao"
placeholder="未绑定支付宝收款" />
<!-- <CustomDropdown slot="formDom" v-model="form3.weixin_pay" :options="options_weixin"
@change="changeSelectWeixin" placeholder="请选择" :options_null="options_weixin_null"
@changeNormal="changeNormalWeixin">
<template #trigger>
<span v-if="selectedItemWeixin" style="color: #1E2226;font-family: Microsoft YaHei UI;">{{
select_placeholder_weixin ? select_placeholder_weixin :
selectedItemWeixin.desc }}</span>
<span v-else>请选择</span>
</template>
<template #normal>
<div class="flex flex-between noraml-jump">
<div class="left">
<b>绑定新微信收款</b>
<p class="one">需要使用您公司的微信支付</p>
<p>需在微信商户平台-产品中心开通Native支付</p>
</div>
<div class="right">
<GuipButton type="primary" size="medium">前往绑定</GuipButton>
</div>
</div>
</template>
<template #item="{ item }">
<div class="flex-between">
<div class="left">
<p class="one">{{ item.label }}</p>
<p>{{ item.desc }}</p>
</div>
<div class="right">
<img v-if="selectedItem.value == item.value" src="../assets/register/drop-selected.svg" alt="">
</div>
</div>
</template>
</CustomDropdown> -->
</GuipFormItem>
</div>
</div>
@ -299,8 +421,9 @@
<el-table-column prop="stock" label="收款方式" width="195">
<template slot-scope="scope">
<div class="flex cell_render" @click="popPayMentModal(scope.row)">
<span :class="(scope.row.payment == '0' ? 'normal_payment' : 'self_payment')">{{ scope.row.payment ==
'0' ? '默认站点支付' :'自定义支付' }}</span>
<span :class="(scope.row.payment == '0' ? 'normal_payment' : 'self_payment')">{{ scope.row.payment
==
'0' ? '默认站点支付' : '自定义支付' }}</span>
<img class="edit_icon" src="@/assets/register/tableEdit.svg" alt="">
</div>
</template>
@ -336,14 +459,29 @@
<PaymentMethod :paymentList="paymentList" />
</GuipDialog>
<GuipDialog :dialogVisible="dialogVisible1" title="温馨提示" :show-close-button="false"
:show-cancel-button="showCancelButton" cancelText="先用平台免费域名" confirmText="准备完毕,验证自有域名" @confirm="handleConfirm" @cancel="handleCancel" @close="handleClose"
@dialogVisibleChange="dialogVisibleChange">
<DomainModal/>
:show-cancel-button="showCancelButton" cancelText="先用平台免费域名" confirmText="准备完毕,验证自有域名" @confirm="handleConfirm"
@cancel="handleCancel" @close="handleClose1" @dialogVisibleChange="dialogVisibleChange">
<DomainModal />
</GuipDialog>
<el-dialog :visible.sync="dialogVisibleAdd" width="30%" :before-close="handleCloseAdd">
<div class="top">
<b>添加查重服务</b>
<ul>
<li v-for="item in addlist" :key="item.name">
<img src="" alt="">
{{ item.name }}
</li>
</ul>
</div>
<div class="bottom">
</div>
</el-dialog>
<Footer></Footer>
<div class="register-btns">
<GuipButton type="mild">跳过</GuipButton>
<GuipButton type="primary">完成</GuipButton>
<GuipButton type="mild" @click="jumpCurStep">跳过</GuipButton>
<GuipButton type="primary" @click="finishCurStep">完成</GuipButton>
</div>
</div>
</template>
@ -358,6 +496,7 @@ import GuipSwitch from '@/components/GuipSwitch.vue';
import GuipDialog from '@/components/GuipDialog.vue';
import PaymentMethod from '@/components/paymentMethod.vue';
import DomainModal from '@/components/domainModal.vue';
import CustomDropdown from '@/components/CustomDropdown.vue';
// import GuipTable from '@/components/GuipTable.vue';
export default {
@ -371,13 +510,79 @@ export default {
GuipSwitch,
GuipDialog,
PaymentMethod,
DomainModal
DomainModal,
CustomDropdown
// GuipTable
},
data() {
return {
dialogTitle:'编辑',
dialogVisible1:false,
addlist:[
{
name:'万方',
desc:'提供中英文文献相似性检测服务。自主研发的“句子级正交软聚类倒排语义” 算法,海量数据全文对比,5分钟快速出报告。',
list:[
{
name:'一般新文献',
desc:'适用于所有未正式发表的文献类型。',
price:'2.4',
word:'1000字符'
},
{
name:'本科论文',
desc:'适用于在校大学生毕业论文。',
price:'2.4',
word:'1000字符'
},
{
name:'说博士论文',
desc:'适用于应届高校硕博士研究生论文检测。',
price:'2.4',
word:'1000字符'
},
{
name:'高职高专',
desc:'适用于高等职业学院和高等专科学校论文检测。',
price:'2.4',
word:'1000字符'
},
{
name:'一般新文献',
desc:'适用于所有未正式发表的文献类型。',
price:'2.4',
word:'1000字符'
},
]
},
{
name:'维普',
desc:'',
list:[
{
}
]
},
{
name:'学术不端',
desc:'',
list:[
{
}
]
},
],
dialogVisibleAdd:false,
selectedItemWeixin: {},//
selectedItem: {},//
selectedValue1: null,//
options1: [//
{ label: "博闻教育专营店", time: "有效期至2025-06-13 05:00:00", desc: "博闻教育专营店 有效期至2025-06-13 05:00:00", value: 1 },
{ label: "这是一个店", time: "有效期至2025-06-13 05:00:00", desc: "这是一个店 有效期至2025-06-13 05:00:00", value: 2 },
{ label: "ewqewq地方", time: "有效期至2025-06-13 05:00:00", desc: "ewqewq地方 有效期至2025-06-13 05:00:00", value: 3 },
],
dialogTitle: '编辑',
dialogVisible1: false,
paymentList: [
{
type: '1',
@ -433,10 +638,15 @@ export default {
{ label: '淘宝', value: '淘宝', selectedLabel: "淘宝" },
],
steps: [
{ title: "步骤 1", 'desc': '', 'wait': '@/assets/register/step1_ing.svg', 'checked': '@/assets/register/step1_ing.svg', 'finish': '@/assets/register/step_success.svg' },
{ title: "步骤 2", 'desc': '', 'wait': '@/assets/register/step2_null.svg', 'checked': '@/assets/register/step2_ing.svg', 'finish': '@/assets/register/step_success.svg' },
{ title: "步骤 3", 'desc': '', 'wait': '@/assets/register/step3_null.svg', 'checked': '@/assets/register/step3_ing.svg', 'finish': '@/assets/register/step_success.svg' }
{ title: "步骤 1", 'desc': '', 'wait': '../assets/register/step1_ing.svg', 'checked': '../assets/register/step1_ing.svg', 'finish': '../assets/register/step_success.svg' },
{ title: "步骤 2", 'desc': '', 'wait': '../assets/register/step2_null.svg', 'checked': '../assets/register/step2_ing.svg', 'finish': '../assets/register/step_success.svg' },
{ title: "步骤 3", 'desc': '', 'wait': '../assets/register/step3_null.svg', 'checked': '../assets/register/step3_ing.svg', 'finish': '../assets/register/step_success.svg' }
],
stepDesc: {
'1': '填写站点信息、选择模板样式',
'2': '配置收款方式',
'3': '想卖哪些东西?来选选吧',
},
tableData1: [
{ id: 1, name: '万方大学生版', stock: 100, price: 50, price_popover: false, edit_price: '', type: 'a', num: '1', edit_num: '', num_popover: false, homeFlag: true, payment: '0' },
{ id: 2, name: '维普检测版', stock: 200, price: 80, word: 1000, price_popover: false, edit_price: '', editWord: '', type: 'a', num: '2', edit_num: '', num_popover: false, homeFlag: true, payment: '1' },
@ -488,15 +698,24 @@ export default {
zhifubao_pay: '',
weixin_pay: '',
},
options_weixin_null: {
label: '暂无收款账号',
value: '暂时没有收款账号,我想稍后配置',
desc: '暂无收款账号,稍后配置'
},
select_placeholder_weixin: '暂无收款账号,稍后配置',
options_weixin: [],
options_zhifubao: [],
};
},
methods: {
showDomainModal(){
this.dialogVisible1 = true
showDomainModal() {
this.dialogVisibleAdd = true;
},
yumingInput(){
handleCloseAdd(){
this.dialogVisibleAdd = false;
},
yumingInput() {
this.dialogVisible1 = true;
},
//
@ -514,6 +733,10 @@ export default {
this.$message.info('弹框已关闭');
this.dialogVisible = false;
},
handleClose1() {
this.$message.info('弹框已关闭111');
this.dialogVisible1 = false;
},
dialogVisibleChange(data) {
console.log(data, 'data098908090');
},
@ -637,11 +860,52 @@ export default {
return "未开始";
}
},
renderStepDesc(step) {
return this.stepDesc[step]
},
popPayMentModal(row) {
this.dialogVisible = true;
this.dialogTitle = row.name + '-收款方式'
console.log(row, '=====');
},
lookTemImg() {
},
editTemImg() {
},
jumpCurStep() {
if (this.activeStep != '3') {
this.activeStep = Number(this.activeStep) + 1
} else {
//
}
},
finishCurStep() {
if (this.activeStep != '3') {
this.activeStep = Number(this.activeStep) + 1
} else {
//
}
},
//
changeSelect(item) {
this.selectedItem = { ...item };
console.log(this.selectedItem, 'this.selectedItem====');
},
changeSelectWeixin(item, flag) {
if (flag) {
this.select_placeholder_weixin = this.options_weixin_null.desc;
return
}
this.selectedItem = { ...item };
console.log(this.selectedItem, 'this.selectedItem====');
},
changeNormalWeixin() {
}
}
};
</script>
@ -778,6 +1042,7 @@ export default {
.step3-top {
display: flex;
justify-content: space-between;
padding-bottom: 0;
.btngroup {
display: flex;
@ -865,4 +1130,114 @@ export default {
/* 蓝色阴影_常规 */
box-shadow: 0px 4px 16px 0px rgba(17, 55, 143, 0.12);
}
.tem-home {
width: 100%;
border-radius: 4px;
opacity: 1;
background: #FFFFFF;
/* middle/middle_line_1 */
border: 1px solid #DFE2E6;
.tem-home-top {
width: 100%;
}
.tem-home-bottom {
display: flex;
align-items: center;
padding: 22px 32px;
justify-content: space-between;
.tem-look {
margin-right: 36px;
}
div {
display: flex;
align-items: center;
img {
margin-right: 6px;
}
}
}
}
// .el-step__head:nth-child(1){
// background: url('../assets/register/step1_ing.svg') no-repeat center;
// background-size: cover;
// width: 24px; /* */
// height: 24px; /* */
// }
// :deep(.el-step__line) {
// height: 0px; // 线
// width: 50px;
// margin-top: 14px; // 线
// left: 80% !important;
// position: absolute;
// border: 1px solid #006AFF;
// }
.step2-wrap {
flex: 1;
}
.step-wrap {
display: flex;
justify-content: space-between;
align-items: center;
padding: 24px 0 0 0;
.step-item {
align-items: center;
display: flex;
span {
color: #1E2226;
letter-spacing: 0.08em;
}
.custom-icon {
margin-right: 12px;
}
}
.checked span {
font-size: 16px;
font-weight: bold;
color: #006AFF !important;
transition: all .3s;
}
.success span {
font-size: 16px;
font-weight: normal;
color: #006AFF !important;
transition: all .3s;
}
.step-line {
flex: 1;
margin: 0 32px;
border-bottom: 1px solid #DFE2E6;
}
.step_active-line {
transition: all .3s;
border-bottom: 1px solid #006AFF;
}
}
.step-desc {
padding-top: 6px;
display: flex;
justify-content: space-between;
padding-bottom: 24px;
color: #8A9099;
span {
padding-left: 36px;
}
}
</style>

1
src/views/SiteList.vue

@ -0,0 +1 @@
<!-- 站点列表 -->

49
src/views/SiteSettings.vue

@ -0,0 +1,49 @@
<template>
<div class="site-setting-wrap">
</div>
</template>
<script>
// import GuipInput from '@/components/GuipInput.vue';
export default {
//
name: '',
props: [''],
components: {
// GuipInput,
},
data() {
return {
}
},
methods: {
onSwitchChange(data) {
console.log(data, '---');
}
}
}
</script>
<style lang="scss">
.domain-wrap {
.domain-item{
margin-bottom: 10px;
}
.domain-item p:last-child{
padding-left: 23px;
color: #8A9099;
}
p{
text-align: left;
line-height: 18px;
margin-bottom: 8px;
}
.domain-box {
display: flex;
flex-direction: column;
justify-content: flex-start;
}
}
</style>
Loading…
Cancel
Save