From 225e450bc9675a51e3b650bfd958de16916771d8 Mon Sep 17 00:00:00 2001 From: sudoooooo Date: Tue, 6 Feb 2024 21:01:58 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20=E4=BF=AE=E6=94=B9traceid=E7=94=9F?= =?UTF-8?q?=E6=88=90=E8=A7=84=E5=88=99=EF=BC=8C=E4=BF=AE=E6=94=B9readme?= =?UTF-8?q?=E3=80=81=E5=9B=BE=E7=89=87=E5=92=8Cwindows=E5=85=BC=E5=AE=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .gitignore | 1 + Dockerfile | 13 +- server/.env | 3 +- server/README.md | 73 ---- server/package.json | 5 +- server/public/commom.css | 5 +- server/src/app.module.ts | 8 +- server/src/guards/authtication.ts | 2 +- server/src/logger/util.ts | 28 +- server/src/main.ts | 5 +- .../src/middlewares/logRequest.middleware.ts | 2 +- server/src/models/surveyResponse.entity.ts | 38 +- .../survey/__test/survey.controller.spec.ts | 2 +- .../controllers/dataStatistic.controller.ts | 2 +- .../survey/services/surveyMeta.service.ts | 2 +- server/src/modules/survey/survey.module.ts | 2 +- .../{plugins => securityPlugin}/interface.ts | 0 .../pluginManager.provider.ts | 0 .../pluginManager.ts | 3 +- .../responseSecurityPlugin/index.ts | 0 .../responseSecurityPlugin/utils.ts | 0 .../surveyUtilPlugin/index.ts | 0 .../edit/modules/contentModule/history.vue | 2 +- .../edit/modules/generalModule/pageNav.vue | 14 +- web/src/management/utils/constant.js | 2 +- .../questions/common/css/choice.scss | 177 +++++---- .../questions/common/css/default.scss | 14 +- .../questions/common/css/formItem.scss | 22 +- .../materials/questions/common/css/group.scss | 352 ++++++++++-------- .../materials/questions/common/css/icon.scss | 9 +- .../materials/questions/common/css/input.scss | 29 +- .../questions/common/css/question.scss | 4 +- .../questions/common/css/radioQuestion.scss | 190 +++++----- .../AdvancedConfig/OptionConfig.vue | 2 +- .../components/Options/OptionEditBar.vue | 13 +- .../components/Options/UseOptionBase.jsx | 4 +- .../materials/setters/widgets/InputNumber.vue | 7 +- .../setters/widgets/QuestionTime.vue | 2 +- .../setters/widgets/QuestionTimeHour.vue | 2 +- 39 files changed, 552 insertions(+), 487 deletions(-) delete mode 100644 server/README.md rename server/src/{plugins => securityPlugin}/interface.ts (100%) rename server/src/{plugins => securityPlugin}/pluginManager.provider.ts (100%) rename server/src/{plugins => securityPlugin}/pluginManager.ts (92%) rename server/src/{plugins => securityPlugin}/responseSecurityPlugin/index.ts (100%) rename server/src/{plugins => securityPlugin}/responseSecurityPlugin/utils.ts (100%) rename server/src/{plugins => securityPlugin}/surveyUtilPlugin/index.ts (100%) diff --git a/.gitignore b/.gitignore index b057231d..a35571b2 100644 --- a/.gitignore +++ b/.gitignore @@ -2,6 +2,7 @@ node_modules dist +package-lock.json # local env files .env.local diff --git a/Dockerfile b/Dockerfile index 2f0396b4..555cce28 100644 --- a/Dockerfile +++ b/Dockerfile @@ -1,16 +1,5 @@ # 镜像集成 -FROM ubuntu:latest - -# 安装依赖 -RUN apt-get -y update -RUN apt-get -y install wget gcc - -# 安装node环境 -ENV NODE_VERSION v18.17.1 -RUN mkdir -p /node/$NODE_VERSION -RUN wget https://nodejs.org/dist/$NODE_VERSION/node-$NODE_VERSION-linux-x64.tar.gz -RUN tar xzf node-$NODE_VERSION-linux-x64.tar.gz -C /node/ -ENV PATH /node/node-$NODE_VERSION-linux-x64/bin:$PATH +FROM node:16 # 设置工作区间 WORKDIR /xiaoju-survey diff --git a/server/.env b/server/.env index eda5c17c..4c495386 100644 --- a/server/.env +++ b/server/.env @@ -1,8 +1,9 @@ XIAOJU_SURVEY_MONGO_DB_NAME=xiaojuSurvey XIAOJU_SURVEY_MONGO_URL=mongodb://localhost:27017 -XIAOJU_SURVEY_RESPONSE_AES_ENCRYPT_SECRET_KEY=dataAesEncryptSecretKey XIAOJU_SURVEY_MONGO_AUTH_SOURCE= + +XIAOJU_SURVEY_RESPONSE_AES_ENCRYPT_SECRET_KEY=dataAesEncryptSecretKey XIAOJU_SURVEY_HTTP_DATA_ENCRYPT_TYPE=rsa XIAOJU_SURVEY_JWT_SECRET=xiaojuSurveyJwtSecret diff --git a/server/README.md b/server/README.md deleted file mode 100644 index 00a13b11..00000000 --- a/server/README.md +++ /dev/null @@ -1,73 +0,0 @@ -

- Nest Logo -

- -[circleci-image]: https://img.shields.io/circleci/build/github/nestjs/nest/master?token=abc123def456 -[circleci-url]: https://circleci.com/gh/nestjs/nest - -

A progressive Node.js framework for building efficient and scalable server-side applications.

-

-NPM Version -Package License -NPM Downloads -CircleCI -Coverage -Discord -Backers on Open Collective -Sponsors on Open Collective - - Support us - -

- - -## Description - -[Nest](https://github.com/nestjs/nest) framework TypeScript starter repository. - -## Installation - -```bash -$ npm install -``` - -## Running the app - -```bash -# development -$ npm run start - -# watch mode -$ npm run start:dev - -# production mode -$ npm run start:prod -``` - -## Test - -```bash -# unit tests -$ npm run test - -# e2e tests -$ npm run test:e2e - -# test coverage -$ npm run test:cov -``` - -## Support - -Nest is an MIT-licensed open source project. It can grow thanks to the sponsors and support by the amazing backers. If you'd like to join them, please [read more here](https://docs.nestjs.com/support). - -## Stay in touch - -- Author - [Kamil Myśliwiec](https://kamilmysliwiec.com) -- Website - [https://nestjs.com](https://nestjs.com/) -- Twitter - [@nestframework](https://twitter.com/nestframework) - -## License - -Nest is [MIT licensed](LICENSE). diff --git a/server/package.json b/server/package.json index c024b0ad..80502257 100644 --- a/server/package.json +++ b/server/package.json @@ -1,15 +1,14 @@ { - "name": "server-new", + "name": "server", "version": "0.0.1", "description": "", "author": "", - "private": true, - "license": "UNLICENSED", "scripts": { "build": "nest build", "format": "prettier --write \"src/**/*.ts\" \"test/**/*.ts\"", "local": "ts-node ./scripts/run-local.ts", "start": "nest start", + "dev": "npm run start:dev", "start:dev": "NODE_ENV=development nest start --watch", "start:debug": "NODE_ENV=development nest start --debug --watch", "start:prod": "NODE_ENV=production node dist/main", diff --git a/server/public/commom.css b/server/public/commom.css index 606c181c..62df2721 100644 --- a/server/public/commom.css +++ b/server/public/commom.css @@ -1,4 +1,4 @@ -#main{ +#main { width: 100wh; height: 100vh; display: flex; @@ -6,7 +6,8 @@ justify-content: center; align-items: center; } -.title{ + +.title { font-size: 20px; color: #4A4C5B; } \ No newline at end of file diff --git a/server/src/app.module.ts b/server/src/app.module.ts index 737ffb22..edcb3994 100644 --- a/server/src/app.module.ts +++ b/server/src/app.module.ts @@ -2,8 +2,8 @@ import { MiddlewareConsumer, Module } from '@nestjs/common'; import { AppController } from './app.controller'; -import { ResponseSecurityPlugin } from './plugins/responseSecurityPlugin'; -import { SurveyUtilPlugin } from './plugins/surveyUtilPlugin'; +import { ResponseSecurityPlugin } from './securityPlugin/responseSecurityPlugin'; +import { SurveyUtilPlugin } from './securityPlugin/surveyUtilPlugin'; import { TypeOrmModule } from '@nestjs/typeorm'; import { ConfigModule, ConfigService } from '@nestjs/config'; @@ -29,9 +29,9 @@ import { ClientEncrypt } from './models/clientEncrypt.entity'; import { Word } from './models/word.entity'; import { LoggerProvider } from './logger/logger.provider'; -import { PluginManagerProvider } from './plugins/pluginManager.provider'; +import { PluginManagerProvider } from './securityPlugin/pluginManager.provider'; import { LogRequestMiddleware } from './middlewares/logRequest.middleware'; -import { XiaojuSurveyPluginManager } from './plugins/pluginManager'; +import { XiaojuSurveyPluginManager } from './securityPlugin/pluginManager'; import { Logger } from './logger'; @Module({ diff --git a/server/src/guards/authtication.ts b/server/src/guards/authtication.ts index 69c33030..886a8814 100644 --- a/server/src/guards/authtication.ts +++ b/server/src/guards/authtication.ts @@ -16,7 +16,7 @@ export class Authtication implements CanActivate { const token = request.headers.authorization?.split(' ')[1]; if (!token) { - throw new AuthtificationException('未登录'); + throw new AuthtificationException('请登录'); } let decoded; diff --git a/server/src/logger/util.ts b/server/src/logger/util.ts index 85906560..ada62779 100644 --- a/server/src/logger/util.ts +++ b/server/src/logger/util.ts @@ -1,15 +1,27 @@ -import { customAlphabet } from 'nanoid'; -const traceIdAlphabet = 'abcdef0123456789'; - -let count = 0; +let count = 999; const getCountStr = () => { count++; - return count.toString().padStart(8, '0'); + if (count > 9000) { + count = 1000; + } + return count.toString(); }; -const getRandom = customAlphabet(traceIdAlphabet, 10); +export const genTraceId = ({ ip }) => { + // ip转16位 + 当前时间戳（毫秒级）+自增序列（1000开始自增到9000）+ 当前进程id的后5位 + ip = ip.replace('::ffff:', ''); + let ipArr; + if (ip.indexOf(':') > 0) { + ipArr = ip.split(':').map((segment) => { + // 将IPv6每个段转为16位，并补0到长度为4 + return parseInt(segment, 16).toString(16).padStart(4, '0'); + }); + } else { + ipArr = ip + .split('.') + .map((item) => parseInt(item).toString(16).padStart(2, '0')); + } -export const genTraceId = (): string => { - return getRandom() + Math.round(Date.now() / 1000).toString() + getCountStr(); + return `${ipArr.join('')}${Date.now().toString()}${getCountStr()}${process.pid.toString().slice(-5)}`; }; diff --git a/server/src/main.ts b/server/src/main.ts index 13cad38c..df3eff45 100644 --- a/server/src/main.ts +++ b/server/src/main.ts @@ -2,7 +2,10 @@ import { NestFactory } from '@nestjs/core'; import { AppModule } from './app.module'; async function bootstrap() { + const PORT = process.env.PORT || 3000; const app = await NestFactory.create(AppModule); - await app.listen(3000); + await app.listen(PORT); + console.log(`server is running at: http://127.0.0.1:${PORT}`); } + bootstrap(); diff --git a/server/src/middlewares/logRequest.middleware.ts b/server/src/middlewares/logRequest.middleware.ts index 2302110f..7c5d34bd 100644 --- a/server/src/middlewares/logRequest.middleware.ts +++ b/server/src/middlewares/logRequest.middleware.ts @@ -12,7 +12,7 @@ export class LogRequestMiddleware implements NestMiddleware { const { method, originalUrl, ip } = req; const userAgent = req.get('user-agent') || ''; const startTime = Date.now(); - const traceId = genTraceId(); + const traceId = genTraceId({ ip }); this.logger.setTraceId(traceId); const query = JSON.stringify(req.query); const body = JSON.stringify(req.body); diff --git a/server/src/models/surveyResponse.entity.ts b/server/src/models/surveyResponse.entity.ts index 0e6f660a..798050a0 100644 --- a/server/src/models/surveyResponse.entity.ts +++ b/server/src/models/surveyResponse.entity.ts @@ -8,31 +8,13 @@ import { } from 'typeorm'; import { ObjectId } from 'mongodb'; import { RECORD_STATUS } from '../enums'; -import pluginManager from '../plugins/pluginManager'; +import pluginManager from '../securityPlugin/pluginManager'; @Entity({ name: 'surveySubmit' }) export class SurveyResponse { @ObjectIdColumn() _id: ObjectId; - @Column() - curStatus: { - status: RECORD_STATUS; - date: number; - }; - - @Column() - statusList: Array<{ - status: RECORD_STATUS; - date: number; - }>; - - @Column() - createDate: number; - - @Column() - updateDate: number; - @Column() pageId: string; @@ -54,6 +36,24 @@ export class SurveyResponse { @Column('jsonb') optionTextAndId: Record; + @Column() + curStatus: { + status: RECORD_STATUS; + date: number; + }; + + @Column() + statusList: Array<{ + status: RECORD_STATUS; + date: number; + }>; + + @Column() + createDate: number; + + @Column() + updateDate: number; + @BeforeInsert() initDefaultInfo() { const now = Date.now(); diff --git a/server/src/modules/survey/__test/survey.controller.spec.ts b/server/src/modules/survey/__test/survey.controller.spec.ts index 9fd5888b..5cc7c17d 100644 --- a/server/src/modules/survey/__test/survey.controller.spec.ts +++ b/server/src/modules/survey/__test/survey.controller.spec.ts @@ -61,7 +61,7 @@ describe('SurveyController', () => { }); describe('createSurvey', () => { - it('should create a survey and return the survey ID', async () => { + it('should create a survey and return the survey id', async () => { const surveyInfo = { surveyType: 'normal', remark: '问卷调研', diff --git a/server/src/modules/survey/controllers/dataStatistic.controller.ts b/server/src/modules/survey/controllers/dataStatistic.controller.ts index b8c3f023..258b6c6c 100644 --- a/server/src/modules/survey/controllers/dataStatistic.controller.ts +++ b/server/src/modules/survey/controllers/dataStatistic.controller.ts @@ -13,7 +13,7 @@ import { ResponseSchemaService } from '../../surveyResponse/services/responseSch import * as Joi from 'joi'; import { Authtication } from 'src/guards/authtication'; -import { XiaojuSurveyPluginManager } from 'src/plugins/pluginManager'; +import { XiaojuSurveyPluginManager } from 'src/securityPlugin/pluginManager'; @Controller('/api/survey/dataStatistic') export class DataStatisticController { diff --git a/server/src/modules/survey/services/surveyMeta.service.ts b/server/src/modules/survey/services/surveyMeta.service.ts index 2ea041dd..50877225 100644 --- a/server/src/modules/survey/services/surveyMeta.service.ts +++ b/server/src/modules/survey/services/surveyMeta.service.ts @@ -8,7 +8,7 @@ import { NoSurveyPermissionException } from 'src/exceptions/noSurveyPermissionEx import { HttpException } from 'src/exceptions/httpException'; import { SurveyNotFoundException } from 'src/exceptions/surveyNotFoundException'; import { EXCEPTION_CODE } from 'src/enums/exceptionCode'; -import { XiaojuSurveyPluginManager } from 'src/plugins/pluginManager'; +import { XiaojuSurveyPluginManager } from 'src/securityPlugin/pluginManager'; @Injectable() export class SurveyMetaService { diff --git a/server/src/modules/survey/survey.module.ts b/server/src/modules/survey/survey.module.ts index d2ac9ba0..e651da0a 100644 --- a/server/src/modules/survey/survey.module.ts +++ b/server/src/modules/survey/survey.module.ts @@ -23,7 +23,7 @@ import { SurveyHistoryService } from './services/surveyHistory.service'; import { SurveyMetaService } from './services/surveyMeta.service'; import { ContentSecurityService } from './services/contentSecurity.service'; -import { PluginManagerProvider } from 'src/plugins/pluginManager.provider'; +import { PluginManagerProvider } from 'src/securityPlugin/pluginManager.provider'; @Module({ imports: [ diff --git a/server/src/plugins/interface.ts b/server/src/securityPlugin/interface.ts similarity index 100% rename from server/src/plugins/interface.ts rename to server/src/securityPlugin/interface.ts diff --git a/server/src/plugins/pluginManager.provider.ts b/server/src/securityPlugin/pluginManager.provider.ts similarity index 100% rename from server/src/plugins/pluginManager.provider.ts rename to server/src/securityPlugin/pluginManager.provider.ts diff --git a/server/src/plugins/pluginManager.ts b/server/src/securityPlugin/pluginManager.ts similarity index 92% rename from server/src/plugins/pluginManager.ts rename to server/src/securityPlugin/pluginManager.ts index a4ead04c..d557ade8 100644 --- a/server/src/plugins/pluginManager.ts +++ b/server/src/securityPlugin/pluginManager.ts @@ -17,7 +17,8 @@ export class XiaojuSurveyPluginManager { async triggerHook(hookName: AllowHooks, data?: any) { for (const plugin of this.plugins) { if (plugin[hookName]) { - data = await plugin[hookName](data); + await plugin[hookName](data); + break; } } return data; diff --git a/server/src/plugins/responseSecurityPlugin/index.ts b/server/src/securityPlugin/responseSecurityPlugin/index.ts similarity index 100% rename from server/src/plugins/responseSecurityPlugin/index.ts rename to server/src/securityPlugin/responseSecurityPlugin/index.ts diff --git a/server/src/plugins/responseSecurityPlugin/utils.ts b/server/src/securityPlugin/responseSecurityPlugin/utils.ts similarity index 100% rename from server/src/plugins/responseSecurityPlugin/utils.ts rename to server/src/securityPlugin/responseSecurityPlugin/utils.ts diff --git a/server/src/plugins/surveyUtilPlugin/index.ts b/server/src/securityPlugin/surveyUtilPlugin/index.ts similarity index 100% rename from server/src/plugins/surveyUtilPlugin/index.ts rename to server/src/securityPlugin/surveyUtilPlugin/index.ts diff --git a/web/src/management/pages/edit/modules/contentModule/history.vue b/web/src/management/pages/edit/modules/contentModule/history.vue index 01789b3f..7ee336a6 100644 --- a/web/src/management/pages/edit/modules/contentModule/history.vue +++ b/web/src/management/pages/edit/modules/contentModule/history.vue @@ -26,7 +26,7 @@ import { getSurveyHistory } from '@/management/api/survey'; import moment from 'moment'; // 引入中文 -import 'moment/locale/zh-cn' +import 'moment/locale/zh-cn'; // 设置中文 moment.locale('zh-cn'); diff --git a/web/src/management/pages/edit/modules/generalModule/pageNav.vue b/web/src/management/pages/edit/modules/generalModule/pageNav.vue index b1749a53..66f96ff4 100644 --- a/web/src/management/pages/edit/modules/generalModule/pageNav.vue +++ b/web/src/management/pages/edit/modules/generalModule/pageNav.vue @@ -1,11 +1,21 @@ diff --git a/web/src/management/utils/constant.js b/web/src/management/utils/constant.js index 0bc3ce6e..6dde6b4b 100644 --- a/web/src/management/utils/constant.js +++ b/web/src/management/utils/constant.js @@ -2,4 +2,4 @@ export const QOP_MAP = { COPY: 'copy', EDIT: 'edit', -}; \ No newline at end of file +}; diff --git a/web/src/materials/questions/common/css/choice.scss b/web/src/materials/questions/common/css/choice.scss index 1c624838..c504587d 100644 --- a/web/src/materials/questions/common/css/choice.scss +++ b/web/src/materials/questions/common/css/choice.scss @@ -1,15 +1,18 @@ @import './default.scss'; + .isPc .choice-wrapper { .choice-box .choice-item { &:hover { background-color: $primary-color-light; transition: background-color 0.3s ease-in-out; } + &:not(:hover) { background-color: transparent; transition: background-color 0.3s ease-in-out; } } + .nest-box .choice-outer .choice-item .item-title { display: none !important; } @@ -17,9 +20,11 @@ .choice-wrapper { font-size: 0; + .choice-box { - padding: 0 .2rem!important; + padding: 0 .2rem !important; box-sizing: border-box; + // margin-bottom: -0.22rem; .choice-item { position: relative; @@ -30,9 +35,10 @@ vertical-align: top; // height: .88rem; line-height: 0.4rem; - padding: 0.22rem 0 0.22rem 0.05rem!important; + padding: 0.22rem 0 0.22rem 0.05rem !important; margin-bottom: 0.08rem; cursor: pointer; + .item-input { position: relative; vertical-align: top; @@ -43,31 +49,37 @@ border-radius: 2px; background-color: #fff; cursor: pointer; - &[type='radio']{ + + &[type='radio'] { border-radius: 100%; } - &[type='radio']::before{ + + &[type='radio']::before { border-radius: 50%; } - + &.print { border-radius: 0; } + &.print:after { display: none; } + &:disabled { border-color: $border-color !important; + &::after { background: #eee; } - & + label { + + &+label { color: #ccc !important; } } - + } - + .item-title { flex: 1; vertical-align: top; @@ -76,10 +88,12 @@ overflow: hidden; word-wrap: break-word; cursor: pointer; + .label-img-wrapper { width: 80%; text-align: center; } + .label-img { display: inline-block !important; width: 2rem; @@ -87,6 +101,7 @@ margin-top: 0.25rem; } } + .center-text { span { display: inline-block; @@ -94,10 +109,12 @@ text-align: center; } } + &.is-checked { .item-title { color: $primary-color; } + .qicon.qicon-gouxuan { display: inline-block; font-size: 0.32rem; @@ -105,16 +122,19 @@ border-color: $primary-color; background-color: $primary-color; color: #fff; - border:none + border: none } - + transition: all 0.3s ease-in-out; } + &:not(.is-checked) { background-color: transparent; + .item-title { color: $font-color; } + transition: all 0.3s ease-in-out; } @@ -123,6 +143,7 @@ margin-bottom: 0; } } + .option-wrapper { display: flex; // justify-content: center; @@ -130,9 +151,11 @@ .vertical { width: 100%; + .item-title .label-img { width: 75%; } + // &.choice-item.last2child { // margin-bottom: .08rem; // } @@ -161,97 +184,114 @@ .input-wrapper { font-size: 0; + .input-box { - outline: none; - font-size: 0.56rem; - padding: 0.4rem; - border-radius: .08rem; - background-color: #fff; - vertical-align: top; + outline: none; + font-size: 0.56rem; + padding: 0.4rem; + border-radius: .08rem; + background-color: #fff; + vertical-align: top; - border: 1px solid $border-color; - width: 200%; - height: 1.61rem; + border: 1px solid $border-color; + width: 200%; + height: 1.61rem; - transform: scale(0.5,0.5); - transform-origin: left top; - box-sizing: border-box; - margin-bottom: -.81rem; - overflow: hidden; - // overflow: hidden; - color: $font-color; - z-index: 10; - // &:focus, &.is-focused { - // border: 1px solid $primary-color; - // } - &:not([readonly="readonly"]):hover{ - border: 1px solid $primary-color; - } - &.print { - border: none; - border-bottom: 1px solid $border-color; - border-radius: 0; - } - &::-webkit-input-placeholder { /* WebKit browsers */ - font-size: .56rem; - font-weight: 300; - color: $placeholder-color; - } - &:-moz-placeholder { /* Mozilla Firefox 4 to 18 */ - font-size: .56rem; - font-weight: 300; - color: $placeholder-color; - } - &::-moz-placeholder { /* Mozilla Firefox 19+ */ - font-size: .56rem; - font-weight: 300; - color: $placeholder-color; - } - &:-ms-input-placeholder { /* Internet Explorer 10+ */ - font-size: .56rem; - font-weight: 300; - color: $placeholder-color; - } + transform: scale(0.5, 0.5); + transform-origin: left top; + box-sizing: border-box; + margin-bottom: -.81rem; + overflow: hidden; + // overflow: hidden; + color: $font-color; + z-index: 10; + + // &:focus, &.is-focused { + // border: 1px solid $primary-color; + // } + &:not([readonly="readonly"]):hover { + border: 1px solid $primary-color; + } + + &.print { + border: none; + border-bottom: 1px solid $border-color; + border-radius: 0; + } + + &::-webkit-input-placeholder { + /* WebKit browsers */ + font-size: .56rem; + font-weight: 300; + color: $placeholder-color; + } + + &:-moz-placeholder { + /* Mozilla Firefox 4 to 18 */ + font-size: .56rem; + font-weight: 300; + color: $placeholder-color; + } + + &::-moz-placeholder { + /* Mozilla Firefox 19+ */ + font-size: .56rem; + font-weight: 300; + color: $placeholder-color; + } + + &:-ms-input-placeholder { + /* Internet Explorer 10+ */ + font-size: .56rem; + font-weight: 300; + color: $placeholder-color; + } } + .text-number-tip { - font-size: .24rem; - color: $font-color; - float: right; - margin-right: .1rem; - margin-top: .1rem; + font-size: .24rem; + color: $font-color; + float: right; + margin-right: .1rem; + margin-top: .1rem; } input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { - -webkit-appearance: none !important; - margin: 0; + -webkit-appearance: none !important; + margin: 0; } input[type="number"] { - -moz-appearance: textfield; + -moz-appearance: textfield; } } .nest-box { justify-content: space-around; padding-left: 0 !important; + .choice-outer { display: inline-block; text-align: center; + .choice-item { display: inline-block; width: 100%; margin-bottom: 0; padding-left: 0 !important; + .item-input { margin-right: 0; border-radius: 2px; - &.ql-checked-input + .item-title { + + &.ql-checked-input+.item-title { visibility: visible; height: auto; opacity: 1; } } + .item-title { visibility: hidden; opacity: 0; @@ -262,6 +302,7 @@ width: 100%; color: $font-color; position: absolute; + .item-title-text { text-overflow: ellipsis; overflow: hidden; @@ -273,10 +314,12 @@ } } } + // &.choice-box { // padding: 0; // } } + // input[type="radio"]{ // cursor: pointer; // // position: relative; diff --git a/web/src/materials/questions/common/css/default.scss b/web/src/materials/questions/common/css/default.scss index 306dbee2..7bd31e67 100644 --- a/web/src/materials/questions/common/css/default.scss +++ b/web/src/materials/questions/common/css/default.scss @@ -21,24 +21,24 @@ $font-size: 0.28rem; $tip-size: 0.22rem; .el-radio__input.is-checked+.el-radio__label { - color: $font-color !important; + color: $font-color !important; } .el-switch.is-checked .el-switch__core { - border-color: $primary-color !important; - background-color: $primary-color !important; + border-color: $primary-color !important; + background-color: $primary-color !important; } .el-checkbox__input.is-checked .el-checkbox__inner, .question-edit-wrapper .el-checkbox__input.is-indeterminate .el-checkbox__inner { - background-color: $primary-color !important; - border-color: $primary-color !important; + background-color: $primary-color !important; + border-color: $primary-color !important; } .el-checkbox__input.is-focus .el-checkbox__inner { - border-color: $primary-color !important; + border-color: $primary-color !important; } .el-checkbox__input.is-checked+.el-checkbox__label { - color: $font-color !important; + color: $font-color !important; } \ No newline at end of file diff --git a/web/src/materials/questions/common/css/formItem.scss b/web/src/materials/questions/common/css/formItem.scss index a41c6752..189ad997 100644 --- a/web/src/materials/questions/common/css/formItem.scss +++ b/web/src/materials/questions/common/css/formItem.scss @@ -1,13 +1,17 @@ @import './default.scss'; + .question-wrapper { position: relative; - &.gap{ + + &.gap { padding: 0.2rem 0 0.8rem; } + .component-wrapper { padding: 0 0.4rem; } - .noPadding{ + + .noPadding { padding: 0; } @@ -27,49 +31,60 @@ &.question-type-section { padding-bottom: 0; + .module-title { padding-bottom: 0; } } + &.horizon { display: flex; + .module-title .m-title { width: 1.2rem; margin-right: 8px; text-align: justify; position: relative; + &::before { content: ':'; display: block; position: absolute; right: -5px; } + &::after { content: ''; display: inline-block; width: 100%; } } + .component-wrapper { flex: 1; } + &.hasError { margin-bottom: 0.4rem; } + .module-err-tip { position: absolute; padding: 0; margin-top: -5px; left: 0; + .tip-text { padding-top: 0; } } } + &.hasError { .item-border { border-color: $error-color; } + /*由于错误提示可能多行，因此有错误时取消margin，让错误提示撑开边距*/ margin-bottom: 0; } @@ -77,6 +92,7 @@ &.special .module-err-tip { padding: 0.12rem 0.75rem 0; } + &.spliter { border-bottom: 0.12rem solid $spliter-color; } @@ -84,6 +100,7 @@ &:last-child { border-bottom: 0; } + .sort-tip { font-size: 0.26rem; line-height: 0.26rem; @@ -99,6 +116,7 @@ .isPc .question-form-item { border-bottom: none; + .sort-tip { padding-left: 0; margin-bottom: 0.24rem; diff --git a/web/src/materials/questions/common/css/group.scss b/web/src/materials/questions/common/css/group.scss index 0eed4e44..087caa5a 100644 --- a/web/src/materials/questions/common/css/group.scss +++ b/web/src/materials/questions/common/css/group.scss @@ -1,167 +1,193 @@ @import './default.scss'; - .isPc .group-wrapper.group-radio .module-err-tip { - position: relative; - } - .isPc .group-wrapper.group-radio .question-form-item { - margin-bottom: 0; - } - - .isPc .group-wrapper.group-radio { - .matrix-select-more { - margin-left: 0; - .module-err-tip { - left: 0; - } - } - } - .group-wrapper { - width: 100%; - // overflow: hidden; - &::-webkit-scrollbar { - display: block; - height: 10px; - background-color: #F2F4F7; - } - &::-webkit-scrollbar-thumb { - border-radius: 5px; - background: #E3E4E8; - } - &::-webkit-scrollbar-track { - height: 16px; - background: #F2F4F7; - } - .form-item-wrapper { - padding: 0 0 .2rem 0; - box-sizing: border-box; - } - .question-form-item { - padding: .16rem 0 .4rem; - border-bottom: none; - - .module-title { - padding: 0 0 .24rem 0.2rem; - font-size: .28rem; - font-weight: 400; - } - .component-wrapper { - padding: 0; - .star-wrapper { - padding: 0 .35rem; - } - .nps-wrapper { - padding: 0; - } - } - - &:last-child { - padding-bottom: 0; - } - - &.hasError .module-err-tip.show { - padding: 0; - } - } - - .box { - display: flex; - } - .group-title.main { - background: #F2F4F7; - padding: 0 ; - min-height: .4rem; - line-height: .4rem; - box-sizing: border-box; - display: flex; - span { - display: inline-block; - box-sizing: border-box; - vertical-align: top; - font-size: .28rem; - color: $title-color; - text-align: center; - line-height: 0.4rem; - // font-weight: 500; - width: 100%; - word-break: break-word; - border-left: 1px dotted rgba(200, 201, 205, 1); - height: auto; - } - - & > span:first-child { - border: none; - } - .group-title-text span { - border: none; - } - &>span{ - padding: .2rem .1rem; - } - } - - &.group-radio { - .module-title { - // color: $font-color; - line-height: .36rem; - } - .question-form-item { - padding: .4rem 0 .4rem 0; - } - .checkbox-wrapper, .radio-wrapper { - .radio-box.nest-box .radio-outer .radio-item { - padding: .22rem 0; - } - } - .module-err-tip { - margin-top: .25rem; - } - } - } - - .horizontal { - .group-title { - padding-left: 25%; - } - .question-form-item { - width: 100%; - font-size: 0; - overflow: hidden; - border-bottom: 1px solid #eee; - margin-bottom: .2rem; - padding-top: .2rem; - .module-title { - float: left; - width: 27%; - vertical-align: top; - font-size: .26rem !important; - } - .checkbox-wrapper, .radio-wrapper { - display: inline-block; - width: 70%; - vertical-align: top; - border-bottom: none; - } - } - } - - .select-more-label { - display: block; - margin-top: .2rem; - // margin-bottom: -.2rem; - height: .3rem; - line-height: .3rem; - width: 100%; - color: #666; - font-size: .26rem; - } - + +.isPc .group-wrapper.group-radio .module-err-tip { + position: relative; +} + +.isPc .group-wrapper.group-radio .question-form-item { + margin-bottom: 0; +} + +.isPc .group-wrapper.group-radio { .matrix-select-more { - max-width: 10rem; - .question-form-item { - padding-top: 0px; - .m-select-more { - margin-top: .3rem; - margin-bottom: .5rem; - width: 100% !important; + margin-left: 0; + + .module-err-tip { + left: 0; + } + } +} + +.group-wrapper { + width: 100%; + + // overflow: hidden; + &::-webkit-scrollbar { + display: block; + height: 10px; + background-color: #F2F4F7; + } + + &::-webkit-scrollbar-thumb { + border-radius: 5px; + background: #E3E4E8; + } + + &::-webkit-scrollbar-track { + height: 16px; + background: #F2F4F7; + } + + .form-item-wrapper { + padding: 0 0 .2rem 0; + box-sizing: border-box; + } + + .question-form-item { + padding: .16rem 0 .4rem; + border-bottom: none; + + .module-title { + padding: 0 0 .24rem 0.2rem; + font-size: .28rem; + font-weight: 400; + } + + .component-wrapper { + padding: 0; + + .star-wrapper { + padding: 0 .35rem; + } + + .nps-wrapper { + padding: 0; } } - } \ No newline at end of file + + &:last-child { + padding-bottom: 0; + } + + &.hasError .module-err-tip.show { + padding: 0; + } + } + + .box { + display: flex; + } + + .group-title.main { + background: #F2F4F7; + padding: 0; + min-height: .4rem; + line-height: .4rem; + box-sizing: border-box; + display: flex; + + span { + display: inline-block; + box-sizing: border-box; + vertical-align: top; + font-size: .28rem; + color: $title-color; + text-align: center; + line-height: 0.4rem; + // font-weight: 500; + width: 100%; + word-break: break-word; + border-left: 1px dotted rgba(200, 201, 205, 1); + height: auto; + } + + &>span:first-child { + border: none; + } + + .group-title-text span { + border: none; + } + + &>span { + padding: .2rem .1rem; + } + } + + &.group-radio { + .module-title { + // color: $font-color; + line-height: .36rem; + } + + .question-form-item { + padding: .4rem 0 .4rem 0; + } + + .checkbox-wrapper, + .radio-wrapper { + .radio-box.nest-box .radio-outer .radio-item { + padding: .22rem 0; + } + } + + .module-err-tip { + margin-top: .25rem; + } + } +} + +.horizontal { + .group-title { + padding-left: 25%; + } + + .question-form-item { + width: 100%; + font-size: 0; + overflow: hidden; + border-bottom: 1px solid #eee; + margin-bottom: .2rem; + padding-top: .2rem; + + .module-title { + float: left; + width: 27%; + vertical-align: top; + font-size: .26rem !important; + } + + .checkbox-wrapper, + .radio-wrapper { + display: inline-block; + width: 70%; + vertical-align: top; + border-bottom: none; + } + } +} + +.select-more-label { + display: block; + margin-top: .2rem; + // margin-bottom: -.2rem; + height: .3rem; + line-height: .3rem; + width: 100%; + color: #666; + font-size: .26rem; +} + +.matrix-select-more { + max-width: 10rem; + + .question-form-item { + padding-top: 0px; + + .m-select-more { + margin-top: .3rem; + margin-bottom: .5rem; + width: 100% !important; + } + } +} \ No newline at end of file diff --git a/web/src/materials/questions/common/css/icon.scss b/web/src/materials/questions/common/css/icon.scss index 76baa069..876f00c2 100644 --- a/web/src/materials/questions/common/css/icon.scss +++ b/web/src/materials/questions/common/css/icon.scss @@ -1,8 +1,9 @@ @font-face { - font-family: "qicon"; /* Project id 4263885 */ + font-family: "qicon"; + /* Project id 4263885 */ src: url('//at.alicdn.com/t/c/font_4263885_u91txz1d68.woff2?t=1697079806138') format('woff2'), - url('//at.alicdn.com/t/c/font_4263885_u91txz1d68.woff?t=1697079806138') format('woff'), - url('//at.alicdn.com/t/c/font_4263885_u91txz1d68.ttf?t=1697079806138') format('truetype'); + url('//at.alicdn.com/t/c/font_4263885_u91txz1d68.woff?t=1697079806138') format('woff'), + url('//at.alicdn.com/t/c/font_4263885_u91txz1d68.ttf?t=1697079806138') format('truetype'); } .qicon { @@ -35,4 +36,4 @@ .qicon-xingxing:before { content: "\a6ca"; -} +} \ No newline at end of file diff --git a/web/src/materials/questions/common/css/input.scss b/web/src/materials/questions/common/css/input.scss index 4e3c6a35..a4b4d1b3 100644 --- a/web/src/materials/questions/common/css/input.scss +++ b/web/src/materials/questions/common/css/input.scss @@ -1,6 +1,8 @@ @import './default.scss'; + .input-wrapper { font-size: 0; + .input-box { outline: none; font-size: 0.56rem; @@ -13,7 +15,7 @@ width: 200%; height: 1.61rem; - transform: scale(0.5,0.5); + transform: scale(0.5, 0.5); transform-origin: left top; box-sizing: border-box; margin-bottom: -.81rem; @@ -21,41 +23,53 @@ // overflow: hidden; color: $font-color; z-index: 10; + &.is-focused:focus { border: 1px solid $primary-color; height: 3.5rem; margin-bottom: -1.75rem; overflow-y: scroll; } - &:not([readonly="readonly"]):hover{ + + &:not([readonly="readonly"]):hover { border: 1px solid $primary-color; } + &.print { border: none; border-bottom: 1px solid $border-color; border-radius: 0; } - &::-webkit-input-placeholder { /* WebKit browsers */ + + &::-webkit-input-placeholder { + /* WebKit browsers */ font-size: .56rem; font-weight: 300; color: $placeholder-color; } - &:-moz-placeholder { /* Mozilla Firefox 4 to 18 */ + + &:-moz-placeholder { + /* Mozilla Firefox 4 to 18 */ font-size: .56rem; font-weight: 300; color: $placeholder-color; } - &::-moz-placeholder { /* Mozilla Firefox 19+ */ + + &::-moz-placeholder { + /* Mozilla Firefox 19+ */ font-size: .56rem; font-weight: 300; color: $placeholder-color; } - &:-ms-input-placeholder { /* Internet Explorer 10+ */ + + &:-ms-input-placeholder { + /* Internet Explorer 10+ */ font-size: .56rem; font-weight: 300; color: $placeholder-color; } } + .text-number-tip { font-size: .24rem; color: $font-color; @@ -73,7 +87,8 @@ input[type="number"] { -moz-appearance: textfield; } - textarea{ + + textarea { resize: none; } } \ No newline at end of file diff --git a/web/src/materials/questions/common/css/question.scss b/web/src/materials/questions/common/css/question.scss index a709afdd..373380fc 100644 --- a/web/src/materials/questions/common/css/question.scss +++ b/web/src/materials/questions/common/css/question.scss @@ -1,4 +1,5 @@ @import './default.scss'; + .question { position: relative; padding: 0.2rem 0 0.3rem; @@ -6,5 +7,4 @@ &-block { padding: 0 0.4rem; } -} - \ No newline at end of file +} \ No newline at end of file diff --git a/web/src/materials/questions/common/css/radioQuestion.scss b/web/src/materials/questions/common/css/radioQuestion.scss index 368a90f7..0fe51337 100644 --- a/web/src/materials/questions/common/css/radioQuestion.scss +++ b/web/src/materials/questions/common/css/radioQuestion.scss @@ -1,96 +1,110 @@ @import './default.scss'; + .question-form-item { - position: relative; - padding: 0.2rem 0 0.8rem; - + position: relative; + padding: 0.2rem 0 0.8rem; + + .component-wrapper { + padding: 0 0.4rem; + } + + .noPadding { + padding: 0; + } + + &.no-padding { .component-wrapper { - padding: 0 0.4rem; - } - .noPadding{ padding: 0; } - - &.no-padding { - .component-wrapper { - padding: 0; - } - } - - &.no-out-padding { - padding: 0 0 0.2rem; - } - - .clear { - clear: both; - } - - &.question-type-section { + } + + &.no-out-padding { + padding: 0 0 0.2rem; + } + + .clear { + clear: both; + } + + &.question-type-section { + padding-bottom: 0; + + .module-title { padding-bottom: 0; - .module-title { - padding-bottom: 0; - } - } - &.horizon { - display: flex; - .module-title .m-title { - width: 1.2rem; - margin-right: 8px; - text-align: justify; - position: relative; - &::before { - content: ':'; - display: block; - position: absolute; - right: -5px; - } - &::after { - content: ''; - display: inline-block; - width: 100%; - } - } - .component-wrapper { - flex: 1; - } - &.hasError { - margin-bottom: 0.4rem; - } - .module-err-tip { - position: absolute; - padding: 0; - margin-top: -5px; - left: 0; - .tip-text { - padding-top: 0; - } - } - } - &.hasError { - .item-border { - border-color: $error-color; - } - /*由于错误提示可能多行，因此有错误时取消margin，让错误提示撑开边距*/ - margin-bottom: 0; - } - - &.special .module-err-tip { - padding: 0.12rem 0.75rem 0; - } - &.spliter { - border-bottom: 0.12rem solid $spliter-color; - } - - &:last-child { - border-bottom: 0; - } - .sort-tip { - font-size: 0.26rem; - line-height: 0.26rem; - opacity: 0.5; - margin-top: -0.24rem; - margin-bottom: 0.4rem; - padding-left: 0.4rem; - color: #92949d; } } - \ No newline at end of file + + &.horizon { + display: flex; + + .module-title .m-title { + width: 1.2rem; + margin-right: 8px; + text-align: justify; + position: relative; + + &::before { + content: ':'; + display: block; + position: absolute; + right: -5px; + } + + &::after { + content: ''; + display: inline-block; + width: 100%; + } + } + + .component-wrapper { + flex: 1; + } + + &.hasError { + margin-bottom: 0.4rem; + } + + .module-err-tip { + position: absolute; + padding: 0; + margin-top: -5px; + left: 0; + + .tip-text { + padding-top: 0; + } + } + } + + &.hasError { + .item-border { + border-color: $error-color; + } + + /*由于错误提示可能多行，因此有错误时取消margin，让错误提示撑开边距*/ + margin-bottom: 0; + } + + &.special .module-err-tip { + padding: 0.12rem 0.75rem 0; + } + + &.spliter { + border-bottom: 0.12rem solid $spliter-color; + } + + &:last-child { + border-bottom: 0; + } + + .sort-tip { + font-size: 0.26rem; + line-height: 0.26rem; + opacity: 0.5; + margin-top: -0.24rem; + margin-bottom: 0.4rem; + padding-left: 0.4rem; + color: #92949d; + } +} \ No newline at end of file diff --git a/web/src/materials/questions/components/AdvancedConfig/OptionConfig.vue b/web/src/materials/questions/components/AdvancedConfig/OptionConfig.vue index dc78e8a3..4f02f1cd 100644 --- a/web/src/materials/questions/components/AdvancedConfig/OptionConfig.vue +++ b/web/src/materials/questions/components/AdvancedConfig/OptionConfig.vue @@ -178,7 +178,7 @@ export default { for (const i in addOne) { if (i === 'others') { addOne[i] = others; - if(others) addOne.othersKey = `${field}_${addOne.hash}`; + if (others) addOne.othersKey = `${field}_${addOne.hash}`; } else if (i === 'mustOthers') { addOne[i] = false; } else if (i === 'text') { diff --git a/web/src/materials/questions/components/Options/OptionEditBar.vue b/web/src/materials/questions/components/Options/OptionEditBar.vue index df656065..3e2464e1 100644 --- a/web/src/materials/questions/components/Options/OptionEditBar.vue +++ b/web/src/materials/questions/components/Options/OptionEditBar.vue @@ -1,8 +1,7 @@