diff --git a/package-lock.json b/package-lock.json index ab032a3..225453a 100755 --- a/package-lock.json +++ b/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", diff --git a/package.json b/package.json index 7bd6f7d..ef6d626 100755 --- a/package.json +++ b/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", diff --git a/src/assets/register/drop-selected.svg b/src/assets/register/drop-selected.svg new file mode 100644 index 0000000..e3faa11 --- /dev/null +++ b/src/assets/register/drop-selected.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/assets/register/edit-tem.svg b/src/assets/register/edit-tem.svg new file mode 100644 index 0000000..e4773bb --- /dev/null +++ b/src/assets/register/edit-tem.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/assets/register/look-tem.svg b/src/assets/register/look-tem.svg new file mode 100644 index 0000000..cb92d9f --- /dev/null +++ b/src/assets/register/look-tem.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/assets/register/tem-img-normal.png b/src/assets/register/tem-img-normal.png new file mode 100644 index 0000000..b8b820a Binary files /dev/null and b/src/assets/register/tem-img-normal.png differ diff --git a/src/components/CustomDropdown.vue b/src/components/CustomDropdown.vue new file mode 100644 index 0000000..77de708 --- /dev/null +++ b/src/components/CustomDropdown.vue @@ -0,0 +1,170 @@ + + + + + \ No newline at end of file diff --git a/src/main.js b/src/main.js index aeb0df8..3b22748 100755 --- a/src/main.js +++ b/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, diff --git a/src/store/index.js b/src/store/index.js index 6633a72..2ee5a6e 100755 --- a/src/store/index.js +++ b/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: { diff --git a/src/style/theme/common.scss b/src/style/theme/common.scss index 8bbb8b6..673f85f 100644 --- a/src/style/theme/common.scss +++ b/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; + } } \ No newline at end of file diff --git a/src/utils/request.js b/src/utils/request.js new file mode 100644 index 0000000..8b84a3f --- /dev/null +++ b/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; \ No newline at end of file diff --git a/src/views/Personalization.vue b/src/views/Personalization.vue new file mode 100644 index 0000000..512cb4f --- /dev/null +++ b/src/views/Personalization.vue @@ -0,0 +1,62 @@ + + + \ No newline at end of file diff --git a/src/views/Register.vue b/src/views/Register.vue index cc2e415..acc7ddd 100755 --- a/src/views/Register.vue +++ b/src/views/Register.vue @@ -10,59 +10,51 @@ - - - - -
- 基础信息 - 填写站点信息、选择模板样式 -
- - - -
- 基础信息 - 填写站点信息、选择模板样式 +
+
+
+
+ + + 基础信息 +
+
+
+ + + + 收款方式 +
+
+
+ + + + 添加服务 +
- - - -
- 基础信息 - 填写站点信息、选择模板样式 +
+
+
+ {{ renderStepDesc('1') }} + {{ renderStepDesc('2') }} + {{ renderStepDesc('3') }}
- - - - +
+
+ + - - @@ -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() { + } + } }; @@ -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; + } +} diff --git a/src/views/SiteList.vue b/src/views/SiteList.vue new file mode 100644 index 0000000..ce42d5c --- /dev/null +++ b/src/views/SiteList.vue @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/views/SiteSettings.vue b/src/views/SiteSettings.vue new file mode 100644 index 0000000..3bb0088 --- /dev/null +++ b/src/views/SiteSettings.vue @@ -0,0 +1,49 @@ + + + \ No newline at end of file