'init'

backstage/.gitignore

@@ -0,0 +1,23 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+
+# testing
+/coverage
+
+# production
+/build
+
+# misc
+.DS_Store
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*

backstage/README.md

@@ -0,0 +1,46 @@
+# Getting Started with Create React App
+
+This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app).
+
+## Available Scripts
+
+In the project directory, you can run:
+
+### `npm start`
+
+Runs the app in the development mode.\
+Open [http://localhost:3000](http://localhost:3000) to view it in the browser.
+
+The page will reload if you make edits.\
+You will also see any lint errors in the console.
+
+### `npm test`
+
+Launches the test runner in the interactive watch mode.\
+See the section about [running tests](https://facebook.github.io/create-react-app/docs/running-tests) for more information.
+
+### `npm run build`
+
+Builds the app for production to the `build` folder.\
+It correctly bundles React in production mode and optimizes the build for the best performance.
+
+The build is minified and the filenames include the hashes.\
+Your app is ready to be deployed!
+
+See the section about [deployment](https://facebook.github.io/create-react-app/docs/deployment) for more information.
+
+### `npm run eject`
+
+**Note: this is a one-way operation. Once you `eject`, you can’t go back!**
+
+If you aren’t satisfied with the build tool and configuration choices, you can `eject` at any time. This command will remove the single build dependency from your project.
+
+Instead, it will copy all the configuration files and the transitive dependencies (webpack, Babel, ESLint, etc) right into your project so you have full control over them. All of the commands except `eject` will still work, but they will point to the copied scripts so you can tweak them. At this point you’re on your own.
+
+You don’t have to ever use `eject`. The curated feature set is suitable for small and middle deployments, and you shouldn’t feel obligated to use this feature. However we understand that this tool wouldn’t be useful if you couldn’t customize it when you are ready for it.
+
+## Learn More
+
+You can learn more in the [Create React App documentation](https://facebook.github.io/create-react-app/docs/getting-started).
+
+To learn React, check out the [React documentation](https://reactjs.org/).

backstage/config-overrides.js

@@ -0,0 +1,10 @@
+const path = require('path')
+const { override, addWebpackAlias } = require('customize-cra')
+
+// 添加 @ 别名
+const webpackAlias = addWebpackAlias({
+  '@': path.resolve(__dirname, 'src'),
+})
+
+// 导出要进行覆盖的 webpack 配置
+module.exports = override(webpackAlias)

backstage/package.json

@@ -0,0 +1,66 @@
+{
+  "name": "demo",
+  "version": "0.1.0",
+  "private": true,
+  "dependencies": {
+    "@ant-design/cssinjs": "^1.5.6",
+    "@testing-library/jest-dom": "^5.16.5",
+    "@testing-library/react": "^13.4.0",
+    "@testing-library/user-event": "^13.5.0",
+    "@types/jest": "^27.5.2",
+    "@types/node": "^16.18.3",
+    "@types/react": "^18.0.24",
+    "@types/react-dom": "^18.0.8",
+    "antd": "^5.0.4",
+    "axios": "^1.1.3",
+    "dayjs": "^1.11.7",
+    "echarts": "^5.4.0",
+    "js-base64": "^3.7.3",
+    "js-export-excel": "^1.1.4",
+    "react": "^18.2.0",
+    "react-dnd": "^16.0.1",
+    "react-dnd-html5-backend": "^16.0.1",
+    "react-dom": "^18.2.0",
+    "react-lazyimg-component": "^1.0.1",
+    "react-redux": "^8.0.4",
+    "react-router-dom": "5.3",
+    "react-scripts": "5.0.1",
+    "redux": "^4.2.0",
+    "redux-devtools-extension": "^2.13.9",
+    "redux-thunk": "^2.4.1",
+    "sass": "^1.55.0",
+    "typescript": "^4.8.4",
+    "web-vitals": "^2.1.4"
+  },
+  "scripts": {
+    "dev": "react-app-rewired start",
+    "build": "react-app-rewired build",
+    "test": "react-app-rewired test",
+    "eject": "react-scripts eject"
+  },
+  "eslintConfig": {
+    "extends": [
+      "react-app",
+      "react-app/jest"
+    ]
+  },
+  "browserslist": {
+    "production": [
+      ">0.2%",
+      "not dead",
+      "not op_mini all"
+    ],
+    "development": [
+      "last 1 chrome version",
+      "last 1 firefox version",
+      "last 1 safari version"
+    ]
+  },
+  "devDependencies": {
+    "@types/history": "^5.0.0",
+    "@types/react-router-dom": "^5.3.3",
+    "customize-cra": "^1.0.0",
+    "react-app-rewired": "^2.2.1"
+  },
+  "homepage": "."
+}

backstage/path.tsconfig.json

@@ -0,0 +1,8 @@
+{
+    "compilerOptions": {
+      "baseUrl": "./",
+      "paths": {
+        "@/*": ["src/*"]
+      }
+    }
+  }

backstage/public/index.html

@@ -0,0 +1,43 @@
+<!DOCTYPE html>
+<html lang="zh">
+  <head>
+    <meta charset="utf-8" />
+    <link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <meta name="theme-color" content="#000000" />
+    <meta
+      name="description"
+      content="Web site created using create-react-app"
+    />
+    <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
+    <!--
+      manifest.json provides metadata used when your web app is installed on a
+      user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
+    -->
+
+    <!--
+      Notice the use of %PUBLIC_URL% in the tags above.
+      It will be replaced with the URL of the `public` folder during the build.
+      Only files inside the `public` folder can be referenced from the HTML.
+
+      Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
+      work correctly both with client-side routing and a non-root public URL.
+      Learn how to configure a non-root public URL by running `npm run build`.
+    -->
+    <title>unity本地大场景管理</title>
+  </head>
+  <body>
+    <noscript>You need to enable JavaScript to run this app.</noscript>
+    <div id="root"></div>
+    <!--
+      This HTML file is a template.
+      If you open it directly in the browser, you will see an empty page.
+
+      You can add webfonts, meta tags, or analytics to this file.
+      The build step will place the bundled scripts into the <body> tag.
+
+      To begin the development, run `npm start` or `yarn start`.
+      To create a production bundle, use `npm run build` or `yarn build`.
+    -->
+  </body>
+</html>

backstage/src/App.tsx

@@ -0,0 +1,38 @@
+import "@/assets/styles/base.css";
+// 关于路由
+import React from "react";
+import { Router, Route, Switch } from "react-router-dom";
+import history from "./utils/history";
+import AuthRoute from "./components/AuthRoute";
+import SpinLoding from "./components/SpinLoding";
+import AsyncSpinLoding from "./components/AsyncSpinLoding";
+import UpAsyncLoding from "./components/UpAsyncLoding";
+import MessageCom from "./components/Message";
+const Layout = React.lazy(() => import("./pages/Layout"));
+const Login = React.lazy(() => import("./pages/Login"));
+
+export default function App() {
+  return (
+    <>
+      {/* 关于路由 */}
+      <Router history={history}>
+        <React.Suspense fallback={<SpinLoding />}>
+          <Switch>
+            {/* 测试页面 */}
+            <Route path="/login" component={Login} />
+            <AuthRoute path="/" component={Layout} />
+          </Switch>
+        </React.Suspense>
+      </Router>
+
+      {/* 发送请求的加载组件 */}
+      <AsyncSpinLoding />
+
+      {/* 上传附件的进度条元素 */}
+      <UpAsyncLoding />
+
+      {/* antd 轻提示 ---兼容360浏览器 */}
+      <MessageCom />
+    </>
+  );
+}

backstage/src/assets/styles/base.css

@@ -0,0 +1,192 @@
+* {
+  margin: 0;
+  padding: 0;
+  box-sizing: border-box;
+}
+html {
+  height: 100%;
+  font-size: 14px;
+  user-select: none;
+}
+body {
+  font: 1em/1.4 'Microsoft Yahei', 'PingFang SC', 'Avenir', 'Segoe UI', 'Hiragino Sans GB', 'STHeiti', 'Microsoft Sans Serif', 'WenQuanYi Micro Hei', sans-serif;
+  height: 100%;
+  color: black;
+}
+a {
+  text-decoration: none;
+  color: black;
+  outline: none;
+}
+i {
+  font-style: normal;
+}
+img {
+  max-width: 100%;
+  max-height: 100%;
+  vertical-align: middle;
+  object-fit: cover;
+}
+ul {
+  list-style: none;
+}
+body {
+  overflow: auto;
+  overflow-y: overlay;
+}
+/* 文本域取消下拉 */
+textarea {
+  resize: none !important;
+}
+/* 主题色 */
+:root {
+  --themeColor: #00A0E6;
+}
+/* 找不到页面 */
+.noFindPage {
+  opacity: 0;
+  transition: opacity 0.5s;
+}
+/* 兼容360浏览器的下拉框 */
+.ant-select-selector {
+  position: relative;
+  background-color: #ffffff;
+  border: 1px solid #d9d9d9;
+  transition: all 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
+}
+#root {
+  width: 100vw;
+  height: 100vh;
+  min-width: 1600px;
+  min-height: 900px;
+  overflow: auto;
+  overflow-y: overlay;
+  /* 普通文字按钮的颜色 */
+  /* 按钮的危险颜色 */
+  /* antd分页器样式 */
+  /* 表格的图片居中 */
+  /* antd图片预览组件 */
+  /* antd表格居中 */
+}
+#root a {
+  color: var(--themeColor);
+}
+#root .ant-btn-text {
+  color: var(--themeColor);
+}
+#root .ant-btn-text:disabled {
+  cursor: not-allowed;
+  color: rgba(0, 0, 0, 0.25);
+}
+#root .ant-btn-text.ant-btn-dangerous {
+  color: #ff1a1a;
+}
+#root .ant-pagination .ant-pagination-item {
+  border-radius: 50%;
+  border: 1px solid #999;
+  background-color: transparent !important;
+}
+#root .ant-pagination .ant-pagination-item-active {
+  background-color: var(--themeColor) !important;
+}
+#root .ant-pagination .ant-pagination-item-active a {
+  color: #fff !important;
+}
+#root .ant-pagination .ant-pagination-item:hover {
+  background-color: var(--themeColor) !important;
+}
+#root .ant-pagination .ant-pagination-item:hover a {
+  color: #fff !important;
+}
+#root .ant-pagination-prev {
+  border-radius: 50% !important;
+  border: 1px solid #999;
+}
+#root .ant-pagination-prev:hover {
+  background-color: var(--themeColor);
+}
+#root .ant-pagination-prev:hover button {
+  color: #fff;
+}
+#root .ant-pagination-next {
+  border-radius: 50% !important;
+  border: 1px solid #999;
+}
+#root .ant-pagination-next:hover {
+  background-color: var(--themeColor);
+}
+#root .ant-pagination-next:hover button {
+  color: #fff;
+}
+#root .ant-pagination-disabled {
+  border: 1px solid #ccc;
+}
+#root .ant-pagination-disabled:hover {
+  background-color: transparent;
+}
+#root .tableImgAuto {
+  display: flex;
+  justify-content: center;
+}
+#root .ant-image {
+  display: none;
+}
+#root .ant-table-cell {
+  text-align: center !important;
+}
+#root .ant-table-thead .ant-table-cell {
+  background-color: var(--themeColor);
+  color: #fff;
+}
+#root .ant-picker .ant-picker-input > input {
+  text-align: center;
+}
+[hidden] {
+  display: none !important;
+}
+#upInput {
+  display: none;
+}
+#upInput2 {
+  display: none;
+}
+.pageTitle {
+  font-size: 18px;
+  font-weight: 700;
+  position: absolute;
+  z-index: 110;
+  top: -85px;
+  left: -18px;
+  padding-left: 40px;
+  color: #fff;
+  height: 70px;
+  line-height: 70px;
+}
+.pageTitle::before {
+  position: absolute;
+  left: 20px;
+  top: 50%;
+  transform: translateY(-50%);
+  content: '';
+  width: 6px;
+  height: 20px;
+  background-color: var(--themeColor);
+}
+.mySorrl::-webkit-scrollbar {
+  /*滚动条整体样式*/
+  width: 5px;
+  /*高宽分别对应横竖滚动条的尺寸*/
+  height: 1px;
+}
+.mySorrl::-webkit-scrollbar-thumb {
+  /*滚动条里面小方块*/
+  border-radius: 10px;
+  -webkit-box-shadow: inset 0 0 5px transparent;
+  background: var(--themeColor);
+}
+.mySorrl::-webkit-scrollbar-track {
+  /*滚动条里面轨道*/
+  -webkit-box-shadow: inset 0 0 5px transparent;
+  border-radius: 10px;
+  background: transparent;
+}

backstage/src/assets/styles/base.less

@@ -0,0 +1,255 @@
+* {
+  margin: 0;
+  padding: 0;
+  box-sizing: border-box;
+}
+
+html {
+  height: 100%;
+  font-size: 14px;
+  user-select: none;
+}
+
+body {
+  font: 1em/1.4 'Microsoft Yahei', 'PingFang SC', 'Avenir', 'Segoe UI', 'Hiragino Sans GB', 'STHeiti', 'Microsoft Sans Serif', 'WenQuanYi Micro Hei', sans-serif;
+  height: 100%;
+  color: black;
+}
+
+a {
+  text-decoration: none;
+  color: black;
+  outline: none;
+}
+
+i {
+  font-style: normal;
+}
+
+img {
+  max-width: 100%;
+  max-height: 100%;
+  vertical-align: middle;
+  object-fit: cover;
+}
+
+ul {
+  list-style: none;
+}
+
+body {
+  overflow: auto;
+  overflow-y: overlay;
+}
+
+/* 文本域取消下拉 */
+textarea {
+  resize: none !important;
+}
+
+/* 主题色 */
+:root {
+  --themeColor: #00A0E6;
+}
+
+
+
+
+
+/* 找不到页面 */
+.noFindPage {
+  opacity: 0;
+  transition: opacity .5s;
+}
+
+
+/* 兼容360浏览器的下拉框 */
+.ant-select-selector {
+  position: relative;
+  background-color: #ffffff;
+  border: 1px solid #d9d9d9;
+  transition: all 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
+}
+
+
+// 重置antd样式
+#root {
+  width: 100vw;
+  height: 100vh;
+  min-width: 1600px;
+  min-height: 900px;
+  overflow: auto;
+  overflow-y: overlay;
+
+  a {
+    color: var(--themeColor);
+  }
+
+  /* 普通文字按钮的颜色 */
+  .ant-btn-text {
+    color: var(--themeColor);
+  }
+
+  .ant-btn-text:disabled {
+    cursor: not-allowed;
+    color: rgba(0, 0, 0, 0.25);
+  }
+
+  /* 按钮的危险颜色 */
+  .ant-btn-text.ant-btn-dangerous {
+    color: #ff1a1a;
+  }
+
+  /* antd分页器样式 */
+  .ant-pagination .ant-pagination-item {
+    border-radius: 50%;
+    border: 1px solid #999;
+    background-color: transparent !important;
+  }
+
+  .ant-pagination .ant-pagination-item-active {
+    background-color: var(--themeColor) !important;
+  }
+
+
+  .ant-pagination .ant-pagination-item-active a {
+    color: #fff !important;
+  }
+
+  .ant-pagination .ant-pagination-item:hover {
+    background-color: var(--themeColor) !important;
+  }
+
+  .ant-pagination .ant-pagination-item:hover a {
+    color: #fff !important;
+  }
+
+  .ant-pagination-prev {
+    border-radius: 50% !important;
+    border: 1px solid #999;
+  }
+
+  .ant-pagination-prev:hover {
+    background-color: var(--themeColor);
+  }
+
+  .ant-pagination-prev:hover button {
+    color: #fff;
+  }
+
+
+
+  .ant-pagination-next {
+    border-radius: 50% !important;
+    border: 1px solid #999;
+  }
+
+
+  .ant-pagination-next:hover {
+    background-color: var(--themeColor);
+  }
+
+  .ant-pagination-next:hover button {
+    color: #fff;
+  }
+
+  .ant-pagination-disabled {
+    border: 1px solid #ccc;
+  }
+
+  .ant-pagination-disabled:hover {
+    background-color: transparent;
+  }
+
+
+  /* 表格的图片居中 */
+  .tableImgAuto {
+    display: flex;
+    justify-content: center;
+  }
+
+  /* antd图片预览组件 */
+  .ant-image {
+    display: none;
+  }
+
+  /* antd表格居中 */
+
+  .ant-table-cell {
+    text-align: center !important;
+  }
+
+  // 表头颜色
+  .ant-table-thead .ant-table-cell {
+    background-color: var(--themeColor);
+    color: #fff;
+  }
+
+  // 时间选择器居中
+  .ant-picker .ant-picker-input>input {
+    text-align: center;
+  }
+}
+
+
+
+[hidden] {
+  display: none !important;
+}
+
+
+
+#upInput {
+  display: none;
+}
+
+#upInput2 {
+  display: none;
+}
+
+// 页面标题
+.pageTitle {
+  font-size: 18px;
+  font-weight: 700;
+  position: absolute;
+  z-index: 110;
+  top: -85px;
+  left: -18px;
+  padding-left: 40px;
+  color: #fff;
+  height: 70px;
+  line-height: 70px;
+
+  &::before {
+    position: absolute;
+    left: 20px;
+    top: 50%;
+    transform: translateY(-50%);
+    content: '';
+    width: 6px;
+    height: 20px;
+    background-color: var(--themeColor);
+  }
+}
+
+// 滚动条
+.mySorrl::-webkit-scrollbar {
+  /*滚动条整体样式*/
+  width: 5px;
+  /*高宽分别对应横竖滚动条的尺寸*/
+  height: 1px;
+}
+
+.mySorrl::-webkit-scrollbar-thumb {
+  /*滚动条里面小方块*/
+  border-radius: 10px;
+  -webkit-box-shadow: inset 0 0 5px transparent;
+  background: var(--themeColor);
+}
+
+.mySorrl::-webkit-scrollbar-track {
+  /*滚动条里面轨道*/
+  -webkit-box-shadow: inset 0 0 5px transparent;
+  border-radius: 10px;
+  background: transparent;
+}

backstage/src/components/AsyncSpinLoding/index.module.scss

@@ -0,0 +1,21 @@
+.AsyncSpinLoding {
+  opacity: 0;
+  pointer-events: none;
+  transition: all .5s;
+  position: fixed;
+  z-index: 9998;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  // background-color: rgba(0, 0, 0, .6);
+  background-color: transparent;
+  :global{
+    .ant-spin-spinning{
+      position: absolute;
+      top: 50%;
+      left: 50%;
+      transform: translate(-50%,-50%);
+    }
+  }
+}

backstage/src/components/AsyncSpinLoding/index.tsx

@@ -0,0 +1,15 @@
+import styles from "./index.module.scss";
+import { Spin } from "antd";
+import React from "react";
+
+function AsyncSpinLoding() {
+  return (
+    <div id="AsyncSpinLoding" className={styles.AsyncSpinLoding}>
+      <Spin size="large" />
+    </div>
+  );
+}
+
+const MemoAsyncSpinLoding = React.memo(AsyncSpinLoding);
+
+export default MemoAsyncSpinLoding;

backstage/src/components/AuthRoute/index.tsx

@@ -0,0 +1,32 @@
+import { hasToken } from "@//utils/storage";
+import { MessageFu } from "@/utils/message";
+import React from "react";
+import { Redirect, Route } from "react-router-dom";
+
+type AtahType = {
+  path: string;
+  component: React.FC;
+  [x: string]: any;
+};
+
+export default function AuthRoute({ path, component: Com, ...rest }: AtahType) {
+  return (
+    <Route
+      path={path}
+      {...rest}
+      render={() => {
+        if (hasToken()) return <Com />;
+        else {
+          MessageFu.warning("登录失效!");
+          return (
+            <Redirect
+              to={{
+                pathname: "/login",
+              }}
+            />
+          );
+        }
+      }}
+    />
+  );
+}

backstage/src/components/Message/index.tsx

@@ -0,0 +1,29 @@
+import React, { useEffect } from "react";
+import { message } from "antd";
+import { useSelector } from "react-redux";
+import { RootState } from "@/store";
+
+function MessageCom() {
+  // 从仓库中获取 antd 轻提示信息
+  const messageReducerInfo = useSelector(
+    (state: RootState) => state.A0layout.message
+  );
+
+  const [messageApi, contextHolder] = message.useMessage();
+
+  useEffect(() => {
+    if (messageReducerInfo.txt) {
+      messageApi.open({
+        type: messageReducerInfo.type,
+        content: messageReducerInfo.txt,
+        duration: messageReducerInfo.duration,
+      });
+    }
+  }, [messageApi, messageReducerInfo]);
+
+  return <>{contextHolder}</>;
+}
+
+const MemoMessage = React.memo(MessageCom);
+
+export default MemoMessage;

backstage/src/components/NotFound/index.tsx

@@ -0,0 +1,26 @@
+import { Result } from "antd";
+import { useEffect, useRef } from "react";
+
+export default function NotFound() {
+  const timeRef = useRef(-1);
+
+  useEffect(() => {
+    timeRef.current = window.setTimeout(() => {
+      const dom: HTMLDivElement = document.querySelector(".noFindPage")!;
+      dom.style.opacity = "1";
+    }, 300);
+    return () => {
+      clearTimeout(timeRef.current);
+    };
+  }, []);
+
+  return (
+    <div className="noFindPage">
+      <Result
+        status="404"
+        title="404"
+        subTitle="页面找不到或没有权限，请联系管理员!"
+      />
+    </div>
+  );
+}

backstage/src/components/SpinLoding/index.module.scss

@@ -0,0 +1,10 @@
+.SpinLoding {
+  position: relative;
+  z-index: 9999;
+  width: 100%;
+  height: 100%;
+  background-color: #fff;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}

backstage/src/components/SpinLoding/index.tsx

@@ -0,0 +1,13 @@
+import styles from "./index.module.scss";
+import { Spin } from "antd";
+import React from "react";
+function SpinLoding() {
+  return (
+    <div className={styles.SpinLoding}>
+      <Spin size='large'/>
+    </div>
+  );
+}
+const MemoSpinLoding = React.memo(SpinLoding);
+
+export default MemoSpinLoding;

backstage/src/components/UpAsyncLoding/index.module.scss

@@ -0,0 +1,43 @@
+.UpAsyncLoding {
+  opacity: 0;
+  pointer-events: none;
+  position: fixed;
+  z-index: 10000;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background-color: rgba(0, 0, 0, .4);
+
+  :global {
+    .progressBox {
+      position: absolute;
+      top: 60%;
+      left: 50%;
+      transform: translate(-50%, -50%);
+      width: 500px;
+      height: 6px;
+      border-radius: 3px;
+      border: 1px solid var(--themeColor);
+      overflow: hidden;
+
+      #progress {
+        position: absolute;
+        top: 0;
+        left: 0;
+        width: 0%;
+        height: 100%;
+        background-color: var(--themeColor);
+      }
+
+    }
+
+    .closeUpBtn {
+      position: absolute;
+      top: 70%;
+      left: 50%;
+      transform: translate(-50%, -50%);
+    }
+
+  }
+}

backstage/src/components/UpAsyncLoding/index.tsx

@@ -0,0 +1,38 @@
+import store, { RootState } from "@/store";
+import { Button } from "antd";
+import React, { useCallback } from "react";
+import { useSelector } from "react-redux";
+import styles from "./index.module.scss";
+function UpAsyncLoding() {
+  // 从仓库中获取取消上传的函数
+  const closeUpFile = useSelector(
+    (state: RootState) => state.A0layout.closeUpFile
+  );
+
+  const btnClose = useCallback(() => {
+    closeUpFile.fu();
+
+    setTimeout(() => {
+      store.dispatch({
+        type: "layout/closeUpFile",
+        payload: { fu: () => {}, state: false },
+      });
+    }, 200);
+  }, [closeUpFile]);
+
+  return (
+    <div id="UpAsyncLoding" className={styles.UpAsyncLoding}>
+      <div className="progressBox">
+        <div id="progress"></div>
+      </div>
+      {/* 手动取消上传按钮 */}
+      <div className="closeUpBtn">
+        <Button onClick={btnClose}>取消上传</Button>
+      </div>
+    </div>
+  );
+}
+
+const MemoUpAsyncLoding = React.memo(UpAsyncLoding);
+
+export default MemoUpAsyncLoding;

backstage/src/index.tsx

@@ -0,0 +1,41 @@
+// import 'default-passive-events';
+
+import App from "./App";
+import store from "./store/index";
+
+import { Provider } from "react-redux";
+import { createRoot } from "react-dom/client";
+
+import { ConfigProvider } from "antd";
+
+// 兼容360浏览器
+import {
+  StyleProvider,
+  legacyLogicalPropertiesTransformer,
+} from "@ant-design/cssinjs";
+
+import "dayjs/locale/zh-cn";
+import locale from "antd/locale/zh_CN";
+
+const container = document.getElementById("root") as HTMLElement;
+const root = createRoot(container);
+
+root.render(
+  <ConfigProvider
+    locale={locale}
+    theme={{
+      token: {
+        colorPrimary: "#00A0E6",
+      },
+    }}
+  >
+    <Provider store={store}>
+      <StyleProvider
+        hashPriority="high"
+        transformers={[legacyLogicalPropertiesTransformer]}
+      >
+        <App />
+      </StyleProvider>
+    </Provider>
+  </ConfigProvider>
+);

backstage/src/pages/A1List/index.module.scss

@@ -0,0 +1,25 @@
+.A1List {
+  padding: 20px 30px 0;
+
+  :global {
+
+    .tableBox {
+      margin-top: 20px;
+      height: calc(100% - 65px);
+      border: 1px solid #f0f0f0;
+      border-radius: 6px;
+
+      .ant-table-body {
+        height: 605px;
+        overflow-y: auto !important;
+        overflow-y: overlay !important;
+
+        .ant-table-row {
+          .ant-table-cell {
+            padding: 10px;
+          }
+        }
+      }
+    }
+  }
+}

backstage/src/pages/A1List/index.tsx

@@ -0,0 +1,164 @@
+import React, {
+  useCallback,
+  useEffect,
+  useMemo,
+  useRef,
+  useState,
+} from "react";
+import styles from "./index.module.scss";
+import { Button, Input, Popconfirm, Table } from "antd";
+import { useDispatch, useSelector } from "react-redux";
+import { RootState } from "@/store";
+import { A1tableType } from "@/types";
+import { A1_APIdel, A1_APIgetList } from "@/store/action/A1List";
+import { MessageFu } from "@/utils/message";
+function A1List() {
+  const dispatch = useDispatch();
+
+  // 顶部筛选
+  const [tableSelect, setTableSelect] = useState({
+    pageNum: 1,
+    pageSize: 10,
+    searchKey: "",
+  });
+
+  const getListFu = useCallback(() => {
+    dispatch(A1_APIgetList(tableSelect));
+  }, [dispatch, tableSelect]);
+
+  useEffect(() => {
+    getListFu();
+  }, [getListFu]);
+
+  // 场景名称的输入
+  const nameTime = useRef(-1);
+  const nameChange = useCallback(
+    (e: React.ChangeEvent<HTMLInputElement>) => {
+      clearTimeout(nameTime.current);
+      nameTime.current = window.setTimeout(() => {
+        setTableSelect({
+          ...tableSelect,
+          searchKey: e.target.value,
+          pageNum: 1,
+        });
+      }, 500);
+    },
+    [tableSelect]
+  );
+
+  const { tableInfo } = useSelector((state: RootState) => state.A1List);
+
+  // 页码变化
+  const paginationChange = useCallback(
+    () => (pageNum: number, pageSize: number) => {
+      setTableSelect({ ...tableSelect, pageNum, pageSize });
+    },
+    [tableSelect]
+  );
+
+  const lookFu = useCallback((id: number) => {
+    MessageFu.warning("等待开发");
+  }, []);
+
+  const editFu = useCallback((id: number) => {
+    MessageFu.warning("等待开发");
+  }, []);
+
+  const delTableFu = useCallback(
+    async (id: number) => {
+      const res = await A1_APIdel(id);
+      if (res.code === 0) {
+        MessageFu.success("删除成功!");
+        getListFu();
+      }
+    },
+    [getListFu]
+  );
+
+  const columns = useMemo(() => {
+    return [
+      {
+        title: "编号",
+        dataIndex: "sceneCode",
+      },
+      {
+        title: "场景名称",
+        dataIndex: "name",
+      },
+      {
+        title: "发布时间",
+        dataIndex: "createTime",
+      },
+
+      {
+        title: "操作",
+        render: (item: A1tableType) => (
+          <>
+            <Button size="small" type="text" onClick={() => lookFu(item.id)}>
+              查看
+            </Button>
+
+            <Button size="small" type="text" onClick={() => editFu(item.id)}>
+              编辑
+            </Button>
+            <Popconfirm
+              title="删除后无法恢复，是否删除?"
+              okText="删除"
+              cancelText="取消"
+              okButtonProps={{ loading: false }}
+              onConfirm={() => delTableFu(item.id)}
+            >
+              <Button size="small" type="text" danger>
+                删除
+              </Button>
+            </Popconfirm>
+          </>
+        ),
+      },
+    ];
+  }, [delTableFu, editFu, lookFu]);
+
+  return (
+    <div className={styles.A1List}>
+      <div className="pageTitle">场景管理</div>
+      <div className="A1Top">
+        <div className="selectBox">
+          <div className="selectBoxL">
+            <div className="row">
+              <span>场景名称：</span>
+              <Input
+                maxLength={30}
+                style={{ width: 300 }}
+                placeholder="请输入"
+                allowClear
+                onChange={(e) => nameChange(e)}
+              />
+            </div>
+          </div>
+        </div>
+      </div>
+      {/* 表格主体 */}
+      <div className="tableBox">
+        <Table
+          scroll={{ y: 605 }}
+          dataSource={tableInfo.list}
+          columns={columns}
+          rowKey="id"
+          pagination={{
+            showQuickJumper: true,
+            position: ["bottomCenter"],
+            // showSizeChanger: true,
+            current: tableSelect.pageNum,
+            pageSize: tableSelect.pageSize,
+            total: tableInfo.total,
+            onChange: paginationChange(),
+          }}
+        />
+      </div>
+    </div>
+  );
+}
+
+const MemoA1List = React.memo(A1List);
+
+export default MemoA1List;

backstage/src/pages/A9User/UserAdd/index.module.scss

@@ -0,0 +1,44 @@
+.userAdd {
+  :global {
+    .ant-modal-close {
+      display: none;
+    }
+
+    .userAddMain {
+      border-top: 1px solid #999999;
+      padding-top: 15px;
+      width: 100%;
+
+      .passTit {
+        color: #ff4d4f;
+        font-size: 14px;
+        padding-left: 98px;
+      }
+
+      .fromBox {
+        margin-bottom: 20px;
+        display: flex;
+
+        // align-items: center;
+        .lable {
+          text-align: right;
+          width: 98.33px;
+
+          &>span {
+            position: relative;
+            top: 2px;
+            color: #ff4d4f;
+          }
+        }
+
+        .checkBox {
+          &>div {
+            margin-bottom: 5px;
+          }
+        }
+      }
+
+    }
+  }
+
+}

backstage/src/pages/A9User/UserAdd/index.tsx

@@ -0,0 +1,153 @@
+import {
+  A9API_getUserInfoByIdAPI,
+  A9API_userSaveAPI,
+} from "@/store/action/A9User";
+import { SaveUserType } from "@/types";
+import { MessageFu } from "@/utils/message";
+import { Button, Form, Input, Modal, Popconfirm } from "antd";
+import React, { useCallback, useEffect, useRef } from "react";
+import styles from "./index.module.scss";
+
+type Props = {
+  id: any;
+  closePage: () => void;
+  upTableList: () => void;
+  addTableList: () => void;
+};
+
+function UserAdd({ id, closePage, upTableList, addTableList }: Props) {
+  // 没有通过校验
+  const onFinishFailed = useCallback(() => {
+    // return MessageFu.warning("有表单不符号规则!");
+  }, []);
+
+  // 设置表单初始数据（区分编辑和新增）
+  const FormBoxRef = useRef<any>({});
+
+  const getInfoInAPIFu = useCallback(async (id: number) => {
+    const res = await A9API_getUserInfoByIdAPI(id);
+    FormBoxRef.current.setFieldsValue(res.data);
+  }, []);
+
+  useEffect(() => {
+    if (id) getInfoInAPIFu(id);
+    FormBoxRef.current.setFieldsValue({ myRoleName: "管理员" });
+  }, [getInfoInAPIFu, id]);
+
+  // 通过校验点击确定
+  const onFinish = useCallback(
+    async (values: any) => {
+      const obj: SaveUserType = {
+        ...values,
+        id: id ? id : null,
+        roleId: 2,
+      };
+
+      const res: any = await A9API_userSaveAPI(obj);
+
+      if (res.code === 0) {
+        MessageFu.success(id ? "编辑成功!" : "新增成功!");
+        if (id) upTableList();
+        else addTableList();
+
+        closePage();
+      }
+      // console.log("通过校验，点击确定");
+    },
+    [addTableList, closePage, id, upTableList]
+  );
+
+  return (
+    <Modal
+      wrapClassName={styles.userAdd}
+      destroyOnClose
+      open={true}
+      title={id ? "编辑用户" : "新增用户"}
+      footer={
+        [] // 设置footer为空，去掉 取消 确定默认按钮
+      }
+    >
+      <div className="userAddMain">
+        <Form
+          ref={FormBoxRef}
+          name="basic"
+          labelCol={{ span: 5 }}
+          onFinish={onFinish}
+          onFinishFailed={onFinishFailed}
+          autoComplete="off"
+        >
+          <Form.Item
+            label="用户名"
+            name="userName"
+            rules={[{ required: true, message: "请输入账号名!" }]}
+            getValueFromEvent={(e) => e.target.value.replace(/\s+/g, "")}
+          >
+            <Input
+              disabled={id}
+              maxLength={15}
+              showCount
+              placeholder="请输入内容"
+            />
+          </Form.Item>
+
+          <Form.Item
+            label="用户角色"
+            name="myRoleName"
+            style={{ display: "none" }}
+          >
+            <Input disabled />
+          </Form.Item>
+
+          <Form.Item
+            label="真实姓名"
+            name="realName"
+            rules={[{ required: true, message: "请输入真实姓名!" }]}
+            getValueFromEvent={(e) => e.target.value.replace(/\s+/g, "")}
+          >
+            <Input maxLength={8} showCount placeholder="请输入内容" />
+          </Form.Item>
+
+          <Form.Item
+            label="手机号"
+            name="phone"
+            rules={[
+              { required: true, message: "请输入手机号!" },
+              // { max: 11, min: 11, message: "长度为11!" },
+              {
+                pattern: /^1[3-9][0-9]{9}$/,
+                message: "请输入正确格式的手机号!",
+              },
+            ]}
+            getValueFromEvent={(e) => e.target.value.replace(/\s+/g, "")}
+          >
+            <Input maxLength={11} showCount placeholder="请输入11位手机号" />
+          </Form.Item>
+
+          {id ? null : <div className="passTit">* 默认密码 123456</div>}
+
+          {/* 确定和取消按钮 */}
+          <br />
+          <Form.Item wrapperCol={{ offset: 9, span: 16 }}>
+            <Button type="primary" htmlType="submit">
+              提交
+            </Button>
+            &emsp;
+            <Popconfirm
+              title="放弃编辑后，信息将不会保存!"
+              okText="放弃"
+              cancelText="取消"
+              okButtonProps={{ loading: false }}
+              onConfirm={closePage}
+            >
+              <Button>取消</Button>
+            </Popconfirm>
+          </Form.Item>
+        </Form>
+      </div>
+    </Modal>
+  );
+}
+
+const MemoUserAdd = React.memo(UserAdd);
+
+export default MemoUserAdd;

backstage/src/pages/A9User/index.module.scss

@@ -0,0 +1,42 @@
+.A9User {
+  padding: 20px 30px 0;
+
+  :global {
+    .userTop {
+
+      .selectBox {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+
+        .row {
+          margin-right: 20px;
+        }
+
+        .selectBoxL {
+          display: flex;
+          align-items: center;
+        }
+      }
+    }
+
+    .tableBox {
+      margin-top: 20px;
+      height: calc(100% - 65px);
+      border: 1px solid #f0f0f0;
+      border-radius: 6px;
+
+      .ant-table-body {
+        height: 605px;
+        overflow-y: auto !important;
+        overflow-y: overlay !important;
+
+        .ant-table-row {
+          .ant-table-cell {
+            padding: 10px;
+          }
+        }
+      }
+    }
+  }
+}

backstage/src/pages/A9User/index.tsx

@@ -0,0 +1,277 @@
+import { RootState } from "@/store";
+import {
+  A9API_getUserListAPI,
+  A9API_userDisplayAPI,
+  A9API_userPassResetAPI,
+  A9API_userRemoveAPI,
+} from "@/store/action/A9User";
+import { UserTableAPIType, UserTableListType } from "@/types";
+import { MessageFu } from "@/utils/message";
+import { Input, Button, Table, Switch, Popconfirm } from "antd";
+import React, {
+  useCallback,
+  useEffect,
+  useMemo,
+  useRef,
+  useState,
+} from "react";
+import { useDispatch, useSelector } from "react-redux";
+import styles from "./index.module.scss";
+import UserAdd from "./UserAdd";
+
+function A9User() {
+  const dispatch = useDispatch();
+
+  // 顶部筛选
+  const [tableSelect, setTableSelect] = useState<UserTableAPIType>({
+    pageNum: 1,
+    pageSize: 10,
+    realName: "",
+  });
+
+  // 封装发送请求的函数
+
+  const getList = useCallback(async () => {
+    dispatch(A9API_getUserListAPI(tableSelect));
+  }, [dispatch, tableSelect]);
+
+  // 防止发送了2次请求来对应页码
+
+  const getListRef = useRef(-1);
+
+  useEffect(() => {
+    clearTimeout(getListRef.current);
+    getListRef.current = window.setTimeout(() => {
+      getList();
+    }, 100);
+  }, [getList, tableSelect]);
+
+  // 真实姓名的输入
+  const realNameTime = useRef(-1);
+  const realNameChange = useCallback(
+    (e: React.ChangeEvent<HTMLInputElement>) => {
+      clearTimeout(realNameTime.current);
+      realNameTime.current = window.setTimeout(() => {
+        setTableSelect({
+          ...tableSelect,
+          realName: e.target.value,
+          pageNum: 1,
+        });
+      }, 500);
+    },
+    [tableSelect]
+  );
+
+  // 点击重置
+  const [inputKey, setInputKey] = useState(1);
+  const resetSelectFu = useCallback(() => {
+    // 把2个输入框和时间选择器清空
+    setInputKey(Date.now());
+    setTableSelect({
+      pageNum: 1,
+      pageSize: 10,
+      realName: "",
+    });
+  }, []);
+
+  // 从仓库中获取表格数据
+  const tableInfo = useSelector((state: RootState) => state.A9User.tableInfo);
+
+  // 页码变化
+  const paginationChange = useCallback(
+    () => (pageNum: number, pageSize: number) => {
+      setTableSelect({ ...tableSelect, pageNum, pageSize });
+    },
+    [tableSelect]
+  );
+
+  // 切换表格中的启用停用状态
+  const isEnabledClickFu = useCallback(
+    async (val: boolean, id: number) => {
+      const isDisable = val ? 1 : 0;
+      const res: any = await A9API_userDisplayAPI(id, isDisable);
+      if (res.code === 0) getList();
+    },
+    [getList]
+  );
+
+  // 点击删除
+  const delTableFu = useCallback(
+    async (id: number) => {
+      const res: any = await A9API_userRemoveAPI(id);
+      if (res.code === 0) {
+        MessageFu.success("删除成功!");
+        getList();
+      }
+    },
+    [getList]
+  );
+
+  // 点击重置密码
+  const resetPassFu = useCallback(async (id: number) => {
+    const res: any = await A9API_userPassResetAPI(id);
+    if (res.code === 0) MessageFu.success("重置成功!");
+  }, []);
+
+  // 0------------点击新增或者编辑出来的页面
+  const [editPageShow, setEditPageShow] = useState(false);
+  const editId = useRef(0);
+
+  const openEditPageFu = useCallback(
+    (id: number) => {
+      if (id === 0 && tableInfo.list.length >= 30)
+        return MessageFu.warning("最多支持30个用户！");
+
+      editId.current = id;
+      setEditPageShow(true);
+    },
+    [tableInfo.list.length]
+  );
+
+  const columns = useMemo(() => {
+    return [
+      // {
+      //   width: 80,
+      //   title: "序号",
+      //   render: (text: any, record: any, index: any) =>
+      //     index + 1 + (pageNumRef.current - 1) * pagePageRef.current,
+      // },
+      {
+        title: "用户名",
+        dataIndex: "userName",
+      },
+      // {
+      //   title: "用户角色",
+      //   render: (item: UserTableListType) =>
+      //     item.isAdmin === 1 ? "超级管理员" : "管理员",
+      // },
+      {
+        title: "真实姓名",
+        dataIndex: "realName",
+      },
+      {
+        title: "手机号",
+        dataIndex: "phone",
+      },
+      {
+        title: "注册时间",
+        dataIndex: "createTime",
+      },
+
+      {
+        title: "启用状态",
+        render: (item: UserTableListType) => (
+          <Switch
+            disabled={item.isAdmin === 1}
+            checkedChildren="启用"
+            unCheckedChildren="停用"
+            checked={item.isEnabled === 1}
+            onChange={(val) => isEnabledClickFu(val, item.id!)}
+          />
+        ),
+      },
+
+      {
+        title: "操作",
+        render: (item: UserTableListType) => {
+          return item.isAdmin === 1 ? (
+            "-"
+          ) : (
+            <>
+              <Popconfirm
+                title="密码重制后为123456，是否重置?"
+                okText="重置"
+                cancelText="取消"
+                okButtonProps={{ loading: false }}
+                onConfirm={() => resetPassFu(item.id!)}
+              >
+                <Button size="small" type="text">
+                  重置密码
+                </Button>
+              </Popconfirm>
+
+              <Button
+                size="small"
+                type="text"
+                onClick={() => openEditPageFu(item.id!)}
+              >
+                编辑
+              </Button>
+              <Popconfirm
+                title="删除后无法恢复，是否删除?"
+                okText="删除"
+                cancelText="取消"
+                okButtonProps={{ loading: false }}
+                onConfirm={() => delTableFu(item.id!)}
+              >
+                <Button size="small" type="text" danger>
+                  删除
+                </Button>
+              </Popconfirm>
+            </>
+          );
+        },
+      },
+    ];
+  }, [delTableFu, isEnabledClickFu, openEditPageFu, resetPassFu]);
+
+  return (
+    <div className={styles.A9User}>
+      <div className="pageTitle">用户管理</div>
+      <div className="userTop">
+        <div className="selectBox">
+          <div className="selectBoxL">
+            <div className="row">
+              <span>真实姓名：</span>
+              <Input
+                key={inputKey}
+                maxLength={8}
+                style={{ width: 200 }}
+                placeholder="请输入"
+                allowClear
+                onChange={(e) => realNameChange(e)}
+              />
+            </div>
+          </div>
+          <div className="selectBoxR">
+            <Button type="primary" onClick={() => openEditPageFu(0)}>
+              新增
+            </Button>
+          </div>
+        </div>
+      </div>
+      {/* 表格主体 */}
+      <div className="tableBox">
+        <Table
+          scroll={{ y: 605 }}
+          dataSource={tableInfo.list}
+          columns={columns}
+          rowKey="id"
+          pagination={{
+            showQuickJumper: true,
+            position: ["bottomCenter"],
+            // showSizeChanger: true,
+            current: tableSelect.pageNum,
+            pageSize: tableSelect.pageSize,
+            total: tableInfo.total,
+            onChange: paginationChange(),
+          }}
+        />
+      </div>
+
+      {/* 点击新增或者编辑 */}
+      {editPageShow ? (
+        <UserAdd
+          id={editId.current}
+          closePage={() => setEditPageShow(false)}
+          upTableList={getList}
+          addTableList={resetSelectFu}
+        />
+      ) : null}
+    </div>
+  );
+}
+
+const MemoA9User = React.memo(A9User);
+
+export default MemoA9User;

backstage/src/pages/Layout/index.module.scss

@@ -0,0 +1,172 @@
+.Layout {
+  width: 100%;
+  height: 100%;
+  display: flex;
+  overflow: hidden;
+  position: relative;
+
+  :global {
+
+    .layoutLeft {
+      position: relative;
+      z-index: 30;
+      width: 220px;
+      height: 100%;
+      background-color: #234386;
+
+      .layoutLeftTop {
+        height: 70px;
+        background-color: #1f3d7c;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+
+        &>img {
+          width: 180px;
+        }
+      }
+
+      .layoutLeftMain {
+        height: calc(100% - 70px);
+
+
+        .mainBoxL2Row {
+          cursor: pointer;
+          height: 50px;
+          line-height: 50px;
+          font-size: 16px;
+          position: relative;
+          margin-top: 16px;
+          color: #fff;
+          text-align: center;
+
+          &:hover {
+            color: #fff;
+            background-color: var(--themeColor);
+          }
+        }
+
+        .active {
+          color: #fff;
+          pointer-events: none;
+          background-color: var(--themeColor);
+
+        }
+      }
+
+
+    }
+
+    .layoutRight {
+      width: calc(100% - 220px);
+      height: 100%;
+
+
+      .layoutRightTop {
+        height: 70px;
+        background-color: #1f3d7c;
+        display: flex;
+        justify-content: flex-end;
+        position: relative;
+        z-index: 30;
+
+        .user {
+          margin-right: 40px;
+          padding-right: 40px;
+          display: flex;
+          align-items: center;
+          padding-left: 55px;
+          cursor: pointer;
+          position: relative;
+          background: url('../../assets/img/user.png') no-repeat left center;
+          background-size: 40px 40px;
+          font-size: 16px;
+          color: #fff;
+
+          .userInco {
+            margin-left: 10px;
+            color: #fff;
+          }
+
+          .userInco1 {
+            display: none;
+          }
+
+          .userSet {
+            border-radius: 10px;
+            overflow: hidden;
+            width: 140px;
+            opacity: 0;
+            pointer-events: none;
+            transition: bottom .3s;
+            height: 120px;
+            position: absolute;
+            left: 50%;
+            transform: translateX(-50%);
+            bottom: -80px;
+            padding-top: 20px;
+            color: rgb(226, 223, 223);
+
+            &>span {
+              background-color: #1f3d7c;
+              display: block;
+              width: 100%;
+              height: 50px;
+              line-height: 50px;
+              text-align: center;
+
+              &:first-child {
+                border-radius: 10px 10px 0 0;
+              }
+
+              &:hover {
+                color: #fff;
+              }
+            }
+          }
+
+          &:hover {
+            .userSet {
+              opacity: 1;
+              pointer-events: auto;
+              bottom: -110px;
+            }
+
+            .userInco1 {
+              display: block;
+            }
+
+            .userInco2 {
+              display: none;
+            }
+
+
+          }
+        }
+      }
+
+      .layoutRightMain {
+        height: calc(100% - 70px);
+        padding: 15px 20px;
+        background-color: #eef0f4;
+
+        .mainBoxR {
+          width: 100%;
+          height: 100%;
+          background-color: #fff;
+          border-radius: 10px;
+
+          &>div {
+            width: 100%;
+            height: 100%;
+            position: relative;
+          }
+        }
+      }
+
+    }
+
+
+
+  }
+}

backstage/src/pages/Layout/index.tsx

@@ -0,0 +1,233 @@
+import React, {
+  useCallback,
+  useEffect,
+  useMemo,
+  useRef,
+  useState,
+} from "react";
+import { CaretUpOutlined, CaretDownOutlined } from "@ant-design/icons";
+import styles from "./index.module.scss";
+import SpinLoding from "@/components/SpinLoding";
+import { Route, Switch, useLocation } from "react-router-dom";
+import AuthRoute from "@/components/AuthRoute";
+import classNames from "classnames";
+import history from "@/utils/history";
+import { Button, Form, Input, Modal, Popconfirm } from "antd";
+import { Base64 } from "js-base64";
+import encodeStr from "@/utils/pass";
+import { passWordEditAPI } from "@/store/action/layout";
+import { getTokenInfo, removeTokenInfo } from "@/utils/storage";
+import { MessageFu } from "@/utils/message";
+import logonImg from "@/assets/img/logo.png";
+
+const NotFound = React.lazy(() => import("@/components/NotFound"));
+
+function Layout() {
+  const list = useMemo(() => {
+    return [
+      {
+        id: 100,
+        name: "场景管理",
+        path: "/",
+        Com: React.lazy(() => import("../A1List")),
+      },
+    ];
+  }, []);
+
+  useEffect(() => {
+    // 如果是超级管理员
+    const userInfo = getTokenInfo().user;
+    if (userInfo.isAdmin === 1) {
+      list.push({
+        id: 900,
+        name: "用户管理",
+        path: "/user",
+        Com: React.lazy(() => import("../A9User")),
+      });
+    }
+  }, [list]);
+
+  // 点击跳转
+  const pathCutFu = useCallback((path: string) => {
+    history.push(path);
+  }, []);
+
+  // 当前路径选中的左侧菜单
+  const location = useLocation();
+  const [path, setPath] = useState("");
+
+  useEffect(() => {
+    const arr = location.pathname.split("/");
+    let pathTemp = "/";
+    if (arr[1]) pathTemp = "/" + arr[1];
+
+    setPath(pathTemp);
+  }, [location]);
+
+  const userInfo = useMemo(() => {
+    return getTokenInfo().user;
+  }, []);
+
+  // 修改密码相关
+  const [open, setOpen] = useState(false);
+
+  // 拿到新密码的输入框的值
+  const oldPasswordValue = useRef("");
+
+  const checkPassWord = (rule: any, value: any = "") => {
+    if (value !== oldPasswordValue.current)
+      return Promise.reject("新密码不一致!");
+    else return Promise.resolve(value);
+  };
+
+  const onFinish = async (values: any) => {
+    // 通过校验之后发送请求
+    if (values.oldPassword === values.newPassword)
+      return MessageFu.warning("新旧密码不能相同!");
+    const obj = {
+      oldPassword: encodeStr(Base64.encode(values.oldPassword)),
+      newPassword: encodeStr(Base64.encode(values.newPassword)),
+    };
+    const res: any = await passWordEditAPI(obj);
+    if (res.code === 0) {
+      MessageFu.success("修改成功!");
+      loginExit();
+    }
+  };
+
+  // 点击退出登录
+  const loginExit = () => {
+    removeTokenInfo();
+    history.push("/login");
+  };
+
+  return (
+    <div className={styles.Layout}>
+      {/* 左边 */}
+      <div className="layoutLeft">
+        <div className="layoutLeftTop">
+          <img src={logonImg} alt="" />
+        </div>
+        {/* 左边主体 */}
+        <div className="layoutLeftMain">
+          {list.map((v) => (
+            <div
+              key={v.id}
+              onClick={() => pathCutFu(v.path)}
+              className={classNames(
+                "mainBoxL2Row",
+                v.path === path ? "active" : ""
+              )}
+            >
+              <div className="txt">{v.name}</div>
+            </div>
+          ))}
+        </div>
+      </div>
+      {/* 右边 */}
+      <div className="layoutRight">
+        <div className="layoutRightTop">
+          {/* 用户相关 */}
+          <div className="user">
+            {userInfo.realName}
+            <div className="userInco userInco1">
+              <CaretUpOutlined />
+            </div>
+            <div className="userInco userInco2">
+              <CaretDownOutlined />
+            </div>
+            <div className="userSet">
+              <span onClick={() => setOpen(true)}>修改密码</span>
+              <Popconfirm
+                placement="bottom"
+                title="确定退出吗?"
+                okText="确定"
+                cancelText="取消"
+                okButtonProps={{ loading: false }}
+                onConfirm={loginExit}
+              >
+                退出登录
+              </Popconfirm>
+            </div>
+          </div>
+        </div>
+        {/* 右边主体 */}
+        <div className="layoutRightMain">
+          {/* 二级路由页面 */}
+          <div className="mainBoxR">
+            <React.Suspense fallback={<SpinLoding />}>
+              <Switch>
+                {list.map((v) => (
+                  <AuthRoute key={v.id} exact path={v.path} component={v.Com} />
+                ))}
+
+                <Route path="*" component={NotFound} />
+              </Switch>
+            </React.Suspense>
+          </div>
+        </div>
+      </div>
+
+      {/* 点击修改密码打开的对话框 */}
+      <Modal
+        destroyOnClose
+        open={open}
+        title="修改密码"
+        onCancel={() => setOpen(false)}
+        footer={
+          [] // 设置footer为空，去掉 取消 确定默认按钮
+        }
+      >
+        <Form
+          name="basic"
+          labelCol={{ span: 5 }}
+          wrapperCol={{ span: 16 }}
+          onFinish={onFinish}
+          autoComplete="off"
+        >
+          <Form.Item
+            label="旧密码"
+            name="oldPassword"
+            rules={[{ required: true, message: "不能为空!" }]}
+          >
+            <Input.Password maxLength={15} />
+          </Form.Item>
+
+          <Form.Item
+            label="新密码"
+            name="newPassword"
+            rules={[
+              { required: true, message: "不能为空!" },
+              { min: 6, max: 15, message: "密码长度为6-15个字符!" },
+            ]}
+          >
+            <Input.Password
+              maxLength={15}
+              onChange={(e) => (oldPasswordValue.current = e.target.value)}
+            />
+          </Form.Item>
+
+          <Form.Item
+            label="确定新密码"
+            name="checkPass"
+            rules={[{ validator: checkPassWord }]}
+          >
+            <Input.Password maxLength={15} />
+          </Form.Item>
+
+          <Form.Item wrapperCol={{ offset: 14, span: 16 }}>
+            <Button onClick={() => setOpen(false)}>取消</Button>
+            &emsp;
+            <Button type="primary" htmlType="submit">
+              确定
+            </Button>
+          </Form.Item>
+        </Form>
+      </Modal>
+    </div>
+  );
+}
+
+// 使用 React.memo 来优化组件，避免组件的无效更新，类似 类组件里面的PureComponent
+const MemoLayout = React.memo(Layout);
+export default MemoLayout;

backstage/src/pages/Login/index.module.scss

@@ -0,0 +1,137 @@
+.Login {
+  width: 100%;
+  height: 100%;
+  background-image: url('../../assets/img/loginBg.jpg');
+  background-size: cover;
+  position: relative;
+  position: relative;
+
+  &::before {
+    content: '';
+    position: absolute;
+    z-index: 9;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background-color: rgba(0, 0, 0, .7);
+  }
+
+
+  :global {
+    .main {
+      z-index: 10;
+      position: absolute;
+      top: 48%;
+      left: 50%;
+      transform: translate(-50%, -50%);
+      width: 400px;
+      text-align: center;
+
+      &>h3 {
+        font-size: 24px;
+        letter-spacing: 6px;
+        color: #fff;
+      }
+
+      .inputBox {
+        width: 100%;
+
+        input::-webkit-input-placeholder {
+          /* WebKit browsers */
+          color: rgba(255, 255, 255, .5);
+        }
+
+        input:-moz-placeholder {
+          /* Mozilla Firefox 4 to 18 */
+          color: rgba(255, 255, 255, .5);
+        }
+
+        input::-moz-placeholder {
+          /* Mozilla Firefox 19+ */
+          color: rgba(255, 255, 255, .5);
+        }
+
+        input:-ms-input-placeholder {
+          /* Internet Explorer 10+ */
+          color: rgba(255, 255, 255, .5);
+        }
+
+
+        .inputBoxRow {
+          margin-top: 30px;
+
+          .ant-input-suffix .ant-input-password-icon {
+            color: #fff;
+            font-size: 22px;
+          }
+        }
+
+        .ant-input-prefix {
+          margin-right: 10px;
+
+          .anticon {
+            padding-right: 10px;
+            width: 36px;
+            height: 36px;
+
+            svg {
+              width: 100%;
+              height: 100%;
+            }
+          }
+        }
+
+        .ant-input {
+          color: #fff;
+          font-size: 18px;
+          width: 45%;
+          height: 60px;
+          line-height: 60px;
+          background-clip: content-box;
+        }
+
+        input:-webkit-autofill {
+          font-size: 18px !important;
+          -webkit-text-fill-color: #fff !important;
+          background-image: none;
+          -webkit-box-shadow: 0 0 0px 1000px transparent inset !important; //填充阴影，可以用来遮住背景色
+          background-color: transparent;
+          transition: background-color 50000s ease-in-out 0s; //背景色透明  生效时长  过渡效果  启用时延迟的时间
+
+        }
+
+        .ant-input-affix-wrapper {
+          background-color: transparent;
+          padding: 0 11px;
+          width: 100%;
+          height: 60px;
+          border: none;
+          border: 1px solid #fff;
+          color: #fff;
+
+          .ant-input {
+            background-color: transparent;
+            width: 100%;
+            height: 60px;
+          }
+        }
+
+        // .ant-input-affix-wrapper-focused {
+        //   box-shadow: none
+        // }
+      }
+
+      .loginBtn {
+        margin-top: 30px;
+
+        .ant-btn {
+          width: 100%;
+          font-size: 20px;
+          height: 50px;
+        }
+      }
+
+    }
+  }
+}

backstage/src/pages/Login/index.tsx

@@ -0,0 +1,78 @@
+import styles from "./index.module.scss";
+
+import { Input, Button } from "antd";
+import { UserOutlined, LockOutlined } from "@ant-design/icons";
+import { useState } from "react";
+import { Base64 } from "js-base64";
+import encodeStr from "@/utils/pass";
+import { setTokenInfo } from "@/utils/storage";
+import history from "@/utils/history";
+import { MessageFu } from "@/utils/message";
+import { userLoginAPI } from "@/store/action/layout";
+
+export default function Login() {
+  // 账号密码
+  const [userName, setUserName] = useState("admin");
+  const [passWord, setPassWord] = useState("");
+
+  // 键盘按下回车事件
+  const keyUpEntFu = (e: React.KeyboardEvent<HTMLInputElement>) => {
+    if (e.key === "Enter") loginClickFu();
+  };
+  // 点击登录
+  const loginClickFu = async () => {
+    // 非空判断
+    if (userName === "") return MessageFu.warning("请输入用户名!");
+    else if (passWord === "") return MessageFu.warning("请输入密码!");
+    const obj = {
+      userName,
+      passWord: encodeStr(Base64.encode(passWord)),
+    };
+    const res: any = await userLoginAPI(obj);
+    if (res.code === 0) {
+      MessageFu.success("登录成功");
+      // 用户信息存到本地
+      setTokenInfo(res.data);
+      history.push("/");
+    } else if (res.code === 3014)
+      MessageFu.warning("用户名不存在或密码错误，请联系管理员!");
+  };
+
+  return (
+    <div className={styles.Login}>
+      <div className="main">
+        <h3>unity本地大场景管理</h3>
+        {/* 账号密码输入框 */}
+        <div className="inputBox">
+          <div className="inputBoxRow">
+            <Input
+              onKeyUp={(e) => keyUpEntFu(e)}
+              value={userName}
+              onChange={(e) => setUserName(e.target.value.trim())}
+              prefix={<UserOutlined />}
+              placeholder="请输入用户名"
+              maxLength={15}
+            />
+          </div>
+          <div className="inputBoxRow">
+            <Input.Password
+              onKeyUp={(e) => keyUpEntFu(e)}
+              value={passWord}
+              onChange={(e) => setPassWord(e.target.value.trim())}
+              prefix={<LockOutlined />}
+              placeholder="请输入用户密码"
+              maxLength={15}
+            />
+          </div>
+        </div>
+
+        {/* 登录按钮 */}
+        <div className="loginBtn">
+          <Button type="primary" size="large" onClick={loginClickFu}>
+            登 录
+          </Button>
+        </div>
+      </div>
+    </div>
+  );
+}

backstage/src/pages/初始化组件/index.module.scss

@@ -0,0 +1,6 @@
+.AAAAA{
+  background-color: aqua;
+  :global{
+    background-color: red;
+  }
+}

backstage/src/pages/初始化组件/index.tsx

@@ -0,0 +1,14 @@
+import React from "react";
+import styles from "./index.module.scss";
+ function AAAAA() {
+  
+  return (
+    <div className={styles.AAAAA}>
+      <h1>AAAAA</h1>
+    </div>
+  )
+}
+
+const MemoAAAAA = React.memo(AAAAA);
+
+export default MemoAAAAA;

backstage/src/store/action/A1List.ts

@@ -0,0 +1,25 @@
+import http from "@/utils/http";
+import { AppDispatch } from "..";
+/**
+ * 获取用户管理表格列表
+ */
+export const A1_APIgetList = (data: any) => {
+  return async (dispatch: AppDispatch) => {
+    const res = await http.post("cms/scene/list", data);
+    if (res.code === 0) {
+      const obj = {
+        list: res.data.records,
+        total: res.data.total,
+      };
+
+      dispatch({ type: "A1/getList", payload: obj });
+    }
+  };
+};
+
+/**
+ * 删除
+ */
+export const A1_APIdel = (id: number) => {
+  return http.get(`cms/scene/removes/${id}`);
+};

backstage/src/store/action/A9User.ts

@@ -0,0 +1,54 @@
+import { SaveUserType, UserTableAPIType } from "@/types";
+import http from "@/utils/http";
+import { AppDispatch } from "..";
+/**
+ * 获取用户管理表格列表
+ */
+export const A9API_getUserListAPI = (data: UserTableAPIType) => {
+  return async (dispatch: AppDispatch) => {
+    const res = await http.post("sys/user/list", data);
+    if (res.code === 0) {
+      const obj = {
+        list: res.data.records,
+        total: res.data.total,
+      };
+
+      dispatch({ type: "user/getList", payload: obj });
+    }
+  };
+};
+
+/**
+ * 用户-是否显示
+ */
+export const A9API_userDisplayAPI = (id: number, display: number) => {
+  return http.get(`sys/user/editStatus/${id}/${display}`);
+};
+
+/**
+ * 删除用户
+ */
+export const A9API_userRemoveAPI = (id: number) => {
+  return http.get(`sys/user/removes/${id}`);
+};
+
+/**
+ * 重置密码
+ */
+export const A9API_userPassResetAPI = (id: number) => {
+  return http.get(`sys/user/resetPass/${id}`);
+};
+
+/**
+ * 新增/修改用户信息
+ */
+export const A9API_userSaveAPI = (data: SaveUserType) => {
+  return http.post("sys/user/save", data);
+};
+
+/**
+ * 通过id获取角色详情
+ */
+export const A9API_getUserInfoByIdAPI = (id: number) => {
+  return http.get(`sys/user/detail/${id}`);
+};

backstage/src/store/action/layout.ts

@@ -0,0 +1,17 @@
+import http from "@/utils/http";
+// import { AppDispatch } from "..";
+
+/**
+ * 用户登录接口
+ */
+export const userLoginAPI = (data: any) => {
+  return http.post("admin/login", { ...data });
+};
+
+/**
+ * 修改密码接口
+ */
+export const passWordEditAPI = (data: any) => {
+  return http.post("sys/user/updatePwd", { ...data });
+};
+

backstage/src/store/index.ts

@@ -0,0 +1,20 @@
+// 导入 redux
+import { applyMiddleware, legacy_createStore as createStore } from 'redux'
+// 导入自己封装的  rootReducer 
+import rootReducer from './reducer'
+// 导入调试工具和 异步的 redux（用来发送异步请求）
+// 调试工具需要下载谷歌 扩展程序 我用的是 Redux DevTools 3.0.17
+import { composeWithDevTools } from 'redux-devtools-extension'
+import thunk from 'redux-thunk'
+
+// 创建仓库实例
+const store = createStore(rootReducer, composeWithDevTools(applyMiddleware(thunk)))
+
+// 声明 RootState，在使用仓库的时候用来使用
+export type RootState = ReturnType<typeof store.getState>
+
+// 声明 AppDispatch，在异步请求的时候来使用
+export type AppDispatch = typeof store.dispatch
+
+// 导出仓库实例
+export default store

backstage/src/store/reducer/A1List.ts

@@ -0,0 +1,27 @@
+import { A1tableType } from "@/types";
+
+// 初始化状态
+const initState = {
+  // 列表数据
+  tableInfo: {
+    list: [] as A1tableType[],
+    total: 0,
+  },
+};
+
+// 定义 action 类型
+type Props = {
+  type: "A1/getList";
+  payload: { list: A1tableType[]; total: number };
+};
+
+// 频道 reducer
+export default function reducerFu(state = initState, action: Props) {
+  switch (action.type) {
+    // 获取列表数据
+    case "A1/getList":
+      return { ...state, tableInfo: action.payload };
+    default:
+      return state;
+  }
+}

backstage/src/store/reducer/A9User.ts

@@ -0,0 +1,27 @@
+import { UserTableListType } from "@/types";
+
+// 初始化状态
+const initState = {
+  // 列表数据
+  tableInfo: {
+    list: [] as UserTableListType[],
+    total: 0,
+  },
+};
+
+// 定义 action 类型
+type Props = {
+  type: "user/getList";
+  payload: { list: UserTableListType[]; total: number };
+};
+
+// 频道 reducer
+export default function reducerFu(state = initState, action: Props) {
+  switch (action.type) {
+    // 获取列表数据
+    case "user/getList":
+      return { ...state, tableInfo: action.payload };
+    default:
+      return state;
+  }
+}

backstage/src/store/reducer/index.ts

@@ -0,0 +1,16 @@
+import { combineReducers } from "redux";
+
+import A0layout from "./layout";
+import A1List from "./A1List";
+
+import A9User from "./A9User";
+
+// 合并 reducer
+const rootReducer = combineReducers({
+  A0layout,
+  A1List,
+  A9User,
+});
+
+// 默认导出
+export default rootReducer;

backstage/src/store/reducer/layout.ts

@@ -0,0 +1,39 @@
+import { MessageType } from "@/utils/message";
+
+type CloseUpFileType = {
+  fu: () => void;
+  state: boolean;
+};
+
+// 初始化状态
+const initState = {
+  message: {
+    txt: "",
+    type: "info",
+    duration: 3,
+  } as MessageType,
+  // 上传文件点击取消
+  closeUpFile: {
+    fu: () => {},
+    state: false,
+  },
+};
+
+// 定义 action 类型
+type Props =
+  | { type: "layout/message"; payload: MessageType }
+  | { type: "layout/closeUpFile"; payload: CloseUpFileType };
+
+// 频道 reducer
+export default function layoutReducer(state = initState, action: Props) {
+  switch (action.type) {
+    // antd轻提示(兼容360浏览器)
+    case "layout/message":
+      return { ...state, message: action.payload };
+    // 上传文件点击取消
+    case "layout/closeUpFile":
+      return { ...state, closeUpFile: action.payload };
+    default:
+      return state;
+  }
+}

backstage/src/types/api/A1List.d.ts

@@ -0,0 +1,13 @@
+export type A1tableType = {
+  createTime: string;
+  creatorName: string;
+  display: number;
+  id: number;
+  name: string;
+  path: string;
+  sceneCode: string;
+  star: number;
+  updateTime: string;
+  visit: number;
+  webSite: string;
+};

backstage/src/types/api/A9User.d.ts

@@ -0,0 +1,33 @@
+export type UserTableAPIType={
+  pageNum:number
+  pageSize:number
+  realName:string
+}
+
+export type UserTableListType={
+  createTime: string;
+  creatorId: null;
+  creatorName: string;
+  id: number;
+  isAdmin: number;
+  isEnabled: number;
+  nickName: string;
+  phone: string;
+  realName: string;
+  roleId: null;
+  roleName: string;
+  sex: string;
+  thumb: string;
+  updateTime: string;
+  userName: string;
+}
+
+export type SaveUserType ={
+  id:number|null
+  userName:string
+  nickName:string
+  roleId:number
+  realName:string
+  modulePerms:string
+  exhibitionIds:string
+}

backstage/src/types/declaration.d.ts

@@ -0,0 +1,6 @@
+declare module "history";
+declare module "*.scss";
+declare module "*.png";
+declare module "*.jpg";
+declare module "*.gif";
+declare module "js-export-excel";

backstage/src/types/index.d.ts

@@ -0,0 +1,3 @@
+export * from './api/A1List'
+export * from './api/A9User'
+

backstage/src/utils/dataChange.ts

@@ -0,0 +1,8 @@
+export const A1DataChangeObj ={
+  'visit_hot':'热点访问量',
+  'visit_product':'产品手册下载量',
+  'visit_questionnaire':'收集问卷',
+  'visit_scene':'线上展厅访问量',
+  'visit_user':'访客量',
+  'visit_zone':'导航区域访问量',
+}

backstage/src/utils/domShow.ts

@@ -0,0 +1,35 @@
+import store from "@/store";
+
+// 加载和上传的盒子的显示隐藏
+export const domShowFu = (ele: string, val: boolean) => {
+  const dom: HTMLDivElement = document.querySelector(ele)!;
+  if (val) {
+    dom.style.opacity = "1";
+    dom.style.pointerEvents = "auto";
+  } else {
+    dom.style.opacity = "0";
+    dom.style.pointerEvents = "none";
+  }
+};
+
+// 上传附件的进度条
+let progressDom: HTMLDivElement = document.querySelector("#progress")!;
+export const progressDomFu = (val: string) => {
+  if (!progressDom) progressDom = document.querySelector("#progress")!;
+  progressDom.style.width = val;
+};
+
+// 上传附件的dom操作
+export const fileDomInitialFu = () => {
+  // 隐藏进度条的dom
+  domShowFu("#UpAsyncLoding", false);
+  progressDomFu("0%");
+  // 初始化 上传附件 的状态
+  setTimeout(() => {
+    if (store.getState().A0layout.closeUpFile.state)
+      store.dispatch({
+        type: "layout/closeUpFile",
+        payload: { fu: () => {}, state: false },
+      });
+  }, 200);
+};

backstage/src/utils/history.ts

@@ -0,0 +1,17 @@
+import { createHashHistory  } from 'history'
+const history = createHashHistory()
+export default history
+
+export const urlParameter = (data: string) => {
+  if (data) {
+    const query = data.substring(data.indexOf("?") + 1);
+    const arr = query.split("&");
+    const params = {} as any;
+    arr.forEach((v) => {
+      const key = v.substring(0, v.indexOf("="));
+      const val = v.substring(v.indexOf("=") + 1);
+      params[key] = val;
+    });
+    return params;
+  } else return {};
+};

backstage/src/utils/http.ts

@@ -0,0 +1,93 @@
+import axios from "axios";
+import history from "./history";
+import { getTokenInfo, removeTokenInfo } from "./storage";
+import store from "@/store";
+import { MessageFu } from "./message";
+import { domShowFu } from "./domShow";
+// 请求基地址
+export const baseURL =
+  // 线下的图片地址需要加上/api/
+  // process.env.NODE_ENV === "development"
+  //   ? "http://192.168.20.55:8045/api/"
+  //   : "";
+  process.env.NODE_ENV === "development" ? "https://sit-locbigsecen.4dage.com" : "";
+
+// 处理  类型“AxiosResponse<any, any>”上不存在属性“code”
+declare module "axios" {
+  interface AxiosResponse {
+    code: number;
+    // 这里追加你的参数
+  }
+}
+
+// 创建 axios 实例
+const http = axios.create({
+  // --------线下的地址不用加/api/
+  // baseURL: baseURL,
+
+  // --------打包或线上环境接口需要加上api/
+  baseURL: baseURL + "/api/",
+  timeout: 5000,
+});
+
+let axajInd = 0;
+
+// 请求拦截器
+http.interceptors.request.use(
+  function (config: any) {
+    // 发请求前打开加载提示
+    domShowFu("#AsyncSpinLoding", true);
+
+    axajInd++;
+
+    const { token } = getTokenInfo();
+    if (token) config.headers.token = token;
+    return config;
+  },
+  function (err) {
+    return Promise.reject(err);
+  }
+);
+
+let timeId = -1;
+
+// 响应拦截器
+http.interceptors.response.use(
+  function (response) {
+    // 请求回来的关闭加载提示
+    axajInd--;
+    if (axajInd === 0) {
+      domShowFu("#AsyncSpinLoding", false);
+    }
+    if (response.data.code === 5001 || response.data.code === 5002) {
+      clearTimeout(timeId);
+      timeId = window.setTimeout(() => {
+        removeTokenInfo();
+        MessageFu.warning("登录失效!");
+        history.push("/login");
+      }, 200);
+    } else if (response.data.code === 0) {
+      // MessageFu.success(response.data.msg);
+    } else MessageFu.warning(response.data.msg);
+
+    return response.data;
+  },
+  async function (err) {
+    clearTimeout(timeId);
+    timeId = window.setTimeout(() => {
+      axajInd = 0;
+      domShowFu("#AsyncSpinLoding", false);
+      // 如果因为网络原因，response没有，给提示消息
+      if (!err.response) {
+        if (store.getState().A0layout.closeUpFile.state)
+          MessageFu.warning("取消上传!");
+        else MessageFu.error("网络繁忙，请稍后重试!");
+      } else MessageFu.error("响应错误，请联系管理员!");
+    }, 100);
+
+    return Promise.reject(err);
+  }
+);
+
+// 导出 axios 实例
+export default http;

backstage/src/utils/message.ts

@@ -0,0 +1,50 @@
+import store from "@/store";
+
+export type MessageType = {
+  txt: string;
+  type: "info" | "success" | "error" | "warning";
+  duration: number;
+};
+
+export const MessageFu = {
+  info: (txt: string, duration?: number) => {
+    store.dispatch({
+      type: "layout/message",
+      payload: {
+        txt,
+        type: "info",
+        duration: duration === undefined ? 3 : duration,
+      },
+    });
+  },
+  success: (txt: string, duration?: number) => {
+    store.dispatch({
+      type: "layout/message",
+      payload: {
+        txt,
+        type: "success",
+        duration: duration === undefined ? 3 : duration,
+      },
+    });
+  },
+  error: (txt: string, duration?: number) => {
+    store.dispatch({
+      type: "layout/message",
+      payload: {
+        txt,
+        type: "error",
+        duration: duration === undefined ? 3 : duration,
+      },
+    });
+  },
+  warning: (txt: string, duration?: number) => {
+    store.dispatch({
+      type: "layout/message",
+      payload: {
+        txt,
+        type: "warning",
+        duration: duration === undefined ? 3 : duration,
+      },
+    });
+  },
+};

backstage/src/utils/pass.ts

@@ -0,0 +1,100 @@
+function randomWord(randomFlag: boolean, min: number, max: number = 15) {
+  let str = "";
+  let range = min;
+  const arr = [
+    "0",
+    "1",
+    "2",
+    "3",
+    "4",
+    "5",
+    "6",
+    "7",
+    "8",
+    "9",
+    "a",
+    "b",
+    "c",
+    "d",
+    "e",
+    "f",
+    "g",
+    "h",
+    "i",
+    "j",
+    "k",
+    "l",
+    "m",
+    "n",
+    "o",
+    "p",
+    "q",
+    "r",
+    "s",
+    "t",
+    "u",
+    "v",
+    "w",
+    "x",
+    "y",
+    "z",
+    "A",
+    "B",
+    "C",
+    "D",
+    "E",
+    "F",
+    "G",
+    "H",
+    "I",
+    "J",
+    "K",
+    "L",
+    "M",
+    "N",
+    "O",
+    "P",
+    "Q",
+    "R",
+    "S",
+    "T",
+    "U",
+    "V",
+    "W",
+    "X",
+    "Y",
+    "Z",
+  ];
+  // 随机产生
+  if (randomFlag) {
+    range = Math.round(Math.random() * (max - min)) + min;
+  }
+  for (var i = 0; i < range; i++) {
+    const pos = Math.round(Math.random() * (arr.length - 1));
+    str += arr[pos];
+  }
+  return str;
+}
+
+const encodeStr = (str: string, strv = "") => {
+  const NUM = 2;
+  const front = randomWord(false, 8);
+  const middle = randomWord(false, 8);
+  const end = randomWord(false, 8);
+
+  const str1 = str.substring(0, NUM);
+  const str2 = str.substring(NUM);
+
+  if (strv) {
+    const strv1 = strv.substring(0, NUM);
+    const strv2 = strv.substring(NUM);
+    return [
+      front + str2 + middle + str1 + end,
+      front + strv2 + middle + strv1 + end,
+    ];
+  }
+
+  return front + str2 + middle + str1 + end;
+};
+
+export default encodeStr;

backstage/src/utils/pcOrH5.ts

@@ -0,0 +1,17 @@
+export const isH5Fu = () => {
+  if (
+    window.navigator.userAgent.match(
+      /(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i
+    )
+  )
+    return true;
+  else return false;
+};
+
+export const isWeiFu = () => {
+  const ua: any = window.navigator.userAgent.toLowerCase();
+
+  // eslint-disable-next-line eqeqeq
+  if (ua.match(/MicroMessenger/i) == "micromessenger") return true;
+  else return false;
+};

backstage/src/utils/storage.ts

@@ -0,0 +1,34 @@
+// ------------------------------------token的本地存储------------------------------------
+
+// 用户 Token 的本地缓存键名，自己定义
+const TOKEN_KEY = 'UNITYSCENE_HT_USER_INFO'
+
+/**
+ * 从本地缓存中获取 Token 信息
+ */
+export const getTokenInfo = (): any => {
+  return JSON.parse(localStorage.getItem(TOKEN_KEY) || '{}')
+}
+
+/**
+ * 将 Token 信息存入缓存
+ * @param {Object} tokenInfo 从后端获取到的 Token 信息
+ */
+export const setTokenInfo = (tokenInfo: any): void => {
+  localStorage.setItem(TOKEN_KEY, JSON.stringify(tokenInfo))
+}
+
+/**
+ * 删除本地缓存中的 Token 信息
+ */
+export const removeTokenInfo = (): void => {
+  localStorage.removeItem(TOKEN_KEY)
+}
+
+/**
+ * 判断本地缓存中是否存在 Token 信息
+ */
+export const hasToken = (): boolean => {
+  return Boolean(getTokenInfo().token)
+}
+

backstage/tsconfig.json

@@ -0,0 +1,27 @@
+{
+  "extends": "./path.tsconfig.json",
+  "compilerOptions": {
+    "target": "es5",
+    "lib": [
+      "dom",
+      "dom.iterable",
+      "esnext"
+    ],
+    "allowJs": true,
+    "skipLibCheck": true,
+    "esModuleInterop": true,
+    "allowSyntheticDefaultImports": true,
+    "strict": true,
+    "forceConsistentCasingInFileNames": true,
+    "noFallthroughCasesInSwitch": true,
+    "module": "esnext",
+    "moduleResolution": "node",
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "noEmit": true,
+    "jsx": "react-jsx"
+  },
+  "include": [
+    "src"
+  ]
+}

scene/css/cropper.min.css

@@ -0,0 +1,252 @@
+/*!
+ * Cropper v3.1.3
+ * https://github.com/fengyuanchen/cropper
+ *
+ * Copyright (c) 2014-2017 Chen Fengyuan
+ * Released under the MIT license
+ *
+ * Date: 2017-10-21T10:03:37.133Z
+ */.cropper-container {
+ direction:ltr;
+ font-size:0;
+ line-height:0;
+ position:relative;
+ -ms-touch-action:none;
+ touch-action:none;
+ -webkit-user-select:none;
+ -moz-user-select:none;
+ -ms-user-select:none;
+ user-select:none
+}
+.cropper-container img {
+ display:block;
+ height:100%;
+ image-orientation:0deg;
+ max-height:none!important;
+ max-width:none!important;
+ min-height:0!important;
+ min-width:0!important;
+ width:100%
+}
+.cropper-canvas,.cropper-crop-box,.cropper-drag-box,.cropper-modal,.cropper-wrap-box {
+ bottom:0;
+ left:0;
+ position:absolute;
+ right:0;
+ top:0
+}
+.cropper-canvas,.cropper-wrap-box {
+ overflow:hidden
+}
+.cropper-drag-box {
+ background-color:#fff;
+ opacity:0
+}
+.cropper-modal {
+ background-color:#000;
+ opacity:.5
+}
+.cropper-view-box {
+ display:block;
+ height:100%;
+ outline-color:rgba(51,153,255,.75);
+ outline:1px solid #39f;
+ overflow:hidden;
+ width:100%
+}
+.cropper-dashed {
+ border:0 dashed #eee;
+ display:block;
+ opacity:.5;
+ position:absolute
+}
+.cropper-dashed.dashed-h {
+ border-bottom-width:1px;
+ border-top-width:1px;
+ height:33.33333%;
+ left:0;
+ top:33.33333%;
+ width:100%
+}
+.cropper-dashed.dashed-v {
+ border-left-width:1px;
+ border-right-width:1px;
+ height:100%;
+ left:33.33333%;
+ top:0;
+ width:33.33333%
+}
+.cropper-center {
+ display:block;
+ height:0;
+ left:50%;
+ opacity:.75;
+ position:absolute;
+ top:50%;
+ width:0
+}
+.cropper-center:after,.cropper-center:before {
+ background-color:#eee;
+ content:" ";
+ display:block;
+ position:absolute
+}
+.cropper-center:before {
+ height:1px;
+ left:-3px;
+ top:0;
+ width:7px
+}
+.cropper-center:after {
+ height:7px;
+ left:0;
+ top:-3px;
+ width:1px
+}
+.cropper-face,.cropper-line,.cropper-point {
+ display:block;
+ height:100%;
+ opacity:.1;
+ position:absolute;
+ width:100%
+}
+.cropper-face {
+ background-color:#fff;
+ left:0;
+ top:0
+}
+.cropper-line {
+ background-color:#39f
+}
+.cropper-line.line-e {
+ cursor:e-resize;
+ right:-3px;
+ top:0;
+ width:5px
+}
+.cropper-line.line-n {
+ cursor:n-resize;
+ height:5px;
+ left:0;
+ top:-3px
+}
+.cropper-line.line-w {
+ cursor:w-resize;
+ left:-3px;
+ top:0;
+ width:5px
+}
+.cropper-line.line-s {
+ bottom:-3px;
+ cursor:s-resize;
+ height:5px;
+ left:0
+}
+.cropper-point {
+ background-color:#39f;
+ height:5px;
+ opacity:.75;
+ width:5px
+}
+.cropper-point.point-e {
+ cursor:e-resize;
+ margin-top:-3px;
+ right:-3px;
+ top:50%
+}
+.cropper-point.point-n {
+ cursor:n-resize;
+ left:50%;
+ margin-left:-3px;
+ top:-3px
+}
+.cropper-point.point-w {
+ cursor:w-resize;
+ left:-3px;
+ margin-top:-3px;
+ top:50%
+}
+.cropper-point.point-s {
+ bottom:-3px;
+ cursor:s-resize;
+ left:50%;
+ margin-left:-3px
+}
+.cropper-point.point-ne {
+ cursor:ne-resize;
+ right:-3px;
+ top:-3px
+}
+.cropper-point.point-nw {
+ cursor:nw-resize;
+ left:-3px;
+ top:-3px
+}
+.cropper-point.point-sw {
+ bottom:-3px;
+ cursor:sw-resize;
+ left:-3px
+}
+.cropper-point.point-se {
+ bottom:-3px;
+ cursor:se-resize;
+ height:20px;
+ opacity:1;
+ right:-3px;
+ width:20px
+}
+@media (min-width:768px) {
+ .cropper-point.point-se {
+  height:15px;
+  width:15px
+ }
+}
+@media (min-width:992px) {
+ .cropper-point.point-se {
+  height:10px;
+  width:10px
+ }
+}
+@media (min-width:1200px) {
+ .cropper-point.point-se {
+  height:5px;
+  opacity:.75;
+  width:5px
+ }
+}
+.cropper-point.point-se:before {
+ background-color:#39f;
+ bottom:-50%;
+ content:" ";
+ display:block;
+ height:200%;
+ opacity:0;
+ position:absolute;
+ right:-50%;
+ width:200%
+}
+.cropper-invisible {
+ opacity:0
+}
+.cropper-bg {
+ background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAAA3NCSVQICAjb4U/gAAAABlBMVEXMzMz////TjRV2AAAACXBIWXMAAArrAAAK6wGCiw1aAAAAHHRFWHRTb2Z0d2FyZQBBZG9iZSBGaXJld29ya3MgQ1M26LyyjAAAABFJREFUCJlj+M/AgBVhF/0PAH6/D/HkDxOGAAAAAElFTkSuQmCC")
+}
+.cropper-hide {
+ display:block;
+ height:0;
+ position:absolute;
+ width:0
+}
+.cropper-hidden {
+ display:none!important
+}
+.cropper-move {
+ cursor:move
+}
+.cropper-crop {
+ cursor:crosshair
+}
+.cropper-disabled .cropper-drag-box,.cropper-disabled .cropper-face,.cropper-disabled .cropper-line,.cropper-disabled .cropper-point {
+ cursor:not-allowed
+}
+/*# sourceMappingURL=cropper.min.css.map */

scene/css/diyUpload.css

@@ -0,0 +1,129 @@
+@charset "utf-8";
+/* CSS Document*/
+.parentFileBox {
+	width:auto;
+	height:auto;
+	overflow:hidden;
+	position:relative;
+}
+.parentFileBox>.fileBoxUl {
+	position:relative;
+	width:100%;
+	height:auto;
+	overflow:hidden;
+	padding-bottom:5px;
+}
+.parentFileBox>.fileBoxUl>li {
+	float:left;
+	border:1px solid #09F;
+	border-radius:5px;
+	width:95px;
+	height:95px;
+	margin-top:5px;
+	margin-left:5px;
+	overflow:hidden;
+	position:relative;
+	background-color:#099;
+}
+.parentFileBox>.fileBoxUl>li>.viewThumb {
+	position:absolute;
+	top:0;
+	left:0;
+	width:95px;
+	height:95px;
+	overflow:hidden;
+}
+.parentFileBox>.fileBoxUl>li>.viewThumb>img {
+	width:100%;
+	height:100%;
+}
+.parentFileBox>.fileBoxUl>li>.diyCancel,.parentFileBox>.fileBoxUl>li>.diySuccess {
+	position:absolute;
+	width:20px;
+	height:20px;
+	top:2px;
+	right:2px;
+	cursor:pointer;
+	display:none;
+	background-size: 100% !important; 
+}
+.parentFileBox>.fileBoxUl>li>.diyCancel {
+	background:url(../images/edit/x_alt.png) left top no-repeat;
+}
+.parentFileBox>.fileBoxUl>li>.diySuccess {
+	background:url(../images/edit/check_alt.png)  left top  no-repeat;
+	cursor:default;
+}
+.parentFileBox>.fileBoxUl>li>.diyFileName {
+	position:absolute;
+	bottom:0px;
+	left:0px;
+	width:100%;
+	height:15px;
+	line-height:15px;
+	text-align:center;
+	color:#fff;
+	font-size:12px;
+	display:none;
+	background:url(../images/edit/bgblack.png);
+}
+.parentFileBox>.fileBoxUl>li>.diyBar {
+	top:0;
+	left:0;
+	position: absolute;
+	width: 95px;
+	height: 95px;
+	line-height:150px;
+	background:url(../images/edit/bgblack.png);
+	display:none;
+}
+.parentFileBox>.fileBoxUl>li>.diyBar>.diyProgressText {
+	font-size:14px;
+	text-align:center;
+	color:#FFF;
+	position:relative;
+	z-index:99;
+}
+.parentFileBox>.fileBoxUl>li>.diyBar>.diyProgress {
+	position:absolute;
+	left:0;
+	top:42%;
+	height:24px;
+	width:100%;
+	background-color:#09F;
+	filter:alpha(opacity=70);
+	-moz-opacity:0.7;
+	opacity:0.7;
+	z-index:97;
+}
+.parentFileBox>.diyButton {
+	width:100%;
+	margin-top:5px;
+	margin-bottom:5px;
+	height:20px;
+	line-height:20px;
+	text-align:center;
+}
+.parentFileBox>.diyButton>a {
+	padding:5px 10px 5px 10px;
+	background-color:#09C;
+	color:#FFF;
+	font-size:12px;
+	text-decoration:none;
+	border-radius:3px;
+}
+.parentFileBox>.diyButton>a:hover {
+	background-color:#0CC;
+	color:#F30;
+}
+.parentFileBox>.fileBoxUl>li:hover {
+	-moz-box-shadow: 3px 3px 4px #ccc;
+	-webkit-box-shadow: 3px 3px 4px #ccc;
+	box-shadow: 3px 3px 4px #ccc;
+}
+.parentFileBox>.fileBoxUl>.diyUploadHover:hover .diyCancel {
+	display:block;
+}
+.parentFileBox>.fileBoxUl>li:hover .diyFileName {
+	display:block;
+}

scene/css/oldVer/main0.css

@@ -0,0 +1,222 @@
+.sidecontent{position:fixed;left:-750px;width:auto;display:none;background:rgba(0,0,0,0.8);top:70px;height: 100%;color: rgba(255,255,255,1);}
+.sidecontent h1{font-size:14px;width:90%;margin:0px auto;text-align:center;height:50px;line-height:50px;position:relative;}
+.sidecontent h1 span{font-size:12px;font-weight:normal;position:absolute;right:-10px;cursor:pointer;border:#ebebeb solid 1px;width:40px;height:40px;line-height:40px;border-radius:20px;text-align:center;}
+#text
+{
+    float:left;
+	width:auto;
+	font-size:18px;
+	letter-spacing:2px;
+	margin:30px;
+	max-width:600px;
+	height:500px;
+	max-height:630px;
+	line-height:22px;
+	font-family:"宋体";
+}
+#sideimg{margin:5px 20px 30px 10px;float:left;}
+
+#gui-modes-map div img
+{
+	width:48px;
+	height:48px;
+}
+
+ 
+
+iframe{
+	border: none;
+}
+
+
+#popup {
+ 
+	text-align: center;
+	padding: 0;
+	position: relative;
+	width: 100%;
+	height: 100%;
+	/* margin: 80px auto; */
+	display: none;
+	z-index: 999999;
+	background:  rgba(0,0,0,0.6);
+}
+.popup-content{
+	position: relative;
+	width: 100%;
+	height: 100%;
+	overflow: hidden;
+}
+#id1{ width: 100%; height: 100%;}
+#popup.wait{
+	opacity:0.1; 
+}
+#closepop {
+	background: url(../../images/close1.png) no-repeat;
+	width: 60px;
+	height: 60px;
+	cursor: pointer;
+	position: absolute;
+	right: 30px;
+	top: 30px;
+	text-indent: -999em;
+	background-size: 100% 100%;
+}
+.specialTitle{bottom:65%;
+    width: 100%;
+    padding: 0 25px;
+    display: block;
+    font-family: OpenSans,'Helvetica Neue',sans-serif;
+    text-align: center;
+    font-size: 40px;
+    font-weight: 100;
+    letter-spacing: .75px;
+    text-shadow: 0 0 10px rgba(15,16,17,1);
+    color: rgba(255,255,255,1);
+    margin: 0;
+    position: absolute;
+    hyphens: auto;
+    word-wrap: break-word;
+    line-height: 45px;}
+	.dropdown {position: relative;display: inline-block;float: right;height: 40px;line-height: 40px;right: 10px;}
+    .floor{ width: 100px;text-align: center;display: block;height: 30px;background: rgba(0,0,0,0.4);line-height: 30px;margin-top: 10px;cursor: pointer;}
+    .dropdown-content {display: none;position: absolute;background: rgba(0,0,0,0.6);min-width: 100px;box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);text-align:center;}
+    .dropdown:hover .dropdown-content {display: block;}
+    a{text-decoration:none;}
+	#YY,#SZZ{display:none;}
+ @media only screen and (max-width:487px){
+           .dropdown {height: 30px;line-height: 30px;right:5px;}
+           .floor {width: 80px;height: 20px;line-height: 20px;margin-top: 5px;}
+          .dropdown-content{min-width: 80px;}	
+           }
+@media screen and (max-width: 1600px) {
+ 
+	/*#popup {
+		width: 816px;
+		height: 510px;
+		margin: -255px auto auto -408px;
+	}*/
+	.specialTitle{
+	bottom:65%;
+    font-size: 34px;
+	}
+}
+
+@media screen and (max-width: 1400px) {
+ 
+	/*#popup {
+		width: 714px;
+		height: 446px;
+		margin: -223px auto auto -357px;
+	}*/
+	.specialTitle {
+    bottom: 65%;
+    font-size: 30px;
+    }
+}
+
+@media screen and (max-width: 1200px) {
+ 
+	#closepop{
+		width: 40px;
+		height: 40px;
+		top: 20px;
+		right: 20px;
+	}
+	.specialTitle {
+    bottom: 66%;
+    font-size: 26px;
+    }
+}
+ 
+@media screen and (max-width: 768px) {
+ 
+	.specialTitle {
+     bottom: 62%;
+     font-size: 26px;
+	 line-height:40px;
+    }
+	#special-gui-name{display:none;}
+}
+@media screen and  (max-width: 736px){
+
+	
+	#title-toggle{
+		padding-top: 18px;
+		height: 42px;
+	}
+
+
+	.pinTop{top:8px;}
+}
+@media screen and  (max-width:667px){
+	#closepop{
+		width: 36px;
+		height: 36px;
+		top: 0px;
+		right: 0px;
+	}
+
+	#title-toggle{
+		padding-top: 17px;
+		height: 40px;
+	}
+
+	#musicImg .fa-2x {
+        font-size: 1.5em;
+    }
+	.pinTop{top:8px;}
+
+}
+@media screen and  (max-width:568px){
+
+	
+	#title-toggle{
+		padding-top: 17px;
+		height: 38px;
+	}
+	
+	#musicImg .fa-2x {
+        font-size: 1.5em;
+    }
+	.pinTop{top:8px;}
+
+}
+@media screen and (max-width:414px) {
+
+	
+	#title-toggle{
+		padding-top: 17px;
+		height: 40px;
+	}
+	
+
+}
+@media screen and (max-width:375px) {
+
+	
+	#title-toggle{
+		padding-top: 17px;
+		height: 38px;
+	}
+
+	
+	.pinTop{top:5px;}	
+	
+}
+@media screen and (max-width:320px) {
+	/*#popup {
+		width: 200px;
+        height: 380px;
+        margin: -200px auto auto -100px;
+	}*/
+	
+	#title-toggle{
+		padding-top: 16px;
+		height: 36px;
+	}
+
+	
+	.pinTop{top:0px;}
+	
+}

scene/css/oldVer/main0.css.bak

@@ -0,0 +1,339 @@
+.sidecontent{position:fixed;left:-750px;width:auto;display:none;background:rgba(0,0,0,0.8);top:70px;height: 100%;color: rgba(255,255,255,1);}
+.sidecontent h1{font-size:14px;width:90%;margin:0px auto;text-align:center;height:50px;line-height:50px;position:relative;}
+.sidecontent h1 span{font-size:12px;font-weight:normal;position:absolute;right:-10px;cursor:pointer;border:#ebebeb solid 1px;width:40px;height:40px;line-height:40px;border-radius:20px;text-align:center;}
+#text
+{
+    float:left;
+	width:auto;
+	font-size:18px;
+	letter-spacing:2px;
+	margin:30px;
+	max-width:600px;
+	height:500px;
+	max-height:630px;
+	line-height:22px;
+	font-family:"宋体";
+}
+#sideimg{margin:5px 20px 30px 10px;float:left;}
+
+#gui-modes-map div img
+{
+	width:48px;
+	height:48px;
+}
+
+ 
+
+iframe{
+	border: none;
+}
+
+
+#popup {
+	z-index: 20;
+	text-align: center;
+	padding: 0;
+	position: absolute;
+	top: 50%;
+	left: 50%;
+	width: 960px;
+	height: 580px;
+	margin: -290px auto auto -480px;
+	display: none;
+	overflow-y: hidden;
+	transition: opacity 0.2s;
+	opacity: 1;
+}
+#popup.wait{
+	pointer-events:none;
+	opacity:0.1; 
+}
+#closepop {
+	background: url(../../images/close1.png) no-repeat;
+    width: 40px;
+    height: 40px;
+    cursor: pointer;
+    position: absolute;
+    right: 0px;
+    top: -3px;
+    text-indent: -999em;
+}
+.specialTitle{bottom:65%;
+    width: 100%;
+    padding: 0 25px;
+    display: block;
+    font-family: OpenSans,'Helvetica Neue',sans-serif;
+    text-align: center;
+    font-size: 40px;
+    font-weight: 100;
+    letter-spacing: .75px;
+    text-shadow: 0 0 10px rgba(15,16,17,1);
+    color: rgba(255,255,255,1);
+    margin: 0;
+    position: absolute;
+    hyphens: auto;
+    word-wrap: break-word;
+    line-height: 45px;}
+	.dropdown {position: relative;display: inline-block;float: right;height: 40px;line-height: 40px;right: 10px;}
+    .floor{ width: 100px;text-align: center;display: block;height: 30px;background: rgba(0,0,0,0.4);line-height: 30px;margin-top: 10px;cursor: pointer;}
+    .dropdown-content {display: none;position: absolute;background: rgba(0,0,0,0.6);min-width: 100px;box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);text-align:center;}
+    .dropdown:hover .dropdown-content {display: block;}
+    a{text-decoration:none;}
+	#YY,#SZZ{display:none;}
+ @media only screen and (max-width:487px){
+           .dropdown {height: 30px;line-height: 30px;right:5px;}
+           .floor {width: 80px;height: 20px;line-height: 20px;margin-top: 5px;}
+          .dropdown-content{min-width: 80px;}	
+           }
+@media screen and (max-width: 1600px) {
+ 
+	#popup {
+		width: 816px;
+		height: 510px;
+		margin: -255px auto auto -408px;
+	}
+	.specialTitle{
+	bottom:65%;
+    font-size: 34px;
+	}
+}
+
+@media screen and (max-width: 1400px) {
+ 
+	#popup {
+		width: 714px;
+		height: 446px;
+		margin: -223px auto auto -357px;
+	}
+	.specialTitle {
+    bottom: 65%;
+    font-size: 30px;
+    }
+}
+
+@media screen and (max-width: 1200px) {
+ 
+	#popup {
+		width: 700px;
+		height: 422px;
+		margin: -211px auto auto -350px;
+	}
+	.specialTitle {
+    bottom: 66%;
+    font-size: 26px;
+    }
+}
+
+/* @media screen and (max-width: 1024px) { */
+ 
+	/* #popup { */
+		/* width: 700px; */
+		/* height: 438px; */
+		/* margin: -219px auto auto -350px; */
+	/* } */
+/* } */
+@media screen and (max-width: 768px) {
+ 
+	#popup {
+		width:600px;
+		height:720px;
+		margin: -360px auto auto -300px;
+	}
+	.specialTitle {
+     bottom: 62%;
+     font-size: 26px;
+	 line-height:40px;
+    }
+	#special-gui-name{display:none;}
+}
+@media screen and (min-width:669px) and (max-width: 736px){
+	#popup {
+		width:500px;
+		height:260px;
+		margin: -130px auto auto -250px;
+	}
+	#closepop{
+		width: 32px;
+        height: 32px;
+		background-size: contain;
+		right: 0px;
+	}
+	#model-title{
+		height: 42px;
+	}
+	#title-toggle{
+		padding-top: 18px;
+		height: 42px;
+	}
+	.title-container{
+		padding: 16px 10px 6px;
+		height:42px;
+		width: 259px;
+	}
+	#gui-name{
+		font-size: 16px;
+		line-height:16px;
+	}
+	.pinTop{top:8px;}
+	#model-title {
+    width: 70%;
+}
+}
+@media screen and (min-width:569px) and (max-width:667px){
+	#popup {
+		width:420px;
+		height:230px;
+		margin: -115px auto auto -210px;
+	}
+	#closepop{
+		width: 30px;
+        height: 30px;
+		background-size: contain;
+		right: 0px;
+	}
+	#model-title{
+		height: 40px;
+	}
+	#title-toggle{
+		padding-top: 17px;
+		height: 40px;
+	}
+	.title-container{
+		padding: 16px 10px 6px;
+		height:40px;
+		width: 240px;
+	}
+	#gui-name{
+		font-size: 15px;
+		line-height:15px;
+	}
+	#musicImg .fa-2x {
+        font-size: 1.5em;
+    }
+	.pinTop{top:8px;}
+	#model-title {
+    width: 70%;
+}
+}
+@media screen and (min-width:447px) and (max-width:568px){
+	#popup {
+		width:340px;
+		height:170px;
+		margin: -85px auto auto -170px;
+	}
+	#closepop{
+		width: 30px;
+        height: 30px;
+		background-size: contain;
+		right: 0px;
+	}
+	#model-title{
+		height: 38px;
+	}
+	#title-toggle{
+		padding-top: 17px;
+		height: 38px;
+	}
+	.title-container{
+		padding: 16px 10px 6px;
+		height:38px;
+		width: 220px;
+	}
+	#gui-name{
+		font-size: 14px;
+		line-height:14px;
+	}
+	#musicImg .fa-2x {
+        font-size: 1.5em;
+    }
+	.pinTop{top:8px;}
+	#model-title {
+    width: 70%;
+}
+}
+@media screen and (max-width:414px) {
+	#popup {
+		width: 280px;
+        height: 520px;
+        margin: -260px auto auto -140px;
+	}
+	#closepop{
+		width: 30px;
+        height: 30px;
+		background-size: contain;
+		right: 0px;
+	}
+	#model-title{
+		height: 40px;
+	}
+	#title-toggle{
+		padding-top: 17px;
+		height: 40px;
+	}
+	.title-container{
+		padding: 16px 10px 6px;
+		height:40px;
+		width: 220px;
+	}
+	#gui-name{
+		font-size: 16px;
+		line-height:16px;
+	}
+	#model-title {
+    width: 70%;
+}
+}
+@media screen and (max-width:375px) {
+	#popup {
+		width: 252px;
+        height: 490px;
+        margin: -245px auto auto -126px;
+	}
+	#model-title{
+		height: 38px;
+	}
+	#title-toggle{
+		padding-top: 17px;
+		height: 38px;
+	}
+	.title-container{
+		padding: 16px 10px 6px;
+		height:38px;
+		width: 220px;
+	}
+	#gui-name{
+		font-size: 15px;
+		line-height:15px;
+	}
+	.pinTop{top:5px;}	
+	#model-title {
+    width: 70%;
+}
+}
+@media screen and (max-width:320px) {
+	#popup {
+		width: 200px;
+        height: 380px;
+        margin: -200px auto auto -100px;
+	}
+	#model-title{
+		height: 36px;
+	}
+	#title-toggle{
+		padding-top: 16px;
+		height: 36px;
+	}
+	.title-container{
+		padding: 16px 10px 6px;
+		height:36px;
+		width: 200px;
+	}
+	#gui-name{
+		font-size: 14px;
+		line-height:14px;
+	}
+	.pinTop{top:0px;}
+	#model-title {
+    width: 70%;
+}
+}

scene/css/oldVer/video-js.css

@@ -0,0 +1,770 @@
+/*!
+Video.js Default Styles (http://videojs.com)
+Version 4.5.1
+Create your own skin at http://designer.videojs.com
+*/
+/* SKIN
+================================================================================
+The main class name for all skin-specific styles. To make your own skin,
+replace all occurances of 'vjs-default-skin' with a new name. Then add your new
+skin name to your video tag instead of the default skin.
+e.g. <video class="video-js my-skin-name">
+*/
+.vjs-default-skin {
+  color: #cccccc;
+}
+/* Custom Icon Font
+--------------------------------------------------------------------------------
+The control icons are from a custom font. Each icon corresponds to a character
+(e.g. "\e001"). Font icons allow for easy scaling and coloring of icons.
+*/
+@font-face {
+  font-family: 'VideoJS';
+  src: url('font/vjs.eot');
+  src: url('font/vjs.eot?#iefix') format('embedded-opentype'), url('font/vjs.woff') format('woff'), url('font/vjs.ttf') format('truetype');
+  font-weight: normal;
+  font-style: normal;
+}
+/* Base UI Component Classes
+--------------------------------------------------------------------------------
+*/
+/* Slider - used for Volume bar and Seek bar */
+.vjs-default-skin .vjs-slider {
+  /* Replace browser focus hightlight with handle highlight */
+  outline: 0;
+  position: relative;
+  cursor: pointer;
+  padding: 0;
+  /* background-color-with-alpha */
+  background-color: #333333;
+  background-color: rgba(51, 51, 51, 0.9);
+}
+.vjs-default-skin .vjs-slider:focus {
+  /* box-shadow */
+  -webkit-box-shadow: 0 0 2em #ffffff;
+  -moz-box-shadow: 0 0 2em #ffffff;
+  box-shadow: 0 0 2em #ffffff;
+}
+.vjs-default-skin .vjs-slider-handle {
+  position: absolute;
+  /* Needed for IE6 */
+  left: 0;
+  top: 0;
+}
+.vjs-default-skin .vjs-slider-handle:before {
+  content: "\e009";
+  font-family: VideoJS;
+  font-size: 1em;
+  line-height: 1;
+  text-align: center;
+  text-shadow: 0em 0em 1em #fff;
+  position: absolute;
+  top: 0;
+  left: 0;
+  /* Rotate the square icon to make a diamond */
+  /* transform */
+  -webkit-transform: rotate(-45deg);
+  -moz-transform: rotate(-45deg);
+  -ms-transform: rotate(-45deg);
+  -o-transform: rotate(-45deg);
+  transform: rotate(-45deg);
+}
+/* Control Bar
+--------------------------------------------------------------------------------
+The default control bar that is a container for most of the controls.
+*/
+.vjs-default-skin .vjs-control-bar {
+  /* Start hidden */
+  display: none;
+  position: absolute;
+  /* Place control bar at the bottom of the player box/video.
+     If you want more margin below the control bar, add more height. */
+  bottom: 0;
+  /* Use left/right to stretch to 100% width of player div */
+  left: 0;
+  right: 0;
+  /* Height includes any margin you want above or below control items */
+  height: 3.0em;
+  /* background-color-with-alpha */
+  background-color: #07141e;
+  background-color: rgba(7, 20, 30, 0.7);
+}
+/* Show the control bar only once the video has started playing */
+.vjs-default-skin.vjs-has-started .vjs-control-bar {
+  display: block;
+  /* Visibility needed to make sure things hide in older browsers too. */
+
+  visibility: visible;
+  opacity: 1;
+  /* transition */
+  -webkit-transition: visibility 0.1s, opacity 0.1s;
+  -moz-transition: visibility 0.1s, opacity 0.1s;
+  -o-transition: visibility 0.1s, opacity 0.1s;
+  transition: visibility 0.1s, opacity 0.1s;
+}
+/* Hide the control bar when the video is playing and the user is inactive  */
+.vjs-default-skin.vjs-has-started.vjs-user-inactive.vjs-playing .vjs-control-bar {
+  display: block;
+  visibility: hidden;
+  opacity: 0;
+  /* transition */
+  -webkit-transition: visibility 1s, opacity 1s;
+  -moz-transition: visibility 1s, opacity 1s;
+  -o-transition: visibility 1s, opacity 1s;
+  transition: visibility 1s, opacity 1s;
+}
+.vjs-default-skin.vjs-controls-disabled .vjs-control-bar {
+  display: none;
+}
+.vjs-default-skin.vjs-using-native-controls .vjs-control-bar {
+  display: none;
+}
+/* IE8 is flakey with fonts, and you have to change the actual content to force
+fonts to show/hide properly.
+  - "\9" IE8 hack didn't work for this
+  - Found in XP IE8 from http://modern.ie. Does not show up in "IE8 mode" in IE9
+*/
+@media \0screen {
+  .vjs-default-skin.vjs-user-inactive.vjs-playing .vjs-control-bar :before {
+    content: "";
+  }
+}
+/* General styles for individual controls. */
+.vjs-default-skin .vjs-control {
+  outline: none;
+  position: relative;
+  float: left;
+  text-align: center;
+  margin: 0;
+  padding: 0;
+  height: 3.0em;
+  width: 4em;
+}
+/* FontAwsome button icons */
+.vjs-default-skin .vjs-control:before {
+  font-family: VideoJS;
+  font-size: 1.5em;
+  line-height: 2;
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  text-align: center;
+  text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
+}
+/* Replacement for focus outline */
+.vjs-default-skin .vjs-control:focus:before,
+.vjs-default-skin .vjs-control:hover:before {
+  text-shadow: 0em 0em 1em #ffffff;
+}
+.vjs-default-skin .vjs-control:focus {
+  /*  outline: 0; */
+  /* keyboard-only users cannot see the focus on several of the UI elements when
+  this is set to 0 */
+
+}
+/* Hide control text visually, but have it available for screenreaders */
+.vjs-default-skin .vjs-control-text {
+  /* hide-visually */
+  border: 0;
+  clip: rect(0 0 0 0);
+  height: 1px;
+  margin: -1px;
+  overflow: hidden;
+  padding: 0;
+  position: absolute;
+  width: 1px;
+}
+/* Play/Pause
+--------------------------------------------------------------------------------
+*/
+.vjs-default-skin .vjs-play-control {
+  width: 5em;
+  cursor: pointer;
+}
+.vjs-default-skin .vjs-play-control:before {
+  content: "\e001";
+}
+.vjs-default-skin.vjs-playing .vjs-play-control:before {
+  content: "\e002";
+}
+/* Volume/Mute
+-------------------------------------------------------------------------------- */
+.vjs-default-skin .vjs-mute-control,
+.vjs-default-skin .vjs-volume-menu-button {
+  cursor: pointer;
+  float: right;
+}
+.vjs-default-skin .vjs-mute-control:before,
+.vjs-default-skin .vjs-volume-menu-button:before {
+  content: "\e006";
+}
+.vjs-default-skin .vjs-mute-control.vjs-vol-0:before,
+.vjs-default-skin .vjs-volume-menu-button.vjs-vol-0:before {
+  content: "\e003";
+}
+.vjs-default-skin .vjs-mute-control.vjs-vol-1:before,
+.vjs-default-skin .vjs-volume-menu-button.vjs-vol-1:before {
+  content: "\e004";
+}
+.vjs-default-skin .vjs-mute-control.vjs-vol-2:before,
+.vjs-default-skin .vjs-volume-menu-button.vjs-vol-2:before {
+  content: "\e005";
+}
+.vjs-default-skin .vjs-volume-control {
+  width: 5em;
+  float: right;
+}
+.vjs-default-skin .vjs-volume-bar {
+  width: 5em;
+  height: 0.6em;
+  margin: 1.1em auto 0;
+}
+.vjs-default-skin .vjs-volume-menu-button .vjs-menu-content {
+  height: 2.9em;
+}
+.vjs-default-skin .vjs-volume-level {
+  position: absolute;
+  top: 0;
+  left: 0;
+  height: 0.5em;
+  background: #66a8cc url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAGCAYAAADgzO9IAAAAP0lEQVQIHWWMAQoAIAgDR/QJ/Ub//04+w7ZICBwcOg5FZi5iBB82AGzixEglJrd4TVK5XUJpskSTEvpdFzX9AB2pGziSQcvAAAAAAElFTkSuQmCC) -50% 0 repeat;
+}
+.vjs-default-skin .vjs-volume-bar .vjs-volume-handle {
+  width: 0.5em;
+  height: 0.5em;
+}
+.vjs-default-skin .vjs-volume-handle:before {
+  font-size: 0.9em;
+  top: -0.2em;
+  left: -0.2em;
+  width: 1em;
+  height: 1em;
+}
+.vjs-default-skin .vjs-volume-menu-button .vjs-menu .vjs-menu-content {
+  width: 6em;
+  left: -4em;
+}
+/* Progress
+--------------------------------------------------------------------------------
+*/
+.vjs-default-skin .vjs-progress-control {
+  position: absolute;
+  left: 0;
+  right: 0;
+  width: auto;
+  font-size: 0.3em;
+  height: 1em;
+  /* Set above the rest of the controls. */
+  top: -1em;
+  /* Shrink the bar slower than it grows. */
+  /* transition */
+  -webkit-transition: all 0.4s;
+  -moz-transition: all 0.4s;
+  -o-transition: all 0.4s;
+  transition: all 0.4s;
+}
+/* On hover, make the progress bar grow to something that's more clickable.
+    This simply changes the overall font for the progress bar, and this
+    updates both the em-based widths and heights, as wells as the icon font */
+.vjs-default-skin:hover .vjs-progress-control {
+  font-size: .9em;
+  /* Even though we're not changing the top/height, we need to include them in
+      the transition so they're handled correctly. */
+
+  /* transition */
+  -webkit-transition: all 0.2s;
+  -moz-transition: all 0.2s;
+  -o-transition: all 0.2s;
+  transition: all 0.2s;
+}
+/* Box containing play and load progresses. Also acts as seek scrubber. */
+.vjs-default-skin .vjs-progress-holder {
+  height: 100%;
+}
+/* Progress Bars */
+.vjs-default-skin .vjs-progress-holder .vjs-play-progress,
+.vjs-default-skin .vjs-progress-holder .vjs-load-progress {
+  position: absolute;
+  display: block;
+  height: 100%;
+  margin: 0;
+  padding: 0;
+  /* Needed for IE6 */
+  left: 0;
+  top: 0;
+}
+.vjs-default-skin .vjs-play-progress {
+  /*
+    Using a data URI to create the white diagonal lines with a transparent
+      background. Surprisingly works in IE8.
+      Created using http://www.patternify.com
+    Changing the first color value will change the bar color.
+    Also using a paralax effect to make the lines move backwards.
+      The -50% left position makes that happen.
+  */
+
+  background: #66a8cc url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAGCAYAAADgzO9IAAAAP0lEQVQIHWWMAQoAIAgDR/QJ/Ub//04+w7ZICBwcOg5FZi5iBB82AGzixEglJrd4TVK5XUJpskSTEvpdFzX9AB2pGziSQcvAAAAAAElFTkSuQmCC) -50% 0 repeat;
+}
+.vjs-default-skin .vjs-load-progress {
+  background: #646464 /* IE8- Fallback */;
+  background: rgba(255, 255, 255, 0.4);
+}
+.vjs-default-skin .vjs-seek-handle {
+  width: 1.5em;
+  height: 100%;
+}
+.vjs-default-skin .vjs-seek-handle:before {
+  padding-top: 0.1em /* Minor adjustment */;
+}
+/* Time Display
+--------------------------------------------------------------------------------
+*/
+.vjs-default-skin .vjs-time-controls {
+  font-size: 1em;
+  /* Align vertically by making the line height the same as the control bar */
+  line-height: 3em;
+}
+.vjs-default-skin .vjs-current-time {
+  float: left;
+}
+.vjs-default-skin .vjs-duration {
+  float: left;
+}
+/* Remaining time is in the HTML, but not included in default design */
+.vjs-default-skin .vjs-remaining-time {
+  display: none;
+  float: left;
+}
+.vjs-time-divider {
+  float: left;
+  line-height: 3em;
+}
+/* Fullscreen
+--------------------------------------------------------------------------------
+*/
+.vjs-default-skin .vjs-fullscreen-control {
+  width: 3.8em;
+  cursor: pointer;
+  float: right;
+}
+.vjs-default-skin .vjs-fullscreen-control:before {
+  content: "\e000";
+}
+/* Switch to the exit icon when the player is in fullscreen */
+.vjs-default-skin.vjs-fullscreen .vjs-fullscreen-control:before {
+  content: "\e00b";
+}
+/* Big Play Button (play button at start)
+--------------------------------------------------------------------------------
+Positioning of the play button in the center or other corners can be done more
+easily in the skin designer. http://designer.videojs.com/
+*/
+.vjs-default-skin .vjs-big-play-button {
+  left: 0.5em;
+  top: 0.5em;
+  font-size: 3em;
+  display: block;
+  z-index: 2;
+  position: absolute;
+  width: 4em;
+  height: 2.6em;
+  text-align: center;
+  vertical-align: middle;
+  cursor: pointer;
+  opacity: 1;
+  /* Need a slightly gray bg so it can be seen on black backgrounds */
+  /* background-color-with-alpha */
+  background-color: #07141e;
+  background-color: rgba(7, 20, 30, 0.7);
+  border: 0.1em solid #3b4249;
+  /* border-radius */
+  -webkit-border-radius: 0.8em;
+  -moz-border-radius: 0.8em;
+  border-radius: 0.8em;
+  /* box-shadow */
+  -webkit-box-shadow: 0px 0px 1em rgba(255, 255, 255, 0.25);
+  -moz-box-shadow: 0px 0px 1em rgba(255, 255, 255, 0.25);
+  box-shadow: 0px 0px 1em rgba(255, 255, 255, 0.25);
+  /* transition */
+  -webkit-transition: all 0.4s;
+  -moz-transition: all 0.4s;
+  -o-transition: all 0.4s;
+  transition: all 0.4s;
+}
+/* Optionally center */
+.vjs-default-skin.vjs-big-play-centered .vjs-big-play-button {
+  /* Center it horizontally */
+  left: 50%;
+  margin-left: -2.1em;
+  /* Center it vertically */
+  top: 50%;
+  margin-top: -1.4000000000000001em;
+}
+/* Hide if controls are disabled */
+.vjs-default-skin.vjs-controls-disabled .vjs-big-play-button {
+  display: none;
+}
+/* Hide when video starts playing */
+.vjs-default-skin.vjs-has-started .vjs-big-play-button {
+  display: none;
+}
+/* Hide on mobile devices. Remove when we stop using native controls
+    by default on mobile  */
+.vjs-default-skin.vjs-using-native-controls .vjs-big-play-button {
+  display: none;
+}
+.vjs-default-skin:hover .vjs-big-play-button,
+.vjs-default-skin .vjs-big-play-button:focus {
+  outline: 0;
+  border-color: #fff;
+  /* IE8 needs a non-glow hover state */
+  background-color: #505050;
+  background-color: rgba(50, 50, 50, 0.75);
+  /* box-shadow */
+  -webkit-box-shadow: 0 0 3em #ffffff;
+  -moz-box-shadow: 0 0 3em #ffffff;
+  box-shadow: 0 0 3em #ffffff;
+  /* transition */
+  -webkit-transition: all 0s;
+  -moz-transition: all 0s;
+  -o-transition: all 0s;
+  transition: all 0s;
+}
+.vjs-default-skin .vjs-big-play-button:before {
+  content: "\e001";
+  font-family: VideoJS;
+  /* In order to center the play icon vertically we need to set the line height
+     to the same as the button height */
+
+  line-height: 2.6em;
+  text-shadow: 0.05em 0.05em 0.1em #000;
+  text-align: center /* Needed for IE8 */;
+  position: absolute;
+  left: 0;
+  width: 100%;
+  height: 100%;
+}
+/* Loading Spinner
+--------------------------------------------------------------------------------
+*/
+.vjs-loading-spinner {
+  display: none;
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  font-size: 4em;
+  line-height: 1;
+  width: 1em;
+  height: 1em;
+  margin-left: -0.5em;
+  margin-top: -0.5em;
+  opacity: 0.75;
+  /* animation */
+  -webkit-animation: spin 1.5s infinite linear;
+  -moz-animation: spin 1.5s infinite linear;
+  -o-animation: spin 1.5s infinite linear;
+  animation: spin 1.5s infinite linear;
+}
+.vjs-default-skin .vjs-loading-spinner:before {
+  content: "\e01e";
+  font-family: VideoJS;
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 1em;
+  height: 1em;
+  text-align: center;
+  text-shadow: 0em 0em 0.1em #000;
+}
+@-moz-keyframes spin {
+  0% {
+    -moz-transform: rotate(0deg);
+  }
+  100% {
+    -moz-transform: rotate(359deg);
+  }
+}
+@-webkit-keyframes spin {
+  0% {
+    -webkit-transform: rotate(0deg);
+  }
+  100% {
+    -webkit-transform: rotate(359deg);
+  }
+}
+@-o-keyframes spin {
+  0% {
+    -o-transform: rotate(0deg);
+  }
+  100% {
+    -o-transform: rotate(359deg);
+  }
+}
+@keyframes spin {
+  0% {
+    transform: rotate(0deg);
+  }
+  100% {
+    transform: rotate(359deg);
+  }
+}
+/* Menu Buttons (Captions/Subtitles/etc.)
+--------------------------------------------------------------------------------
+*/
+.vjs-default-skin .vjs-menu-button {
+  float: right;
+  cursor: pointer;
+}
+.vjs-default-skin .vjs-menu {
+  display: none;
+  position: absolute;
+  bottom: 0;
+  left: 0em;
+  /* (Width of vjs-menu - width of button) / 2 */
+
+  width: 0em;
+  height: 0em;
+  margin-bottom: 3em;
+  border-left: 2em solid transparent;
+  border-right: 2em solid transparent;
+  border-top: 1.55em solid #000000;
+  /* Same width top as ul bottom */
+
+  border-top-color: rgba(7, 40, 50, 0.5);
+  /* Same as ul background */
+
+}
+/* Button Pop-up Menu */
+.vjs-default-skin .vjs-menu-button .vjs-menu .vjs-menu-content {
+  display: block;
+  padding: 0;
+  margin: 0;
+  position: absolute;
+  width: 10em;
+  bottom: 1.5em;
+  /* Same bottom as vjs-menu border-top */
+
+  max-height: 15em;
+  overflow: auto;
+  left: -5em;
+  /* Width of menu - width of button / 2 */
+
+  /* background-color-with-alpha */
+  background-color: #07141e;
+  background-color: rgba(7, 20, 30, 0.7);
+  /* box-shadow */
+  -webkit-box-shadow: -0.2em -0.2em 0.3em rgba(255, 255, 255, 0.2);
+  -moz-box-shadow: -0.2em -0.2em 0.3em rgba(255, 255, 255, 0.2);
+  box-shadow: -0.2em -0.2em 0.3em rgba(255, 255, 255, 0.2);
+}
+.vjs-default-skin .vjs-menu-button:hover .vjs-menu {
+  display: block;
+}
+.vjs-default-skin .vjs-menu-button ul li {
+  list-style: none;
+  margin: 0;
+  padding: 0.3em 0 0.3em 0;
+  line-height: 1.4em;
+  font-size: 1.2em;
+  text-align: center;
+  text-transform: lowercase;
+}
+.vjs-default-skin .vjs-menu-button ul li.vjs-selected {
+  background-color: #000;
+}
+.vjs-default-skin .vjs-menu-button ul li:focus,
+.vjs-default-skin .vjs-menu-button ul li:hover,
+.vjs-default-skin .vjs-menu-button ul li.vjs-selected:focus,
+.vjs-default-skin .vjs-menu-button ul li.vjs-selected:hover {
+  outline: 0;
+  color: #111;
+  /* background-color-with-alpha */
+  background-color: #ffffff;
+  background-color: rgba(255, 255, 255, 0.75);
+  /* box-shadow */
+  -webkit-box-shadow: 0 0 1em #ffffff;
+  -moz-box-shadow: 0 0 1em #ffffff;
+  box-shadow: 0 0 1em #ffffff;
+}
+.vjs-default-skin .vjs-menu-button ul li.vjs-menu-title {
+  text-align: center;
+  text-transform: uppercase;
+  font-size: 1em;
+  line-height: 2em;
+  padding: 0;
+  margin: 0 0 0.3em 0;
+  font-weight: bold;
+  cursor: default;
+}
+/* Subtitles Button */
+.vjs-default-skin .vjs-subtitles-button:before {
+  content: "\e00c";
+}
+/* Captions Button */
+.vjs-default-skin .vjs-captions-button:before {
+  content: "\e008";
+}
+/* Replacement for focus outline */
+.vjs-default-skin .vjs-captions-button:focus .vjs-control-content:before,
+.vjs-default-skin .vjs-captions-button:hover .vjs-control-content:before {
+  /* box-shadow */
+  -webkit-box-shadow: 0 0 1em #ffffff;
+  -moz-box-shadow: 0 0 1em #ffffff;
+  box-shadow: 0 0 1em #ffffff;
+}
+/*
+REQUIRED STYLES (be careful overriding)
+================================================================================
+When loading the player, the video tag is replaced with a DIV,
+that will hold the video tag or object tag for other playback methods.
+The div contains the video playback element (Flash or HTML5) and controls,
+and sets the width and height of the video.
+
+** If you want to add some kind of border/padding (e.g. a frame), or special
+positioning, use another containing element. Otherwise you risk messing up
+control positioning and full window mode. **
+*/
+.video-js {
+  background-color: #000;
+  position: relative;
+  padding: 0;
+  /* Start with 10px for base font size so other dimensions can be em based and
+     easily calculable. */
+
+  font-size: 10px;
+  /* Allow poster to be vertially aligned. */
+
+  vertical-align: middle;
+  /*  display: table-cell; */
+  /*This works in Safari but not Firefox.*/
+
+  /* Provide some basic defaults for fonts */
+
+  font-weight: normal;
+  font-style: normal;
+  /* Avoiding helvetica: issue #376 */
+
+  font-family: Arial, sans-serif;
+  /* Turn off user selection (text highlighting) by default.
+     The majority of player components will not be text blocks.
+     Text areas will need to turn user selection back on. */
+
+  /* user-select */
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+}
+/* Playback technology elements expand to the width/height of the containing div
+    <video> or <object> */
+.video-js .vjs-tech {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+}
+/* Fix for Firefox 9 fullscreen (only if it is enabled). Not needed when
+   checking fullScreenEnabled. */
+.video-js:-moz-full-screen {
+  position: absolute;
+}
+/* Fullscreen Styles */
+body.vjs-full-window {
+  padding: 0;
+  margin: 0;
+  height: 100%;
+  /* Fix for IE6 full-window. http://www.cssplay.co.uk/layouts/fixed.html */
+  overflow-y: auto;
+}
+.video-js.vjs-fullscreen {
+  position: fixed;
+  overflow: hidden;
+  z-index: 1000;
+  left: 0;
+  top: 0;
+  bottom: 0;
+  right: 0;
+  width: 100% !important;
+  height: 100% !important;
+  /* IE6 full-window (underscore hack) */
+  _position: absolute;
+}
+.video-js:-webkit-full-screen {
+  width: 100% !important;
+  height: 100% !important;
+}
+.video-js.vjs-fullscreen.vjs-user-inactive {
+  cursor: none;
+}
+/* Poster Styles */
+.vjs-poster {
+  background-repeat: no-repeat;
+  background-position: 50% 50%;
+  background-size: contain;
+  cursor: pointer;
+  height: 100%;
+  margin: 0;
+  padding: 0;
+  position: relative;
+  width: 100%;
+}
+.vjs-poster img {
+  display: block;
+  margin: 0 auto;
+  max-height: 100%;
+  padding: 0;
+  width: 100%;
+}
+/* Hide the poster when native controls are used otherwise it covers them */
+.video-js.vjs-using-native-controls .vjs-poster {
+  display: none;
+}
+/* Text Track Styles */
+/* Overall track holder for both captions and subtitles */
+.video-js .vjs-text-track-display {
+  text-align: center;
+  position: absolute;
+  bottom: 4em;
+  /* Leave padding on left and right */
+  left: 1em;
+  right: 1em;
+}
+/* Move captions down when controls aren't being shown */
+.video-js.vjs-user-inactive.vjs-playing .vjs-text-track-display {
+  bottom: 1em;
+}
+/* Individual tracks */
+.video-js .vjs-text-track {
+  display: none;
+  font-size: 1.4em;
+  text-align: center;
+  margin-bottom: 0.1em;
+  /* Transparent black background, or fallback to all black (oldIE) */
+  /* background-color-with-alpha */
+  background-color: #000000;
+  background-color: rgba(0, 0, 0, 0.5);
+}
+.video-js .vjs-subtitles {
+  color: #ffffff /* Subtitles are white */;
+}
+.video-js .vjs-captions {
+  color: #ffcc66 /* Captions are yellow */;
+}
+.vjs-tt-cue {
+  display: block;
+}
+/* Hide disabled or unsupported controls */
+.vjs-default-skin .vjs-hidden {
+  display: none;
+}
+.vjs-lock-showing {
+  display: block !important;
+  opacity: 1;
+  visibility: visible;
+}
+/* -----------------------------------------------------------------------------
+The original source of this file lives at
+https://github.com/videojs/video.js/blob/master/src/css/video-js.less */

scene/css/popupwindow.css

@@ -0,0 +1,284 @@
+button::-moz-focus-inner,input[type="reset"]::-moz-focus-inner,input[type="button"]::-moz-focus-inner,input[type="submit"]::-moz-focus-inner,input[type="file"] > input[type="button"]::-moz-focus-inner {border-color: transparent;}
+input:required:invalid {box-shadow: none;}
+.footer-btn-double{ display: none; }
+.dialog,
+.dialog__overlay {
+	width: 100%;
+	height: 100vh;
+	top: 0;
+	left: 0;
+	z-index: 11;
+}
+.dialog-2,.dialog__overlay{ z-index: 999; }
+.dialog {
+	font-family: "Microsoft YaHei";
+    letter-spacing: 0.02em;
+	position: fixed;
+	display: -webkit-flex;
+	display: flex;
+	-webkit-align-items: center;
+	align-items: center;
+	-webkit-justify-content: center;
+	justify-content: center;
+	pointer-events: none;
+}
+
+.dialog__overlay {
+	position: absolute;
+	z-index: 1;
+	background: rgba(55, 58, 71, 0.9);
+	opacity: 0;
+	-webkit-transition: opacity 0.3s;
+	transition: opacity 0.3s;
+	-webkit-backface-visibility: hidden;
+}
+
+.dialog--open .dialog__overlay {
+	opacity: 0.5;
+	pointer-events: auto;
+}
+
+.dialog__content {
+	text-align: center;
+	position: relative;
+	z-index: 5;
+	opacity: 0;
+	font-size: 75px;
+}
+
+.dialog--open .dialog__content {
+	pointer-events: auto;
+}
+
+.dialog.dialog--open .dialog__content,
+.dialog.dialog--close .dialog__content {
+	-webkit-animation-duration: 1s;
+	animation-duration: 1s;
+	-webkit-animation-timing-function: linear;
+	animation-timing-function: linear;
+	-webkit-animation-fill-mode: forwards;
+	animation-fill-mode: forwards;
+}
+
+.dialog.dialog--open .dialog__content {
+	-webkit-animation-name: anim-open;
+	animation-name: anim-open;
+}
+
+.dialog.dialog--close .dialog__content {
+	-webkit-animation-name: anim-close;
+	animation-name: anim-close;
+	-webkit-animation-duration: 0.3s;
+	animation-duration: 0.3s;
+	-webkit-animation-timing-function: ease-out;
+	animation-timing-function: ease-out;
+}
+
+.dialog--open .password,.dialog--open .password2{ display: block; }
+.password,.password2{ display: none; }
+
+
+/*弹出提示框的样式*/
+.prompt-popup a{
+	text-decoration: none;
+	color:white;
+}
+
+.prompt-popup{
+	z-index: 999;
+	width: 6.666667em;
+	height: 3.853333em;
+	color: #333333;
+	border-radius:5px;
+	-moz-border-radius:5px;
+	-webkit-border-radius:5px;	
+	background: white;
+	position: relative;
+	padding: 0 0.666667em;
+ 
+}
+.prompt-title{
+	display: flex;
+	display: -webkit-flex;
+	padding-top: 0.666667em;
+}
+.footer-btn-single span, .prompt-second-pg { font-size: 0.186667em; }
+.prompt-title a{
+	font-size:0.186667em;
+}
+.prompt-title h2{
+	font-size: 0.32em;
+	font-weight:600;
+	margin: 0px;
+}
+.prompt-second{padding-left: 0.066667em; font-size: 0.186667rem;}
+.prompt-main{
+	margin-top: 0.266667em;
+	height: 1.0em;
+	display: flex;
+	display: -webkit-flex;
+	align-items: center;
+	border-bottom: 2px solid #eeeeee;
+	border-top: 2px solid #eeeeee;
+	font-weight: bold;
+}
+.prompt-main span{ font-size: 0.186667em; }
+.prompt-title-close{position: absolute; top: 0.2em; display: flex;right: 0.2em;}
+.prompt-footer{
+	height: 1.12em;
+	display: flex;
+	display: -webkit-flex;
+	justify-content: center;
+	align-items: flex-end;
+}
+.prompt-footer a{
+	width: 1.6em;
+	height: 0.64em;
+	background:  #09e1c0;
+	line-height: 0.64em;
+	display: inline-flex;
+	justify-content:center;
+}
+.prompt-footer a:hover{
+	background: #45edd3;
+}
+.footer-btn-back{ background: #ccc !important; }
+.footer-btn-back span{font-size:0.186667em;}
+.footer-btn-confirm span{font-size:0.186667em;}
+.footer-btn-confirm{ margin-left: 0.266667em; }
+
+
+/* Content */
+@-webkit-keyframes anim-open {
+	0% { opacity: 0; -webkit-transform: matrix3d(0.7, 0, 0, 0, 0, 0.7, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.7, 0, 0, 0, 0, 0.7, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	2.083333% { -webkit-transform: matrix3d(0.75266, 0, 0, 0, 0, 0.76342, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.75266, 0, 0, 0, 0, 0.76342, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	4.166667% { -webkit-transform: matrix3d(0.81071, 0, 0, 0, 0, 0.84545, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.81071, 0, 0, 0, 0, 0.84545, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	6.25% { -webkit-transform: matrix3d(0.86808, 0, 0, 0, 0, 0.9286, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.86808, 0, 0, 0, 0, 0.9286, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	8.333333% { -webkit-transform: matrix3d(0.92038, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.92038, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	10.416667% { -webkit-transform: matrix3d(0.96482, 0, 0, 0, 0, 1.05202, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.96482, 0, 0, 0, 0, 1.05202, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	12.5% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1.08204, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1.08204, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	14.583333% { -webkit-transform: matrix3d(1.02563, 0, 0, 0, 0, 1.09149, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.02563, 0, 0, 0, 0, 1.09149, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	16.666667% { -webkit-transform: matrix3d(1.04227, 0, 0, 0, 0, 1.08453, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.04227, 0, 0, 0, 0, 1.08453, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	18.75% { -webkit-transform: matrix3d(1.05102, 0, 0, 0, 0, 1.06666, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.05102, 0, 0, 0, 0, 1.06666, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	20.833333% { -webkit-transform: matrix3d(1.05334, 0, 0, 0, 0, 1.04355, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.05334, 0, 0, 0, 0, 1.04355, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	22.916667% { -webkit-transform: matrix3d(1.05078, 0, 0, 0, 0, 1.02012, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.05078, 0, 0, 0, 0, 1.02012, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	25% { -webkit-transform: matrix3d(1.04487, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.04487, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	27.083333% { -webkit-transform: matrix3d(1.03699, 0, 0, 0, 0, 0.98534, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.03699, 0, 0, 0, 0, 0.98534, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	29.166667% { -webkit-transform: matrix3d(1.02831, 0, 0, 0, 0, 0.97688, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.02831, 0, 0, 0, 0, 0.97688, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	31.25% { -webkit-transform: matrix3d(1.01973, 0, 0, 0, 0, 0.97422, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.01973, 0, 0, 0, 0, 0.97422, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	33.333333% { -webkit-transform: matrix3d(1.01191, 0, 0, 0, 0, 0.97618, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.01191, 0, 0, 0, 0, 0.97618, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	35.416667% { -webkit-transform: matrix3d(1.00526, 0, 0, 0, 0, 0.98122, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00526, 0, 0, 0, 0, 0.98122, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	37.5% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 0.98773, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 0.98773, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	39.583333% { -webkit-transform: matrix3d(0.99617, 0, 0, 0, 0, 0.99433, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99617, 0, 0, 0, 0, 0.99433, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	41.666667% { -webkit-transform: matrix3d(0.99368, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99368, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	43.75% { -webkit-transform: matrix3d(0.99237, 0, 0, 0, 0, 1.00413, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99237, 0, 0, 0, 0, 1.00413, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	45.833333% { -webkit-transform: matrix3d(0.99202, 0, 0, 0, 0, 1.00651, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99202, 0, 0, 0, 0, 1.00651, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	47.916667% { -webkit-transform: matrix3d(0.99241, 0, 0, 0, 0, 1.00726, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99241, 0, 0, 0, 0, 1.00726, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	50% { opacity: 1; -webkit-transform: matrix3d(0.99329, 0, 0, 0, 0, 1.00671, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99329, 0, 0, 0, 0, 1.00671, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	52.083333% { -webkit-transform: matrix3d(0.99447, 0, 0, 0, 0, 1.00529, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99447, 0, 0, 0, 0, 1.00529, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	54.166667% { -webkit-transform: matrix3d(0.99577, 0, 0, 0, 0, 1.00346, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99577, 0, 0, 0, 0, 1.00346, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	56.25% { -webkit-transform: matrix3d(0.99705, 0, 0, 0, 0, 1.0016, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99705, 0, 0, 0, 0, 1.0016, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	58.333333% { -webkit-transform: matrix3d(0.99822, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99822, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	60.416667% { -webkit-transform: matrix3d(0.99921, 0, 0, 0, 0, 0.99884, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99921, 0, 0, 0, 0, 0.99884, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	62.5% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 0.99816, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 0.99816, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	64.583333% { -webkit-transform: matrix3d(1.00057, 0, 0, 0, 0, 0.99795, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00057, 0, 0, 0, 0, 0.99795, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	66.666667% { -webkit-transform: matrix3d(1.00095, 0, 0, 0, 0, 0.99811, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00095, 0, 0, 0, 0, 0.99811, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	68.75% { -webkit-transform: matrix3d(1.00114, 0, 0, 0, 0, 0.99851, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00114, 0, 0, 0, 0, 0.99851, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	70.833333% { -webkit-transform: matrix3d(1.00119, 0, 0, 0, 0, 0.99903, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00119, 0, 0, 0, 0, 0.99903, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	72.916667% { -webkit-transform: matrix3d(1.00114, 0, 0, 0, 0, 0.99955, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00114, 0, 0, 0, 0, 0.99955, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	75% { -webkit-transform: matrix3d(1.001, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.001, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	77.083333% { -webkit-transform: matrix3d(1.00083, 0, 0, 0, 0, 1.00033, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00083, 0, 0, 0, 0, 1.00033, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	79.166667% { -webkit-transform: matrix3d(1.00063, 0, 0, 0, 0, 1.00052, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00063, 0, 0, 0, 0, 1.00052, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	81.25% { -webkit-transform: matrix3d(1.00044, 0, 0, 0, 0, 1.00058, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00044, 0, 0, 0, 0, 1.00058, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	83.333333% { -webkit-transform: matrix3d(1.00027, 0, 0, 0, 0, 1.00053, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00027, 0, 0, 0, 0, 1.00053, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	85.416667% { -webkit-transform: matrix3d(1.00012, 0, 0, 0, 0, 1.00042, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00012, 0, 0, 0, 0, 1.00042, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	87.5% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1.00027, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1.00027, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	89.583333% { -webkit-transform: matrix3d(0.99991, 0, 0, 0, 0, 1.00013, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99991, 0, 0, 0, 0, 1.00013, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	91.666667% { -webkit-transform: matrix3d(0.99986, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99986, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	93.75% { -webkit-transform: matrix3d(0.99983, 0, 0, 0, 0, 0.99991, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99983, 0, 0, 0, 0, 0.99991, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	95.833333% { -webkit-transform: matrix3d(0.99982, 0, 0, 0, 0, 0.99985, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99982, 0, 0, 0, 0, 0.99985, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	97.916667% { -webkit-transform: matrix3d(0.99983, 0, 0, 0, 0, 0.99984, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99983, 0, 0, 0, 0, 0.99984, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	100% { opacity: 1; -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+}
+
+@keyframes anim-open {
+	0% { opacity: 0; -webkit-transform: matrix3d(0.7, 0, 0, 0, 0, 0.7, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.7, 0, 0, 0, 0, 0.7, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	2.083333% { -webkit-transform: matrix3d(0.75266, 0, 0, 0, 0, 0.76342, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.75266, 0, 0, 0, 0, 0.76342, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	4.166667% { -webkit-transform: matrix3d(0.81071, 0, 0, 0, 0, 0.84545, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.81071, 0, 0, 0, 0, 0.84545, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	6.25% { -webkit-transform: matrix3d(0.86808, 0, 0, 0, 0, 0.9286, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.86808, 0, 0, 0, 0, 0.9286, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	8.333333% { -webkit-transform: matrix3d(0.92038, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.92038, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	10.416667% { -webkit-transform: matrix3d(0.96482, 0, 0, 0, 0, 1.05202, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.96482, 0, 0, 0, 0, 1.05202, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	12.5% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1.08204, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1.08204, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	14.583333% { -webkit-transform: matrix3d(1.02563, 0, 0, 0, 0, 1.09149, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.02563, 0, 0, 0, 0, 1.09149, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	16.666667% { -webkit-transform: matrix3d(1.04227, 0, 0, 0, 0, 1.08453, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.04227, 0, 0, 0, 0, 1.08453, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	18.75% { -webkit-transform: matrix3d(1.05102, 0, 0, 0, 0, 1.06666, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.05102, 0, 0, 0, 0, 1.06666, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	20.833333% { -webkit-transform: matrix3d(1.05334, 0, 0, 0, 0, 1.04355, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.05334, 0, 0, 0, 0, 1.04355, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	22.916667% { -webkit-transform: matrix3d(1.05078, 0, 0, 0, 0, 1.02012, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.05078, 0, 0, 0, 0, 1.02012, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	25% { -webkit-transform: matrix3d(1.04487, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.04487, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	27.083333% { -webkit-transform: matrix3d(1.03699, 0, 0, 0, 0, 0.98534, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.03699, 0, 0, 0, 0, 0.98534, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	29.166667% { -webkit-transform: matrix3d(1.02831, 0, 0, 0, 0, 0.97688, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.02831, 0, 0, 0, 0, 0.97688, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	31.25% { -webkit-transform: matrix3d(1.01973, 0, 0, 0, 0, 0.97422, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.01973, 0, 0, 0, 0, 0.97422, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	33.333333% { -webkit-transform: matrix3d(1.01191, 0, 0, 0, 0, 0.97618, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.01191, 0, 0, 0, 0, 0.97618, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	35.416667% { -webkit-transform: matrix3d(1.00526, 0, 0, 0, 0, 0.98122, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00526, 0, 0, 0, 0, 0.98122, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+
+	37.5% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 0.98773, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 0.98773, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	39.583333% { -webkit-transform: matrix3d(0.99617, 0, 0, 0, 0, 0.99433, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99617, 0, 0, 0, 0, 0.99433, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	41.666667% { -webkit-transform: matrix3d(0.99368, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99368, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	43.75% { -webkit-transform: matrix3d(0.99237, 0, 0, 0, 0, 1.00413, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99237, 0, 0, 0, 0, 1.00413, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	45.833333% { -webkit-transform: matrix3d(0.99202, 0, 0, 0, 0, 1.00651, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99202, 0, 0, 0, 0, 1.00651, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	47.916667% { -webkit-transform: matrix3d(0.99241, 0, 0, 0, 0, 1.00726, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99241, 0, 0, 0, 0, 1.00726, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	50% { opacity: 1; -webkit-transform: matrix3d(0.99329, 0, 0, 0, 0, 1.00671, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99329, 0, 0, 0, 0, 1.00671, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	52.083333% { -webkit-transform: matrix3d(0.99447, 0, 0, 0, 0, 1.00529, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99447, 0, 0, 0, 0, 1.00529, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	54.166667% { -webkit-transform: matrix3d(0.99577, 0, 0, 0, 0, 1.00346, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99577, 0, 0, 0, 0, 1.00346, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	56.25% { -webkit-transform: matrix3d(0.99705, 0, 0, 0, 0, 1.0016, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99705, 0, 0, 0, 0, 1.0016, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	58.333333% { -webkit-transform: matrix3d(0.99822, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99822, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	60.416667% { -webkit-transform: matrix3d(0.99921, 0, 0, 0, 0, 0.99884, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99921, 0, 0, 0, 0, 0.99884, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	62.5% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 0.99816, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 0.99816, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	64.583333% { -webkit-transform: matrix3d(1.00057, 0, 0, 0, 0, 0.99795, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00057, 0, 0, 0, 0, 0.99795, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	66.666667% { -webkit-transform: matrix3d(1.00095, 0, 0, 0, 0, 0.99811, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00095, 0, 0, 0, 0, 0.99811, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	68.75% { -webkit-transform: matrix3d(1.00114, 0, 0, 0, 0, 0.99851, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00114, 0, 0, 0, 0, 0.99851, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	70.833333% { -webkit-transform: matrix3d(1.00119, 0, 0, 0, 0, 0.99903, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00119, 0, 0, 0, 0, 0.99903, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	72.916667% { -webkit-transform: matrix3d(1.00114, 0, 0, 0, 0, 0.99955, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00114, 0, 0, 0, 0, 0.99955, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	75% { -webkit-transform: matrix3d(1.001, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.001, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	77.083333% { -webkit-transform: matrix3d(1.00083, 0, 0, 0, 0, 1.00033, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00083, 0, 0, 0, 0, 1.00033, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	79.166667% { -webkit-transform: matrix3d(1.00063, 0, 0, 0, 0, 1.00052, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00063, 0, 0, 0, 0, 1.00052, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	81.25% { -webkit-transform: matrix3d(1.00044, 0, 0, 0, 0, 1.00058, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00044, 0, 0, 0, 0, 1.00058, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	83.333333% { -webkit-transform: matrix3d(1.00027, 0, 0, 0, 0, 1.00053, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00027, 0, 0, 0, 0, 1.00053, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	85.416667% { -webkit-transform: matrix3d(1.00012, 0, 0, 0, 0, 1.00042, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00012, 0, 0, 0, 0, 1.00042, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	87.5% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1.00027, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1.00027, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	89.583333% { -webkit-transform: matrix3d(0.99991, 0, 0, 0, 0, 1.00013, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99991, 0, 0, 0, 0, 1.00013, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	91.666667% { -webkit-transform: matrix3d(0.99986, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99986, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	93.75% { -webkit-transform: matrix3d(0.99983, 0, 0, 0, 0, 0.99991, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99983, 0, 0, 0, 0, 0.99991, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	95.833333% { -webkit-transform: matrix3d(0.99982, 0, 0, 0, 0, 0.99985, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99982, 0, 0, 0, 0, 0.99985, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	97.916667% { -webkit-transform: matrix3d(0.99983, 0, 0, 0, 0, 0.99984, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99983, 0, 0, 0, 0, 0.99984, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	100% { opacity: 1; -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+}
+
+@-webkit-keyframes anim-close {
+	0% { opacity: 1; }
+	100% { opacity: 0; -webkit-transform: scale3d(0.8, 0.8, 1); }
+}
+
+@keyframes anim-close {
+	0% { opacity: 1; }
+	100% { opacity: 0; -webkit-transform: scale3d(0.8, 0.8, 1); transform: scale3d(0.8, 0.8, 1); }
+}
+
+@media screen and (min-width: 1705px)  and  (max-width: 1805px) {
+  .dialog__content{font-size: 72px;}
+}
+@media screen and (min-width: 1605px)  and  (max-width: 1705px) {
+  .dialog__content{font-size: 68px;}
+}
+@media screen and (min-width: 1505px)  and  (max-width: 1605px) {
+  .dialog__content{font-size: 65px;}
+}
+@media screen and (min-width: 1405px)  and  (max-width: 1505px) {
+  .dialog__content{font-size: 61px;}
+}
+@media screen and (min-width: 1305px)  and  (max-width: 1405px) {
+  .dialog__content{font-size: 58px;}
+}
+@media screen and  (max-width: 1305px) {
+  .dialog__content{font-size: 55px;}
+}

scene/css/toolBox.css

@@ -0,0 +1,803 @@
+@font-face {font-family: "SourceHanSansCN";src: url("../fonts/SourceHanSansCN.woff2") format("woff2"),url("../fonts/SourceHanSansCN.woff") format("woff"),url("../fonts/SourceHanSansCN.ttf") format("truetype");font-weight: normal;font-style: normal;}
+/* html,body{height: 100%;width: 100%;margin: 0px;padding: 0px;overflow: hidden;font-size: 75px;}
+@media screen and (min-width: 1705px)  and  (max-width: 1805px) {
+  html{font-size: 72px;}
+}
+@media screen and (min-width: 1605px)  and  (max-width: 1705px) {
+  html{font-size: 68px;}
+}
+@media screen and (min-width: 1505px)  and  (max-width: 1605px) {
+  html{font-size: 65px;}
+}
+@media screen and (min-width: 1405px)  and  (max-width: 1505px) {
+  html{font-size: 61px;}
+}
+@media screen and (min-width: 1305px)  and  (max-width: 1405px) {
+  html{font-size: 58px;}
+}
+@media screen and  (max-width: 1305px) {
+  html{font-size: 55px;}
+  }
+} */
+
+ html,body{height: 100%;width: 100%;margin: 0px;padding: 0px;overflow: hidden; }
+
+
+
+*{box-sizing: border-box; font-family:OpenSans, "Microsoft YaHei";   background-size: contain;  background-repeat: no-repeat; background-position: center center; }
+.editor a{text-decoration: none;color:#333333;}
+.editor ul li{display: inline-block;list-style: none; width:100%}
+.editor ul{margin: 0px;padding: 0px;}
+.editor input,textarea{font: 14px "Microsoft YaHei";}
+.editor input[type="text"]:focus{border: 1px solid #09e1c0;}
+
+.scrollBox{width: 282px;height: 100%;}
+.scrollBox:nth-child(n+3){display: none;}
+.introduce-top{color: white;font-family:"Microsoft YaHei"; font-size:14px;margin:10px 0 0 10px;z-index:60;position: absolute;left: 0;top: 0;width: auto;height: 48px;}
+.introduce-top .introduce-button{padding-right: 25px;filter: drop-shadow(0px 1px 1px rgba(153,153,153,1));border-radius: 5px;background: url("../images/introduce_close.png") no-repeat;background-size: 16px; transition:background-color 0.3s; background-position:100% 50%;padding-left:0px;width:100%;height:48px;display:flex;display:-webkit-flex;font-size:16px;align-items:center; cursor:pointer;}
+.introduce-button a{display: inline-block;}
+.introduce-button .introduce-button-fImg{width: 30px;height: auto;margin-right:6px;}
+.introduce-button .introduce-button-lImg{width:1px;height:auto;margin-right:5px;}
+.introduce-top.open .introduce-button{background-image:url("../images/introduce_open.png")}
+.introduce-top .addIntroduce-bg{background: url("../images/introduce_close.png") no-repeat rgba(0,0,0,0.45);background-size: 16px;background-position:94% 50%;}
+.introduce-top .introduce-button span{margin-left:6px;letter-spacing:1px; font-weight:600;font-size:16px;margin-top: 2px;}
+.introduce-top .introduce-detailBox h3{font-size:12px; margin-bottom: 13px; font-weight:600;}
+.introduce-top .introduce-detailBox span{    line-height: 22px;text-align: justify;word-break: break-all;color: white;}
+.introduce-top .introduce-detailBox{position: absolute;border-radius: 3px;max-height:0px;width:320px;margin-top:5px;margin-left:41px;overflow:hidden;transition:max-height 0.25s ease-out;transform: translate3d(0, 0, 0);}
+.introduce-top.open .introduce-detailBox{max-height: 600px;}
+.introduce-top .introduce-detail{text-align:justify;width:100%;letter-spacing:1px;word-wrap: break-word;padding:14px 12px 14px 14px;background:rgba(0,0,0,0.2);}
+.introduce-top .introduce-detail p{text-align: justify;font-weight:400;line-height: 22px;word-break: break-all;color: white;}
+.bgNone{background: none !important;}
+.divNone{display: none !important;}
+ 
+.introduce-top .introduce-detail a,  #hotspot a{ text-decoration: underline !important; color:#fff !important;  margin: 0 2px !important; padding: 0 !important;       }
+.introduce-top .introduce-detail a *{color:#fff !important; }
+/* #hotspot .picBottom a,#hotspot .picRight a,#hotspot .formInfo a{color:#2d2d2d !important;}   */
+.introduce-top .introduce-detail a:hover,  #hotspot a:hover{color:#09e1c0 !important;}
+.introduce-top .introduce-detail a:hover *,  #hotspot a:hover *{color:#09e1c0 !important;}
+
+.toolTop{width: 282px;height: 48px;background: #5a45df;position: absolute;top: 0px;right: 0px;z-index: 150;display: flex;display: -webkit-flex;justify-content: space-between;align-items: center;}
+.toolTop>div:nth-child(2){display:flex;display:-webkit-flex;align-items:center;font-size:16px;font-weight:bold;  overflow: hidden;}
+.toolTop>div:nth-child(2)>*{ 
+   white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+.toolTop-button{display:flex;display:-webkit-flex;width:282px;}
+.toolTop-button>div{opacity:0.7;cursor: pointer;display:flex;display:-webkit-flex;width:94px;height:48px;align-items:center;justify-content:center;}
+.toolTop-button>div:hover{opacity:1;}
+.toolTop-button span{margin-left:5px;font-size:16px;color:#fafafa;}
+.editor{letter-spacing:0.1em;z-index:140;font: 14px "Microsoft YaHei";font-weight:400;color: #333333;width: 282px;height: 100%;background: #f5f5f5;position: absolute;right: 0px;top: 0px;padding-top:48px;box-shadow: 0px 0px 6px #666;-webkit-box-shadow: 0px 0px 6px #666;-moz-box-shadow: 0px 0px 6px #666;}
+.toolBox,.informationBox, .hotPointBox,.styleZBox{margin-top:48px;height:calc(100% - 106px);width:calc(100% + 12px);overflow-y:auto;overflow-x:hidden;    }
+.toolContent,.hotPoint_content,.information_content,.styleZ_content{position: relative; width: 282px;}
+.toolBox_Top{position: absolute;right: 0px;width: 100%;display: flex;display: -webkit-flex;border-bottom:1px solid #ddd;}
+.styleZ_content h3{font-size: 14px;font-weight:normal;margin:20px;}
+.styleZ_content>ul{display:flex;display:-webkit-flex;flex-direction:column;padding:0px 20px;}
+.styleZ_content>ul li{cursor: pointer;display:flex;display:-webkit-flex;justify-content:space-between;align-items:center;margin-bottom:10px;border:1px solid #ddd;border-radius:6px;padding:5px;}
+.styleZ-select{position:relative;width:46%;display:flex;display:-webkit-flex;justify-content:center;}
+.styleZ-select:before{content:"";position:absolute;top:50%;margin-top:-6px;left:15px;width:14px;height:14px;border-radius:7px;border:1px solid #ddd;}
+.styleZ_content>ul li:hover{background: #fafafa;}
+.styleZ_content>ul li.active{background:white;border-color:#09e1c0;}
+.styleZ_content>ul li.active .styleZ-select:before{background:#09e1c0;border-color:#09e1c0;}
+.styleZ_content>ul li.active .styleZ-select:after{content:"";position:absolute;top:50%;margin-top:-2.5px;left:18.5px;width:6px;height:6px;border-radius:7px;background:white;}
+.toolBox_Top input{background: #fff !important;transition:background 0.1s;letter-spacing:0.1em;display: inline-block;width: 25%;height: 48px;color: #999999;font: 16px initial;background: white;outline: none;-webkit-appearance: none;-moz-appearance: none;-o-appearance: none;appearance: none;border:none;cursor: pointer;}
+.toolBox_Top input:hover,.toolBox-Top-input{background: #fafafa !important;color:#333333 !important;}
+.toolBox_Top .toolBox_nav{position: relative;width: 100%;height: 100%;display: flex;display: -webkit-flex;}
+.toolBox_Top .toolBox_nav:before{content: "";background: #09e1c0;height: 2px;width:25%;position: absolute;bottom:0px;left:0px;transition:left 0.26s ease-out;}
+.toolBox_Top .toolBox_nav-left0:before{left: 0px;}
+.toolBox_Top .toolBox_nav-left1:before{left: 25%;}
+.toolBox_Top .toolBox_nav-left2:before{left: 50%;}
+.toolBox_Top .toolBox_nav-left3:before{left: 75%;}
+.function{width: 282px;height: 48px;border-top: 1px solid #cccccc;border-bottom: 1px solid #ddd;margin-top: 20px;}
+.function ul{display: flex;display: -webkit-flex;}
+.function li{width: 94px;height: 48px;display: flex;display: -webkit-flex;justify-content: center;align-items: center;}
+.function li img{vertical-align:baseline;}
+.function li>a{color: #333;display:  flex;display: -webkit-flex;justify-content:  center;align-items:  center;}
+.function li:hover{opacity:0.7;}
+.function li:nth-child(1) span,.function li:nth-child(2) span{padding-left: 5px;}
+#export{display: inline-block;width: 60px;height: 28px;border:none;border-radius: 2px;-webkit-border-radius: 2px;-moz-border-radius: 2px;color: white;background: #09e1c0;text-align: center;line-height: 28px;}
+#export:hover{background: #22f0d0;}
+#draw_Tools a{position:relative;}
+#draw_Tools a:before{position:absolute;top:0px;left:0px;content:"";width:60px;height:60px;transition:border 0.2s ease-in-out;}
+.draw_Tools-a:before{border:1px solid #09e1c0;}
+.Basic_drawing ul{padding-top: 20px;display: flex;display: -webkit-flex;}
+.Basic_drawing ul li{width: 33%;display: flex;display: -webkit-flex;flex-direction: column;align-items: center;}
+.doors_windows{border-bottom: 1px solid #ddd;padding-bottom: 18px;}
+.doors_windows ul{display: flex;display: -webkit-flex;flex-wrap: wrap;}
+.doors_windows ul li{width: 33%;display: flex;display: -webkit-flex;flex-direction: column;align-items: center;padding-top: 16px;}
+.Basic_drawing span,.doors_windows span{letter-spacing: 2px;margin-top: 8px;color: #333;}
+.controlBox{padding-top:28px;width: 282px;height:80px;border-bottom: 1px solid #cccccc;transition: all 1s linear;display: none;opacity: 0;}
+#controlName{padding-left: 20px;font-size: 16px;}
+.controlBox a{position: absolute;right: 20px;color:#cccccc;}
+.controlBox a:hover{color:#999999;}
+#pjtName{width: 100%;}
+#edit2Box,#edit1Box{width: 100%;height: 84px;position:relative;background: white;}
+#edit2,#edit1{width:100%;height:100%;overflow: hidden;border: 1px solid white;}
+#edit2Box .w-e-toolbar,#edit1Box .w-e-toolbar{position:absolute;bottom: 4px;right: 4px;padding: 0px;width: 20px;height: 20px;}
+#edit2Box .w-e-menu,#edit1Box .w-e-menu{padding: 0px;}
+#edit2Box .w-e-text,#edit1Box .w-e-text{width: calc(100% + 20px) !important;word-break: break-all;overflow-y: scroll;padding: 0px 30px 0px 10px; -webkit-user-select:auto;}
+#edit2Box .w-e-text *,#edit1Box .w-e-text *{-webkit-user-select:text;} 
+
+#edit2Box .w-e-icon-link,#edit1Box .w-e-icon-link{position:relative;display: block;width: 20px;height: 20px;}
+#edit2Box .w-e-text a,#edit1Box .w-e-text a{color:#079eec;text-decoration:underline;}
+#edit2Box .w-e-text-container,#edit1Box .w-e-text-container{position: static;}
+#edit2Box .w-e-icon-link:before,#edit1Box .w-e-icon-link:before{background: url("../images/linkBtn.png") no-repeat center;width: 20px;height: 20px;position: absolute;top: 0px;left: 0px;background-size: cover;}
+#edit2Box .w-e-text-container .w-e-panel-container,#edit1Box .w-e-text-container .w-e-panel-container{box-shadow: 1px 1px 2px #ccc;z-index: 99;top: 92px;}
+#edit2Box .addLink-content-row,#edit1Box .addLink-content-row{display:flex;display:-webkit-flex;justify-content:space-between;font-size:14px;height: 25px;}
+#edit2Box .addLink-content-row span,#edit1Box .addLink-content-row span{color:#999;}
+#edit2Box .addLink-content input,#edit1Box .addLink-content input{height:28px;border:1px solid #09e1c0;margin:0px 0px 6px}
+#edit2Box h5,#edit1Box h5{font-size:12px;font-weight:normal;color:#999;margin-bottom:20px;}
+#edit2Box .addLink-cancel,#edit1Box .addLink-cancel{width:75px;height:28px;background:#ccc;border-radius:0px;color:white;margin-left:10px}
+#edit2Box .addLink-cancel:hover,#edit1Box .addLink-cancel:hover{background: #d1d1d1;}
+#edit2Box .w-e-button-container,#edit1Box .w-e-button-container{display:flex;display:-webkit-flex;justify-content:flex-end;}
+#edit1Box .w-e-panel-tab-content:after,#edit2Box .w-e-panel-tab-content:after{position:absolute;width:0px;height:0px;border-left:7px solid transparent;border-right:7px solid transparent;border-bottom:14px solid #777;top:-46px;right:15px;content:"";}
+
+
+/* 画墙一栏*/
+
+.information-subDiv{padding: 20px 0px;margin: 0px 20px;border-bottom: 1px solid #ddd;}
+.editor .information-subDiv ul li{display:flex;display:-webkit-flex;justify-content: space-between;}
+.information-subDiv:first-child li{flex-direction:column;margin-bottom: 20px;}
+.information-subDiv:first-child span{margin-bottom: 6px;}
+.information-subDiv:last-child{ border-bottom:  none;}
+.information-subDiv:last-child li:first-child{margin-bottom:4px;}
+.information_input{width: 282px;}
+.information_input input[type="file"]{position: relative;display: none;}
+.information_input input{width: 160px;height: 28px;font-size: 14px;outline: none;-webkit-appearance: none;-moz-appearance: none;-o-appearance: none;appearance: none;border: 1px solid white;color: #999999;}
+.information_input input::placeholder{font-size: 14px;color:#cccccc;}
+.information_input input:-ms-input-placeholder{font-size: 14px;color:#cccccc;}
+.information_input input::-ms-input-placeholder{font-size: 14px;color:#cccccc;}
+.information_input input[type="button"]{width: 60px;height: 28px;border:none;border-radius: 2px;-webkit-border-radius: 2px;-moz-border-radius: 2px;color: white;background: #09e1c0;text-align: center;font-size: 14px;cursor: pointer;margin-top:10px;}
+.information_input input[type="button"]:hover{background: #22f0d0;}
+.information_show ul{display: flex;display: -webkit-flex;flex-direction: column;padding: 20px 0px;margin: 0 20px;}
+.information_show ul li{height: 28px;display: flex;display: -webkit-flex;justify-content: space-between;align-items: center;}
+.information_input .right{    position: relative; width: 160px;  font-size: 14px;line-height: 28px;} 
+.information_input input, .information_input label{outline: none;background-color:#fff;padding: 0 10px;color: #999999;}
+.close_linkDiv{position: absolute;bottom: 10px;right: 10px;width: 75px;height: 28px;cursor: pointer;z-index: 99999;}
+#setEntry .ImgPreview{height:80px;}
+.information_input label{cursor:pointer;}
+.show_title{padding-left: 0 !important;}
+.show_data{color: #999999;display: flex;display: -webkit-flex;flex-direction: row-reverse;}
+.show_count{color: #999}
+.show_data span{padding-right: 5px;}
+/* 信息一栏*/.hotPointBox{overflow-y:hidden} 
+#ok{width:100%;height: 48px;display:none;text-align:center;line-height:48px;cursor:pointer;background: #09e1c0;color:#fff;}
+#ok:hover{background: #14ebca}
+.hotPoint_content{height: 100%;}
+.hotPoint_content .point>*{height: 40px;display: flex;display: -webkit-flex;width: 282px;align-items:center;justify-content: space-between;border-bottom: 1px #ddd solid;padding-left: 20px;color: #999;/* opacity: 0.6;*/cursor: pointer;display:none;background:#fafafa;}
+.hotPoint_content #listPoint{display:flex;-webkit-box-flex: 1;}
+.hotPoint_content #listPoint>*{display:flex;}
+.hotPoint_content #listPoint>div:first-child{border-right:1px solid #eeeeee;}
+.hotPoint_content #listPoint>div:hover{background: #fff;}
+.hotPoint_content .point>* div{display: flex;display: -webkit-flex;align-items: center;}
+.hotPoint_content .point>* span{padding-left: 5px;}
+.hotPoint_content .point>* a{padding-right: 20px;}
+/* .hotPoint_content .point>*:hover{opacity: 1;}*/
+#snap{padding:20px 0px;display: flex;display: -webkit-flex;align-items: center;flex-direction: column;}
+#hotPoint_button{background: #09e1c0;height: 48px;display: flex;display: -webkit-flex;width:242px;align-items: center;justify-content: center;color: white;cursor: pointer;transition: background 0.2s;}
+#hotPoint_button.unable{pointer-events: none;/* opacity:0.5;*/cursor:default;background: #ddd;}
+#hotPoint_button span{padding-left: 5px;}
+#hotPoint_button:hover{background: #14ebca;}
+#hotPoint_input{display:none;width: 282px;border-bottom: 1px #ddd solid; max-height: 800px;transition: max-height .3s; overflow: hidden;}
+#hotPoint_input #change{display:flex;-webkit-box-flex: 1;text-align:center;border-bottom:1px solid #ddd;height:40px;width:100%;}
+#hotPoint_input #change>div{cursor:pointer;width: 100%;height: 100%;line-height: 40px;}
+#hotPoint_input #change>div:first-child{border-right:1px solid #eeeeee;}
+#hotPoint_input #change>div:hover{background: #fff;}
+#hotPoint_input>ul{padding:8px 20px 15px;display: flex;display: -webkit-flex;flex-wrap: wrap;background: #eee;}
+.hotPoint-title{position: relative;}
+.hotPoint-title:after{position: absolute;top: 0px;right: -10px;content: "*";color:#f56c6c;}
+#hotPoint_input>ul>li{position: relative;padding: 5px 0;line-height:30px;display: flex;display: -webkit-flex;flex-basis: 100%;align-items:center;justify-content: space-between;align-items: flex-start;}
+#hotPoint_input>ul>li.warn input{border: 1px solid #f56c6c;}
+#hotPoint_input>ul>li.warn input::placeholder{color: #f56c6c !important;}
+.redPoint{position:relative;}
+.hotPoint_content .redPoint:after{position: absolute;top: 0px;left: 32px;content: "*";color:#f56c6c;}
+.information_input .redPoint:after{position: absolute;top: 0px;left: 62.5px;content: "*";color:#f56c6c;}
+#type .redPoint:after{left:32px}
+#hotPoint_input .unComplete{display:none; color:#f56c6c;font-size: 0.9em;position: absolute;bottom: 12px;right: 10px;}
+.information_input .unComplete{display: none;color:#f56c6c;font-size: 0.9em;position: absolute;bottom: 16px;right: 28px;}
+#project-name2:before{position:absolute;right:0px;top:2px;content:""attr(data-size)"";color:#999;}
+#project-intro2{position:relative;}
+#project-intro2:before{position:absolute;right:0px;top:2px;content:""attr(data-size)"";color:#999;}
+#project-name1,#project-intro1{position:relative;width:100%;}
+#project-name1:before,#project-intro1:before{position:absolute;right:0px;top:2px;content:""attr(data-size)"";color:#999;}
+
+#hotPoint_input>ul>li span{margin-top:5px;}
+#hotPoint_input input[type="file"]{position: relative;display: none;}
+*{outline:none}
+#hotPoint_input input.white,textarea.white{font-size: 14px;outline: none;-webkit-appearance: none;-moz-appearance: none;-o-appearance: none;appearance: none;border: 1px solid white;color: #999999;resize: vertical;}
+#hotPoint_input .ImgPreview,.information_input .ImgPreview{width:160px;height:114px;background-repeat: no-repeat;background-position: center center; margin-top: 10px;background-size: contain;/* border: 1px solid white;*/}
+#showInformation{height:80px;position:  relative;}
+.showInformation-error:after{content:"";width:100%;height:100%;position:absolute;left:0;top:0;background:url("../images/pic_error.png") no-repeat center;}
+#hotPoint_input>ul>li:nth-child(n+6){padding:0px}
+#select{display: inline-block;position:relative;background:#eee;}
+#select .showStyle{background:#eee;position:absolute;top:0px;left:0px;display:flex;display:-webkit-flex;justify-content:space-between;align-items:center;width:160px;height:30px;}
+#select .showStyle>div:first-child{display:flex;display:-webkit-flex;align-items:center;}
+#select .showStyle>div:first-child img{margin-top:-1px}
+#hotPoint_input>ul>li:nth-child(5){margin-top:-11px;}
+#hotPoint_input>ul>li:nth-child(6){margin-top:-8px;}
+#select .showStyle p{margin-left:5px;      cursor: default;}
+#styleBtn{opacity: 0.7;width:16px;height:16px;background:url("../images/styleBtn.png") no-repeat;cursor: pointer;}
+#styleBtn:hover{opacity: 1;}
+#select ul{display: none;padding:10px 30px 15px 10px;font-size:12px;width: 160px;z-index: 15;position:absolute;background: white;box-shadow: 0px 1px 6px 1px rgba(51,51,51,0.3);-webkit-box-shadow: 0px 1px 6px 1px rgba(51,51,51,0.3);-moz-box-shadow:0px 1px 6px 1px rgba(51,51,51,0.3);left:0px;top:30px;flex-wrap:wrap;}
+#select ul li:nth-child(3),#select ul li:nth-child(4){margin-top:20px}
+#select ul li:nth-child(3):after{position:absolute;content:"";top:-10px;left:0px;width:140px;height:1px;background:#ddd;}
+#select ul li span{margin-top:2px;}
+#select.open #styleBtn{opacity: 0.7;}
+#select.open ul{display:flex;display:-webkit-flex;}
+#select ul li{ margin-right: 2px;cursor: pointer;display:flex;display:-webkit-flex;flex-direction:column; padding-top: 4px;align-items:center; width:46px; height:61px;position:relative;/* float: left; */}#select ul li:before{position:absolute;content:"";left:0px;top:0px; width:46px;height:64px;}#select ul li:hover:before{border:1px solid #ddd;}
+#select span{line-height:15px;}
+.information_input>ul>li:nth-child(4):before{position:absolute;content:"标志大小";bottom:17px;left:20px;}
+#hotPoint_input>ul>li:nth-child(1){line-height:20px}
+#hotPoint_input>ul>li:nth-child(4){line-height:16px}
+.hotPoint_content .point>div.chosen{color:#333;background:#fff;}
+.hotPoint_content .point .coordinate{background-image:url(../images/coordinate2.png);height: 16px;width: 16px;}
+.hotPoint_content .point>div.chosen .coordinate{background-image:url(../images/coordinate.png);}
+.hotPoint_content .point .delete{/* height:46px;width:46px;background-repeat: no-repeat;background-position: center center;background-image:url(../images/coordinateClose.png);background-size: initial;*/border-radius: 7px;height: 14px;width: 14px;margin-right: 14px;padding: 2px;font-size: 12px;background:transparent;transition: background 0.3s;}
+.hotPoint_content .point>div .delete::before{font-family: "FontAwesome";content: "\f00d";color: #bababa;transition: color 0.3s;}
+.hotPoint_content .point>div .delete:hover{background: #ccc;}
+.hotPoint_content .point>div.chosen .delete::before{color: #808080;}
+.hotPoint_content .point>div .delete:hover::before{color: #fff;}
+#snapPoint>div:first-child{border-top: 1px #ddd solid;margin-top:20px;} 
+#snapPoint>div:hover{background: #fff;}
+.selectButton{background: url("../images/styleButton2.png") white no-repeat;background-position:92% 50%;}
+#hotPoint_input textarea,#hotPoint_input li input,#hotPoint_input #select, #hotPoint_input label,#hotPoint_input li .right,.information_input label{width: 160px;height: 28px;line-height:28px;padding:0 8px;max-height:500px;/* overflow:auto;*//* overflow:hidden;*/border:none;}
+
+#hotPoint_input textarea{width: 160px;height: 56px;line-height:22px;padding:0 8px;background-color:#fafafa;max-height:500px;/* overflow:auto;*//* overflow:hidden;*/border:none;}
+#hotPoint_input textarea.focus,#hotPoint_input li input.white:focus{background:#fff;color:#333;border: 1px solid #09e1c0;}
+label.btn{cursor:pointer;display: inline-block;background:#09e1c0;color: #fff;text-align: center;transition: background 0.2s;letter-spacing:0.05em;}
+label.btn:hover{background:#14ebca;color:#fff;}
+#hotPoint_input label:hover,.information_input label:hover{background: #09cbae;}
+#hotPoint_input input::placeholder{font-size: 14px;color:#cccccc;}
+#hotPoint_input input:-ms-input-placeholder{font-size: 14px;color:#cccccc;}
+#hotPoint_input input::-ms-input-placeholder{font-size: 14px;color:#cccccc;}
+#hotPoint_input #hotPoint_sumbit{width: 60px;height: 28px;border:none;border-radius: 2px;-webkit-border-radius: 2px;-moz-border-radius: 2px;color: white;background: #09e1c0;text-align: center;font-size: 14px;cursor: pointer;}
+#hotPoint_input input[type="button"]:hover{background: #22f0d0;}
+.hotPoint_list{position:relative;    overflow-y: auto; overflow-x: hidden; height: calc(100% - 88px);}
+.hotPoint_list #list{/* position:absolute;*/width: 100%;flex-direction: column-reverse; border-top:1px solid #ddd;}
+.hotPoint_list #list>li{/* position:absolute;*/padding-left: 20px;display:flex;display:-webkit-flex;justify-content: flex-start;align-items: center; width: 282px;height: 48px;border-bottom: 1px solid #ddd;cursor: pointer;background: #fafafa;transition: background 0.1s;position:  relative;}
+.hotPoint_list #list>li:before{position:absolute;content:"";width:0px;height:48px;background:#09e1c0;left:0px;top:-1px;transition: width 0.2s;}
+.hotPoint_list #list>li.open:before{ width:8px !important;}
+.hotPoint_list #list>li{ background:#fff;}
+.hotPoint_list #list>li.open{  }
+.hotPoint_list #list>li:hover{background:#eee;} 
+.hotPoint_list #list div{/* display: flex;display: -webkit-flex;*/align-items: center;}
+.hotPoint_list #list>li span{padding-left: 5px;font-weight:bold;  white-space: nowrap;  overflow: hidden; text-overflow: ellipsis;}
+.hotPoint_list #list>li .delete{position: absolute;top: 0px;right: 0px;height: 48px;width: 48px;background-repeat: no-repeat;background-position: center center;background-image: url(../images/del.png);background-size: initial;}
+.hotPoint_list #list>li .delete:hover{background-color:rgba(175, 175, 175, 0.1);}
+.hotPoint_list #list>li .DelConfirm{font-size: 12px;position: absolute;width:60px;z-index: 100;background: #fff;height: 56px;border-radius: 2px;box-shadow: 0 1px 6px 0px rgba(153, 153, 153, 1);text-align: center;line-height: 28px;right: 40px;opacity:0;transform: translateX(15px) scale(0,0);transform-origin:right;transition: transform 0.1s,opacity 0.1s;}
+.hotPoint_list #list>li .DelConfirm.open{opacity:1;transform: translateX(0px) scale(1, 1);}
+/*#list>li .DelConfirm:after{content: '';width: 0;height: 0;border-top: 5px solid transparent;border-left: 8px solid #ffffff;border-bottom: 5px solid transparent;position: absolute;right: -8px;top: 25px;color: #999;}*/
+.hotPoint_list #list>li .DelConfirm>div{height:50%;}
+.hotPoint_list #list>li .DelConfirm>div:hover{background:#eee;}
+.hotPoint_list #list>li .DelConfirm .DelYes{color: rgba(224, 82, 71, 1);}
+.hotPoint_list #list>li div.left{     flex: auto;    max-width: 80%;display: flex;display: -webkit-flex;}
+#information_file{display:none;position:relative;}
+.information_show_div{display:flex;display:-webkit-flex;justify-content:space-between;padding:10px 0px 20px;}
+.information_show_div span{padding-left:20px;line-height: 24px;}
+
+.information_show_div label{width:160px;height:28px;line-height:30px;cursor:pointer;display: inline-block;background:#09e1c0;color: #fff;text-align: center;transition: background 0.2s;letter-spacing:0.05em;}
+
+input::-webkit-input-placeholder, textarea::-webkit-input-placeholder{color: #999 !important;font-weight:normal !important;}
+input:-moz-placeholder, textarea:-moz-placeholder{color:#999 !important;font-weight:normal !important;}
+input::-moz-placeholder, textarea::-moz-placeholder{color:#999 !important;font-weight:normal !important;}
+input:-ms-input-placeholder, textarea:-ms-input-placeholder{color:#999 !important;font-weight:normal !important;} 
+
+.Zprompt-popupBox{ font-family: "Microsoft YaHei"; position:absolute;top:0px;left:0px;background:rgba(0,0,0,0.3);width:100%;height:100%;z-index:200;overflow:auto;}
+.Zprompt-popupBox .center{position: absolute; left: 50%; top: 50%; transform: translateX(-50%) translateY(-50%);}
+.Zprompt-popup{padding: 0px;width:600px;height:289px;font-size:14px;box-shadow:0 0 5px #ccc;-moz-box-shadow:0 0 5px #ccc;-webkit-box-shadow:0 0 5px #ccc;color:#333;border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;background:#fff;}
+.Zprompt-title{width:600px;display:flex;display:-webkit-flex;justify-content:space-between}
+.Zprompt-title a{text-decoration:none;height:20px;width:16px;opacity: 0.7;margin:10px}
+.Zprompt-title a:hover{opacity: 1}
+.Zprompt-title h2{padding-top:45px;padding-left:50px;font-size:24px;font-weight:600;margin:0}
+.Zprompt-main-false{margin-top:15px;width:598px;height:75px;display:flex;display:-webkit-flex;align-items:center;padding-left:49px;margin-left:1px;border-bottom:2px solid #eee;border-top:2px solid #eee;font-weight:700}
+.Zprompt-main-false span{padding-left:10px;font-weight:normal;letter-spacing:1px;}
+.Zprompt-footer{width:600px;height:95px;display:flex;display:-webkit-flex;justify-content:center;align-items:flex-end}
+.Zprompt-footer a{width:120px;height:48px;background:#09e1c0;text-align:center;line-height:48px;color: white;    margin: 0 10px;}
+.Zprompt-footer a:hover{background:#01dab9}
+.Zprompt-footer a.btn1{background:#c5c5c5}
+.Zprompt-footer a.btn1:hover{background:#b1b1b1}
+
+@keyframes flash {
+  0% {  
+	opacity:0;
+  } 
+  20% { 
+	opacity:1;
+  }
+   60% { 
+
+	opacity:1;
+  }
+   100% { 
+	opacity:0;
+  } 
+} 
+.Zprompt-popupBox #Zinfo{    width: 100px; height: 140px; opacity:0;}
+.Zprompt-popupBox #Zinfo.animate{  animation: flash 1s; -webkit-animation: flash 1s; animation-iteration-count:1; } 
+.Zprompt-popupBox #Zinfo .Zimg{    width: 100%; height: 100px;  background-image:url(../images/stips.png);  
+background-repeat: no-repeat;
+background-position: center center;}
+.Zprompt-popupBox #Zinfo .Ztitle{   text-align: center;  font-size: 16px;  letter-spacing:1px;   text-shadow: 2px 2px 6px rgba(27, 27, 27, 0.81);}
+.myAccount-cutAvatar{display: none;position:absolute;top:0px;left:0px;background:rgba(0,0,0,0.3);width:100%;height:100%;z-index:200;overflow:auto;}
+.myAccount-cutAvatar .myAccount-cutAvatar-inner {width:600px;height:543px;position:absolute;background:white;left:50%;top:50%;margin-left:-300px;margin-top:-272px;}
+.myAccount-cutAvatar .myAccount-cutAvatar-top {width:100%;height:95px;border-bottom:2px solid #eeeeee;font-size:24px;display:flex;display:-webkit-flex;justify-content:space-between;}
+.myAccount-cutAvatar .myAccount-cutAvatar-top span {margin-top:40px;margin-left:50px;color: #333;font-weight: bold;}
+.myAccount-cutAvatar .myAccount-cutAvatar-top a {margin:10px;height: 16px;width: 16px;line-height: 1px;opacity: 0.7;}
+.myAccount-cutAvatar .myAccount-cutAvatar-top a:hover{opacity: 1} 
+.myAccount-cutAvatar .myAccount-cutAvatar-main {width:100%;}
+.myAccount-cutAvatar .myAccount-cutAvatar-main {display:flex;display:-webkit-flex;padding:40px 0px 0px 50px;}
+.myAccount-cutAvatar .myAccount-cutAvatar-main>div:first-child {width:500px;height:300px;background:#eeeeee;display:flex;display:-webkit-flex;justify-content:center;align-items:center;}
+.myAccount-cutAvatar .myAccount-cutAvatar-main>div:first-child img {max-width:500px;height:auto;max-height:300px;}
+.myAccount-cutAvatar .myAccount-cutAvatar-inner>div:last-child {text-align:center;}
+.myAccount-cutAvatar input {background:#09e1c0;color:white;width:122px;height:50px;font-size:14px;cursor:pointer;border:1px solid white;outline:none;}
+#discrib .preholder{text-align:center;}
+
+
+
+
+
+#hotPoint_input .project-name,#hotPoint_input .project-intro{
+  flex-direction:column;
+
+  line-height: normal;
+
+}
+#hotPoint_input .project-name input,#hotPoint_input .project-intro>div,   .project-intro{
+  width:100%;
+}
+#hotPoint_input .project-name>span,#hotPoint_input .project-intro>span{
+  margin-bottom: 8px;
+}
+
+#hotPoint_input .project-intro{
+  margin:8px 0px 10px
+}
+.information_input .project-name,.information_input .project-intro{
+   flex-direction:column;
+
+   padding: 6px 0px 10px;
+   line-height: normal;
+}
+ 
+.information_input .project-name input,.information_input .project-intro>div{
+  width:calc( 100% - 40px );
+  margin-left:20px;
+  margin-top: 5px;
+}
+.information_input .project-intro{
+ margin:0px;
+}
+#type{
+     flex-direction:column;
+   width:100%;
+   position: relative;
+   margin: 0px;
+}
+#type a{
+    width:100%;
+}
+
+.noteBox{z-index: 999;display: none;width: 282px;height: 126px;background: white;padding: 20px 0px 0px 20px;opacity: 0;transition: opacity 0.5s ease;position: absolute;}
+.noteBox-row{display: flex;display: -webkit-flex;font-size: 14px;margin-bottom: 10px;}
+.noteBox-row h3{font-size: 14px;color: #333;}
+#noteInput_text{width: 242px;height: 28px;border: 1px solid #ccc;color: #333;padding-left: 10px;}
+.noteBox-row:last-child{justify-content: flex-end;margin-right: 20px;}
+.noteBox-ok{border-radius: 2px;cursor: pointer;width: 32px;height: 20px;color: white;background: #09e1c0;font-size: 12px;display: flex;display: -webkit-flex;justify-content: center;align-items: center;}
+.noteBox-cancel{border-radius: 2px;cursor: pointer;width: 20px;height: 20px;background: #f56c6c;display: flex;display: -webkit-flex;justify-content: center;align-items: center;margin-left: 6px;}
+.noteBox.show{display: block;}
+.noteBox.active{opacity: 1;}
+
+.sizeWaring:before{color:#f56c6c !important;}
+.empty_warn{border:1px solid #f56c6c !important;color: #f56c6c !important;}
+.empty_warn::placeholder{color: #f56c6c !important;}
+
+.hide{ display:none;}
+.unable{pointer-events:none;  opacity:0.5;  }
+
+
+.editor .Main{ 
+	height:20px;
+	align-items: center;
+    display: flex;
+    justify-content: space-between;
+} 
+.editor .Main .scrollBar {
+    position: relative;
+    width: calc(96% - 45px);
+    height: 4px;
+    background-color: #c7c7c7;
+    cursor: pointer;
+}
+.editor .scrollBar .scroll_Track {
+	width: 0px;
+    height: 4px;
+    background-color: #09e1c0;
+}
+.editor .scrollBar .scroll_Thumb {
+	height: 12px;
+    width: 14px;
+    background-color: #919191;
+    /*-webkit-border-radius: 8px;
+    -moz-border-radius: 8px;
+    border-radius: 4px;
+     -webkit-box-shadow: 0px 0px 5px #74b5f5;
+    -moz-box-shadow: 0px 0px 5px #74b5f5;
+    box-shadow: 0px 0px 4px #74b5f5; */
+    position: absolute;
+    margin-top: -8px;
+    cursor: pointer;
+    -webkit-user-select: none;
+}
+.editor .BarTxt {
+	position:relative;
+	width:40px;
+}
+.editor .BarTxt .scrollBarTxt{
+    width: 100%;
+    text-align: center;
+    height: 20px;
+    border: 0;
+    /* border-radius: 4px; */
+    padding: 4px 0;
+    text-align: center;
+    color: #fff;
+    background: #919191;
+    font-size: 12px;
+}
+.editor #floorLogoSize {
+    font-size: 12px;
+    width: 160px;
+}
+.editor #floorLogoSize .slider{
+	float: left;
+    width: 100%;
+}
+
+.editor #scenePSD span{
+	line-height: 24px;
+}
+.editor #scenePSD ul.MenuOptions{
+	width: 100%;
+    overflow: hidden; 
+    background: #fff; 
+    padding: 0px;
+    cursor: pointer;
+    flex-direction: row;
+    align-items: center;
+    
+}
+.editor #scenePSD .MenuOptions li{
+	float: left; 
+	text-align:center;
+	line-height: 28px;
+	font-size:14px;
+	display:inline-block; 
+	color:#999;
+	transition:color 0.1s;
+}
+ 
+
+
+.editor .MenuOptions li.chosen{
+	background-color:#09e1c0;
+	color:#fff !important
+} 
+.editor .MenuOptions li:hover{
+	color: #333;
+}
+.editor .MenuOptions li.chosen:hover{
+	background-color:#09e1c0;
+	color:#fff;
+
+}
+
+.editor .quarterCell{
+	width: 25%;
+} 
+.editor .thirdCell{
+	width: 33.33%;
+}
+.editor .halfCell{
+	width: 50%;
+}
+
+.editor  a.button{
+	width: 100%;
+    height: 30px;
+    background: #0ed8b9;
+    display: inline-block;
+    margin-top: 10px;
+    text-align: center;
+    color: #fff; 
+}
+.editor  a.button:hover{
+	background:#04c7a9;
+}
+.editor  a.button:active{
+	background:#05a089;
+}
+
+
+.editor  #scenePSD .word{
+	margin-top:10px; 
+}
+.editor  #scenePSD .word>*{
+	float:left;
+}
+.editor  #scenePSD .word input{
+	/* width: 75%;  */
+	width:100%;
+}
+ 
+			
+img{
+	pointer-events:none;
+}
+
+ 
+
+ 
+
+
+
+.editor .selection{
+    display: block;
+    position: relative;
+    height: 30px;
+    overflow: hidden;
+    color: #000;
+    padding-right: 40px;
+    padding-left: 10px;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    background: #fff;
+    cursor: pointer;
+    outline: none;
+    line-height: 30px;
+	transition-duration:0.1s;
+	border: 1px solid white;
+}
+.editor  .selection:after{
+	content: "\f0d7";
+    display: block;
+    position: absolute;
+    top: 0;
+    right: 0;
+    width: 30px;
+    height: 30px;
+    font-family: FontAwesome;
+    text-align: center;
+    line-height: 30px;
+}
+.editor  .selection.focus{ 
+	color:#555;
+}
+.editor  ul.listOptions{
+	position: absolute;
+    left: 0px;
+    top: 56px;
+    z-index: 100;
+    width: 100%;
+    overflow: hidden; 
+    color: #9b9b9b;
+    background: #fff;
+    box-shadow: 0 5px 5px rgba(0,0,0,.3);
+	padding:0;
+	margin:0;
+	cursor:pointer;
+} 
+.editor  ul.listOptions>li{
+	height: 30px;
+    list-style-type: none;
+    color: #9b9b9b;
+    padding: 0 10px;
+    line-height: 30px;
+ /*    overflow: hidden; */
+    width:100%;
+    white-space: nowrap; 
+    margin: 0px;
+} 
+.editor  ul.listOptions>li.hover{
+    background: #fafafa;
+}
+
+#hotspot{
+	position: absolute;
+	height: 100%;
+	 
+	touch-action: none;
+	-webkit-user-select: none;
+	-webkit-user-drag: none;
+	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
+	bottom:0;
+	left: 0;
+	pointer-events: none;
+	z-index:99;
+	transition:opacity 0.1s;
+}
+#hotspot *{
+	margin: 0;
+	padding: 0;
+	border: 0;
+	font-size: 100%;
+	font: inherit;
+	vertical-align: baseline;
+	-webkit-font-smoothing: antialiased;
+}		
+ 
+
+#hotspot>*{
+	pointer-events: all;
+	position:absolute;
+	display: block; 
+	
+}
+
+  
+
+#hotspot >.markspot{
+	background-image: url(../images/markspotAll.png);
+	background-size: cover;
+	background-repeat: no-repeat;
+	background-position: center -76px;
+	width: 60px;
+	height: 76px;
+	margin-left: -32px;
+	margin-top: -62px;
+	cursor: -webkit-grab;
+} 
+#hotspot >.markspot.zero{
+	background-position: center 0;
+}
+#hotspot >.markspot.two{
+	background-position: center -152px;
+}
+
+
+ 
+
+
+.editor .hotPoint_list{
+	width: calc(100% + 12px);/* 滑动条隐藏 */
+}
+ 
+.editor .hotPoint_list #list>li div.left>img{
+	width:24px;
+}
+
+.editor #select .showStyle>div:first-child > img{
+	width:20px;
+}
+.editor #select ul li > img{
+	width:40px;
+	height: auto;
+	display: block;
+}
+ 
+.warning-border{
+	border: 1px solid #f56c6c !important;
+}
+ 
+ 
+ 
+ 
+ @keyframes flash{
+  0% {
+    opacity: 0; }
+  1% {
+    opacity: 1; }
+  30% {
+    opacity: 1; }
+  100% {
+    opacity: 0; } 
+ }
+ #webgl .snapshotFlash{
+	opacity: 0;
+    position: absolute;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+    z-index: -1;
+    background: #ffffff;
+    pointer-events: none;
+ }
+ #webgl .snapshotFlash.active{
+	z-index: 100;
+	-webkit-animation-name:flash;
+	animation-name:flash;
+	-webkit-animation-duration:1s;
+	animation-duration:1s;
+	-webkit-animation-fill-mode:both;
+	animation-fill-mode:both;
+}
+
+#webgl .snapshotGui{
+	position:absolute; 
+    z-index: 100;
+	width: calc(94% - 80px);
+    height: calc(85% - 80px);
+    border: 1px solid rgba(255,255,255,0.5); 
+    left: calc(3% + 40px);
+    top: calc(3% + 80px);
+	pointer-events: none;
+	opacity:0;
+	transition: opacity 0.3s,
+				border 0.3s;
+	
+}
+#webgl .snapshotGui .corner{
+	width:100px;
+	height:100px;
+	position:absolute;
+	transition:opacity 0.3s;
+	opacity: 0.5;
+}
+#webgl .snapshotGui.highLight .corner{
+	opacity: 0.8;
+}
+#webgl .snapshotGui.highLight{
+	border: 1px solid rgba(255,255,255,0.8); 
+}
+#webgl .snapshotGui .corner.leftTop{
+	border-top:4px solid #fff;
+	border-left:4px solid #fff;
+	left:-40px;
+	top:-40px;
+}
+#webgl .snapshotGui .corner.rightTop{
+	border-top:4px solid #fff;
+	border-right:4px solid #fff;
+	right:-40px;
+	top:-40px;
+}
+#webgl .snapshotGui .corner.leftBott{
+	border-left:4px solid #fff;
+	border-bottom:4px solid #fff;
+	left:-40px;
+	bottom:-40px;
+}
+#webgl .snapshotGui .corner.rightBott{
+	border-right: 4px solid #fff;
+    border-bottom: 4px solid #fff;
+    right: -40px;
+    bottom: -40px;
+}
+ 
+#webgl .snapshotGui .confirmSnap{
+	background: rgba(9, 225, 192, 0.9);
+    color: #fff;
+    border-radius: 5px;
+    /* margin: 0 auto; */
+    bottom: 20px;
+    position: absolute;
+    width: 220px;
+    letter-spacing: 0.1em;
+    height: 48px;
+    text-align: center;
+    line-height: 48px;
+    font-size: 16px;
+    font-weight: 100;
+    left: calc(50% - 110px);
+    font-family: SourceHanSansCN;
+	pointer-events: all;
+	cursor:pointer;
+	transition:background 0.2s;
+}
+#webgl .snapshotGui .confirmSnap:hover{
+	background:rgba(9, 225, 192, 0.78)  /* #14ebca */
+}
+
+
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 

scene/css/toolBox.css.bak

@@ -0,0 +1,803 @@
+@font-face {font-family: "SourceHanSansCN";src: url("../fonts/SourceHanSansCN.woff2") format("woff2"),url("../fonts/SourceHanSansCN.woff") format("woff"),url("../fonts/SourceHanSansCN.ttf") format("truetype");font-weight: normal;font-style: normal;}*/
+/* html,body{height: 100%;width: 100%;margin: 0px;padding: 0px;overflow: hidden;font-size: 75px;}
+@media screen and (min-width: 1705px)  and  (max-width: 1805px) {
+  html{font-size: 72px;}
+}
+@media screen and (min-width: 1605px)  and  (max-width: 1705px) {
+  html{font-size: 68px;}
+}
+@media screen and (min-width: 1505px)  and  (max-width: 1605px) {
+  html{font-size: 65px;}
+}
+@media screen and (min-width: 1405px)  and  (max-width: 1505px) {
+  html{font-size: 61px;}
+}
+@media screen and (min-width: 1305px)  and  (max-width: 1405px) {
+  html{font-size: 58px;}
+}
+@media screen and  (max-width: 1305px) {
+  html{font-size: 55px;}
+  }
+} */
+
+ html,body{height: 100%;width: 100%;margin: 0px;padding: 0px;overflow: hidden; }
+
+
+
+*{box-sizing: border-box; font-family:OpenSans, "Microsoft YaHei";   background-size: contain;  background-repeat: no-repeat; background-position: center center; }
+.editor a{text-decoration: none;color:#333333;}
+.editor ul li{display: inline-block;list-style: none; width:100%}
+.editor ul{margin: 0px;padding: 0px;}
+.editor input,textarea{font: 14px "Microsoft YaHei";}
+.editor input[type="text"]:focus{border: 1px solid #09e1c0;}
+
+.scrollBox{width: 282px;height: 100%;}
+.scrollBox:nth-child(n+3){display: none;}
+.introduce-top{color: white;font-family:"Microsoft YaHei"; font-size:14px;margin:10px 0 0 10px;z-index:60;position: absolute;left: 0;top: 0;width: auto;height: 48px;}
+.introduce-top .introduce-button{padding-right: 25px;filter: drop-shadow(0px 1px 1px rgba(153,153,153,1));border-radius: 5px;background: url("../images/introduce_close.png") no-repeat;background-size: 16px; transition:background-color 0.3s; background-position:100% 50%;padding-left:0px;width:100%;height:48px;display:flex;display:-webkit-flex;font-size:16px;align-items:center; cursor:pointer;}
+.introduce-button a{display: inline-block;}
+.introduce-button .introduce-button-fImg{width: 30px;height: auto;margin-right:6px;}
+.introduce-button .introduce-button-lImg{width:1px;height:auto;margin-right:5px;}
+.introduce-top.open .introduce-button{background-image:url("../images/introduce_open.png")}
+.introduce-top .addIntroduce-bg{background: url("../images/introduce_close.png") no-repeat rgba(0,0,0,0.45);background-size: 16px;background-position:94% 50%;}
+.introduce-top .introduce-button span{margin-left:6px;letter-spacing:1px; font-weight:600;font-size:16px;margin-top: 2px;}
+.introduce-top .introduce-detailBox h3{font-size:12px; margin-bottom: 13px; font-weight:600;}
+.introduce-top .introduce-detailBox span{    line-height: 22px;text-align: justify;word-break: break-all;color: white;}
+.introduce-top .introduce-detailBox{position: absolute;border-radius: 3px;max-height:0px;width:320px;margin-top:5px;margin-left:41px;overflow:hidden;transition:max-height 0.25s ease-out;transform: translate3d(0, 0, 0);}
+.introduce-top.open .introduce-detailBox{max-height: 600px;}
+.introduce-top .introduce-detail{text-align:justify;width:100%;letter-spacing:1px;word-wrap: break-word;padding:14px 12px 14px 14px;background:rgba(0,0,0,0.2);}
+.introduce-top .introduce-detail p{text-align: justify;font-weight:400;line-height: 22px;word-break: break-all;color: white;}
+.bgNone{background: none !important;}
+.divNone{display: none !important;}
+ 
+.introduce-top .introduce-detail a,  #hotspot a{ text-decoration: underline !important; color:#fff !important;  margin: 0 2px !important; padding: 0 !important;       }
+.introduce-top .introduce-detail a *{color:#fff !important; }
+/* #hotspot .picBottom a,#hotspot .picRight a,#hotspot .formInfo a{color:#2d2d2d !important;}   */
+.introduce-top .introduce-detail a:hover,  #hotspot a:hover{color:#09e1c0 !important;}
+.introduce-top .introduce-detail a:hover *,  #hotspot a:hover *{color:#09e1c0 !important;}
+
+.toolTop{width: 282px;height: 48px;background: #5a45df;position: absolute;top: 0px;right: 0px;z-index: 150;display: flex;display: -webkit-flex;justify-content: space-between;align-items: center;}
+.toolTop>div:nth-child(2){display:flex;display:-webkit-flex;align-items:center;font-size:16px;font-weight:bold;  overflow: hidden;}
+.toolTop>div:nth-child(2)>*{ 
+   white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+.toolTop-button{display:flex;display:-webkit-flex;width:282px;}
+.toolTop-button>div{opacity:0.7;cursor: pointer;display:flex;display:-webkit-flex;width:94px;height:48px;align-items:center;justify-content:center;}
+.toolTop-button>div:hover{opacity:1;}
+.toolTop-button span{margin-left:5px;font-size:16px;color:#fafafa;}
+.editor{letter-spacing:0.1em;z-index:140;font: 14px "Microsoft YaHei";font-weight:400;color: #333333;width: 282px;height: 100%;background: #f5f5f5;position: absolute;right: 0px;top: 0px;padding-top:48px;box-shadow: 0px 0px 6px #666;-webkit-box-shadow: 0px 0px 6px #666;-moz-box-shadow: 0px 0px 6px #666;}
+.toolBox,.informationBox, .hotPointBox,.styleZBox{margin-top:48px;height:calc(100% - 106px);width:calc(100% + 12px);overflow-y:auto;overflow-x:hidden;    }
+.toolContent,.hotPoint_content,.information_content,.styleZ_content{position: relative; width: 282px;}
+.toolBox_Top{position: absolute;right: 0px;width: 100%;display: flex;display: -webkit-flex;border-bottom:1px solid #ddd;}
+.styleZ_content h3{font-size: 14px;font-weight:normal;margin:20px;}
+.styleZ_content>ul{display:flex;display:-webkit-flex;flex-direction:column;padding:0px 20px;}
+.styleZ_content>ul li{cursor: pointer;display:flex;display:-webkit-flex;justify-content:space-between;align-items:center;margin-bottom:10px;border:1px solid #ddd;border-radius:6px;padding:5px;}
+.styleZ-select{position:relative;width:46%;display:flex;display:-webkit-flex;justify-content:center;}
+.styleZ-select:before{content:"";position:absolute;top:50%;margin-top:-6px;left:15px;width:14px;height:14px;border-radius:7px;border:1px solid #ddd;}
+.styleZ_content>ul li:hover{background: #fafafa;}
+.styleZ_content>ul li.active{background:white;border-color:#09e1c0;}
+.styleZ_content>ul li.active .styleZ-select:before{background:#09e1c0;border-color:#09e1c0;}
+.styleZ_content>ul li.active .styleZ-select:after{content:"";position:absolute;top:50%;margin-top:-2.5px;left:18.5px;width:6px;height:6px;border-radius:7px;background:white;}
+.toolBox_Top input{background: #fff !important;transition:background 0.1s;letter-spacing:0.1em;display: inline-block;width: 25%;height: 48px;color: #999999;font: 16px initial;background: white;outline: none;-webkit-appearance: none;-moz-appearance: none;-o-appearance: none;appearance: none;border:none;cursor: pointer;}
+.toolBox_Top input:hover,.toolBox-Top-input{background: #fafafa !important;color:#333333 !important;}
+.toolBox_Top .toolBox_nav{position: relative;width: 100%;height: 100%;display: flex;display: -webkit-flex;}
+.toolBox_Top .toolBox_nav:before{content: "";background: #09e1c0;height: 2px;width:25%;position: absolute;bottom:0px;left:0px;transition:left 0.26s ease-out;}
+.toolBox_Top .toolBox_nav-left0:before{left: 0px;}
+.toolBox_Top .toolBox_nav-left1:before{left: 25%;}
+.toolBox_Top .toolBox_nav-left2:before{left: 50%;}
+.toolBox_Top .toolBox_nav-left3:before{left: 75%;}
+.function{width: 282px;height: 48px;border-top: 1px solid #cccccc;border-bottom: 1px solid #ddd;margin-top: 20px;}
+.function ul{display: flex;display: -webkit-flex;}
+.function li{width: 94px;height: 48px;display: flex;display: -webkit-flex;justify-content: center;align-items: center;}
+.function li img{vertical-align:baseline;}
+.function li>a{color: #333;display:  flex;display: -webkit-flex;justify-content:  center;align-items:  center;}
+.function li:hover{opacity:0.7;}
+.function li:nth-child(1) span,.function li:nth-child(2) span{padding-left: 5px;}
+#export{display: inline-block;width: 60px;height: 28px;border:none;border-radius: 2px;-webkit-border-radius: 2px;-moz-border-radius: 2px;color: white;background: #09e1c0;text-align: center;line-height: 28px;}
+#export:hover{background: #22f0d0;}
+#draw_Tools a{position:relative;}
+#draw_Tools a:before{position:absolute;top:0px;left:0px;content:"";width:60px;height:60px;transition:border 0.2s ease-in-out;}
+.draw_Tools-a:before{border:1px solid #09e1c0;}
+.Basic_drawing ul{padding-top: 20px;display: flex;display: -webkit-flex;}
+.Basic_drawing ul li{width: 33%;display: flex;display: -webkit-flex;flex-direction: column;align-items: center;}
+.doors_windows{border-bottom: 1px solid #ddd;padding-bottom: 18px;}
+.doors_windows ul{display: flex;display: -webkit-flex;flex-wrap: wrap;}
+.doors_windows ul li{width: 33%;display: flex;display: -webkit-flex;flex-direction: column;align-items: center;padding-top: 16px;}
+.Basic_drawing span,.doors_windows span{letter-spacing: 2px;margin-top: 8px;color: #333;}
+.controlBox{padding-top:28px;width: 282px;height:80px;border-bottom: 1px solid #cccccc;transition: all 1s linear;display: none;opacity: 0;}
+#controlName{padding-left: 20px;font-size: 16px;}
+.controlBox a{position: absolute;right: 20px;color:#cccccc;}
+.controlBox a:hover{color:#999999;}
+#pjtName{width: 100%;}
+#edit2Box,#edit1Box{width: 100%;height: 84px;position:relative;background: white;}
+#edit2,#edit1{width:100%;height:100%;overflow: hidden;border: 1px solid white;}
+#edit2Box .w-e-toolbar,#edit1Box .w-e-toolbar{position:absolute;bottom: 4px;right: 4px;padding: 0px;width: 20px;height: 20px;}
+#edit2Box .w-e-menu,#edit1Box .w-e-menu{padding: 0px;}
+#edit2Box .w-e-text,#edit1Box .w-e-text{width: calc(100% + 20px) !important;word-break: break-all;overflow-y: scroll;padding: 0px 30px 0px 10px; -webkit-user-select:auto;}
+#edit2Box .w-e-text *,#edit1Box .w-e-text *{-webkit-user-select:text;} 
+
+#edit2Box .w-e-icon-link,#edit1Box .w-e-icon-link{position:relative;display: block;width: 20px;height: 20px;}
+#edit2Box .w-e-text a,#edit1Box .w-e-text a{color:#079eec;text-decoration:underline;}
+#edit2Box .w-e-text-container,#edit1Box .w-e-text-container{position: static;}
+#edit2Box .w-e-icon-link:before,#edit1Box .w-e-icon-link:before{background: url("../images/linkBtn.png") no-repeat center;width: 20px;height: 20px;position: absolute;top: 0px;left: 0px;background-size: cover;}
+#edit2Box .w-e-text-container .w-e-panel-container,#edit1Box .w-e-text-container .w-e-panel-container{box-shadow: 1px 1px 2px #ccc;z-index: 99;top: 92px;}
+#edit2Box .addLink-content-row,#edit1Box .addLink-content-row{display:flex;display:-webkit-flex;justify-content:space-between;font-size:14px;height: 25px;}
+#edit2Box .addLink-content-row span,#edit1Box .addLink-content-row span{color:#999;}
+#edit2Box .addLink-content input,#edit1Box .addLink-content input{height:28px;border:1px solid #09e1c0;margin:0px 0px 6px}
+#edit2Box h5,#edit1Box h5{font-size:12px;font-weight:normal;color:#999;margin-bottom:20px;}
+#edit2Box .addLink-cancel,#edit1Box .addLink-cancel{width:75px;height:28px;background:#ccc;border-radius:0px;color:white;margin-left:10px}
+#edit2Box .addLink-cancel:hover,#edit1Box .addLink-cancel:hover{background: #d1d1d1;}
+#edit2Box .w-e-button-container,#edit1Box .w-e-button-container{display:flex;display:-webkit-flex;justify-content:flex-end;}
+#edit1Box .w-e-panel-tab-content:after,#edit2Box .w-e-panel-tab-content:after{position:absolute;width:0px;height:0px;border-left:7px solid transparent;border-right:7px solid transparent;border-bottom:14px solid #777;top:-46px;right:15px;content:"";}
+
+
+/* 画墙一栏*/
+
+.information-subDiv{padding: 20px 0px;margin: 0px 20px;border-bottom: 1px solid #ddd;}
+.editor .information-subDiv ul li{display:flex;display:-webkit-flex;justify-content: space-between;}
+.information-subDiv:first-child li{flex-direction:column;margin-bottom: 20px;}
+.information-subDiv:first-child span{margin-bottom: 6px;}
+.information-subDiv:last-child{ border-bottom:  none;}
+.information-subDiv:last-child li:first-child{margin-bottom:4px;}
+.information_input{width: 282px;}
+.information_input input[type="file"]{position: relative;display: none;}
+.information_input input{width: 160px;height: 28px;font-size: 14px;outline: none;-webkit-appearance: none;-moz-appearance: none;-o-appearance: none;appearance: none;border: 1px solid white;color: #999999;}
+.information_input input::placeholder{font-size: 14px;color:#cccccc;}
+.information_input input:-ms-input-placeholder{font-size: 14px;color:#cccccc;}
+.information_input input::-ms-input-placeholder{font-size: 14px;color:#cccccc;}
+.information_input input[type="button"]{width: 60px;height: 28px;border:none;border-radius: 2px;-webkit-border-radius: 2px;-moz-border-radius: 2px;color: white;background: #09e1c0;text-align: center;font-size: 14px;cursor: pointer;margin-top:10px;}
+.information_input input[type="button"]:hover{background: #22f0d0;}
+.information_show ul{display: flex;display: -webkit-flex;flex-direction: column;padding: 20px 0px;margin: 0 20px;}
+.information_show ul li{height: 28px;display: flex;display: -webkit-flex;justify-content: space-between;align-items: center;}
+.information_input .right{    position: relative; width: 160px;  font-size: 14px;line-height: 28px;} 
+.information_input input, .information_input label{outline: none;background-color:#fff;padding: 0 10px;color: #999999;}
+.close_linkDiv{position: absolute;bottom: 10px;right: 10px;width: 75px;height: 28px;cursor: pointer;z-index: 99999;}
+#setEntry .ImgPreview{height:80px;}
+.information_input label{cursor:pointer;}
+.show_title{padding-left: 0 !important;}
+.show_data{color: #999999;display: flex;display: -webkit-flex;flex-direction: row-reverse;}
+.show_count{color: #999}
+.show_data span{padding-right: 5px;}
+/* 信息一栏*/.hotPointBox{overflow-y:hidden} 
+#ok{width:100%;height: 48px;display:none;text-align:center;line-height:48px;cursor:pointer;background: #09e1c0;color:#fff;}
+#ok:hover{background: #14ebca}
+.hotPoint_content{height: 100%;}
+.hotPoint_content .point>*{height: 40px;display: flex;display: -webkit-flex;width: 282px;align-items:center;justify-content: space-between;border-bottom: 1px #ddd solid;padding-left: 20px;color: #999;/* opacity: 0.6;*/cursor: pointer;display:none;background:#fafafa;}
+.hotPoint_content #listPoint{display:flex;-webkit-box-flex: 1;}
+.hotPoint_content #listPoint>*{display:flex;}
+.hotPoint_content #listPoint>div:first-child{border-right:1px solid #eeeeee;}
+.hotPoint_content #listPoint>div:hover{background: #fff;}
+.hotPoint_content .point>* div{display: flex;display: -webkit-flex;align-items: center;}
+.hotPoint_content .point>* span{padding-left: 5px;}
+.hotPoint_content .point>* a{padding-right: 20px;}
+/* .hotPoint_content .point>*:hover{opacity: 1;}*/
+#snap{padding:20px 0px;display: flex;display: -webkit-flex;align-items: center;flex-direction: column;}
+#hotPoint_button{background: #09e1c0;height: 48px;display: flex;display: -webkit-flex;width:242px;align-items: center;justify-content: center;color: white;cursor: pointer;transition: background 0.2s;}
+#hotPoint_button.unable{pointer-events: none;/* opacity:0.5;*/cursor:default;background: #ddd;}
+#hotPoint_button span{padding-left: 5px;}
+#hotPoint_button:hover{background: #14ebca;}
+#hotPoint_input{display:none;width: 282px;border-bottom: 1px #ddd solid; max-height: 800px;transition: max-height .3s; overflow: hidden;}
+#hotPoint_input #change{display:flex;-webkit-box-flex: 1;text-align:center;border-bottom:1px solid #ddd;height:40px;width:100%;}
+#hotPoint_input #change>div{cursor:pointer;width: 100%;height: 100%;line-height: 40px;}
+#hotPoint_input #change>div:first-child{border-right:1px solid #eeeeee;}
+#hotPoint_input #change>div:hover{background: #fff;}
+#hotPoint_input>ul{padding:8px 20px 15px;display: flex;display: -webkit-flex;flex-wrap: wrap;background: #eee;}
+.hotPoint-title{position: relative;}
+.hotPoint-title:after{position: absolute;top: 0px;right: -10px;content: "*";color:#f56c6c;}
+#hotPoint_input>ul>li{position: relative;padding: 5px 0;line-height:30px;display: flex;display: -webkit-flex;flex-basis: 100%;align-items:center;justify-content: space-between;align-items: flex-start;}
+#hotPoint_input>ul>li.warn input{border: 1px solid #f56c6c;}
+#hotPoint_input>ul>li.warn input::placeholder{color: #f56c6c !important;}
+.redPoint{position:relative;}
+.hotPoint_content .redPoint:after{position: absolute;top: 0px;left: 32px;content: "*";color:#f56c6c;}
+.information_input .redPoint:after{position: absolute;top: 0px;left: 62.5px;content: "*";color:#f56c6c;}
+#type .redPoint:after{left:32px}
+#hotPoint_input .unComplete{display:none; color:#f56c6c;font-size: 0.9em;position: absolute;bottom: 12px;right: 10px;}
+.information_input .unComplete{display: none;color:#f56c6c;font-size: 0.9em;position: absolute;bottom: 16px;right: 28px;}
+#project-name2:before{position:absolute;right:0px;top:2px;content:""attr(data-size)"";color:#999;}
+#project-intro2{position:relative;}
+#project-intro2:before{position:absolute;right:0px;top:2px;content:""attr(data-size)"";color:#999;}
+#project-name1,#project-intro1{position:relative;width:100%;}
+#project-name1:before,#project-intro1:before{position:absolute;right:0px;top:2px;content:""attr(data-size)"";color:#999;}
+
+#hotPoint_input>ul>li span{margin-top:5px;}
+#hotPoint_input input[type="file"]{position: relative;display: none;}
+*{outline:none}
+#hotPoint_input input.white,textarea.white{font-size: 14px;outline: none;-webkit-appearance: none;-moz-appearance: none;-o-appearance: none;appearance: none;border: 1px solid white;color: #999999;resize: vertical;}
+#hotPoint_input .ImgPreview,.information_input .ImgPreview{width:160px;height:114px;background-repeat: no-repeat;background-position: center center; margin-top: 10px;background-size: contain;/* border: 1px solid white;*/}
+#showInformation{height:80px;position:  relative;}
+.showInformation-error:after{content:"";width:100%;height:100%;position:absolute;left:0;top:0;background:url("../images/pic_error.png") no-repeat center;}
+#hotPoint_input>ul>li:nth-child(n+6){padding:0px}
+#select{display: inline-block;position:relative;background:#eee;}
+#select .showStyle{background:#eee;position:absolute;top:0px;left:0px;display:flex;display:-webkit-flex;justify-content:space-between;align-items:center;width:160px;height:30px;}
+#select .showStyle>div:first-child{display:flex;display:-webkit-flex;align-items:center;}
+#select .showStyle>div:first-child img{margin-top:-1px}
+#hotPoint_input>ul>li:nth-child(5){margin-top:-11px;}
+#hotPoint_input>ul>li:nth-child(6){margin-top:-8px;}
+#select .showStyle p{margin-left:5px;      cursor: default;}
+#styleBtn{opacity: 0.7;width:16px;height:16px;background:url("../images/styleBtn.png") no-repeat;cursor: pointer;}
+#styleBtn:hover{opacity: 1;}
+#select ul{display: none;padding:10px 30px 15px 10px;font-size:12px;width: 160px;z-index: 15;position:absolute;background: white;box-shadow: 0px 1px 6px 1px rgba(51,51,51,0.3);-webkit-box-shadow: 0px 1px 6px 1px rgba(51,51,51,0.3);-moz-box-shadow:0px 1px 6px 1px rgba(51,51,51,0.3);left:0px;top:30px;flex-wrap:wrap;}
+#select ul li:nth-child(3),#select ul li:nth-child(4){margin-top:20px}
+#select ul li:nth-child(3):after{position:absolute;content:"";top:-10px;left:0px;width:140px;height:1px;background:#ddd;}
+#select ul li span{margin-top:2px;}
+#select.open #styleBtn{opacity: 0.7;}
+#select.open ul{display:flex;display:-webkit-flex;}
+#select ul li{ margin-right: 2px;cursor: pointer;display:flex;display:-webkit-flex;flex-direction:column; padding-top: 4px;align-items:center; width:46px; height:61px;position:relative;/* float: left; */}#select ul li:before{position:absolute;content:"";left:0px;top:0px; width:46px;height:64px;}#select ul li:hover:before{border:1px solid #ddd;}
+#select span{line-height:15px;}
+.information_input>ul>li:nth-child(4):before{position:absolute;content:"标志大小";bottom:17px;left:20px;}
+#hotPoint_input>ul>li:nth-child(1){line-height:20px}
+#hotPoint_input>ul>li:nth-child(4){line-height:16px}
+.hotPoint_content .point>div.chosen{color:#333;background:#fff;}
+.hotPoint_content .point .coordinate{background-image:url(../images/coordinate2.png);height: 16px;width: 16px;}
+.hotPoint_content .point>div.chosen .coordinate{background-image:url(../images/coordinate.png);}
+.hotPoint_content .point .delete{/* height:46px;width:46px;background-repeat: no-repeat;background-position: center center;background-image:url(../images/coordinateClose.png);background-size: initial;*/border-radius: 7px;height: 14px;width: 14px;margin-right: 14px;padding: 2px;font-size: 12px;background:transparent;transition: background 0.3s;}
+.hotPoint_content .point>div .delete::before{font-family: "FontAwesome";content: "\f00d";color: #bababa;transition: color 0.3s;}
+.hotPoint_content .point>div .delete:hover{background: #ccc;}
+.hotPoint_content .point>div.chosen .delete::before{color: #808080;}
+.hotPoint_content .point>div .delete:hover::before{color: #fff;}
+#snapPoint>div:first-child{border-top: 1px #ddd solid;margin-top:20px;} 
+#snapPoint>div:hover{background: #fff;}
+.selectButton{background: url("../images/styleButton2.png") white no-repeat;background-position:92% 50%;}
+#hotPoint_input textarea,#hotPoint_input li input,#hotPoint_input #select, #hotPoint_input label,#hotPoint_input li .right,.information_input label{width: 160px;height: 28px;line-height:28px;padding:0 8px;max-height:500px;/* overflow:auto;*//* overflow:hidden;*/border:none;}
+
+#hotPoint_input textarea{width: 160px;height: 56px;line-height:22px;padding:0 8px;background-color:#fafafa;max-height:500px;/* overflow:auto;*//* overflow:hidden;*/border:none;}
+#hotPoint_input textarea.focus,#hotPoint_input li input.white:focus{background:#fff;color:#333;border: 1px solid #09e1c0;}
+label.btn{cursor:pointer;display: inline-block;background:#09e1c0;color: #fff;text-align: center;transition: background 0.2s;letter-spacing:0.05em;}
+label.btn:hover{background:#14ebca;color:#fff;}
+#hotPoint_input label:hover,.information_input label:hover{background: #09cbae;}
+#hotPoint_input input::placeholder{font-size: 14px;color:#cccccc;}
+#hotPoint_input input:-ms-input-placeholder{font-size: 14px;color:#cccccc;}
+#hotPoint_input input::-ms-input-placeholder{font-size: 14px;color:#cccccc;}
+#hotPoint_input #hotPoint_sumbit{width: 60px;height: 28px;border:none;border-radius: 2px;-webkit-border-radius: 2px;-moz-border-radius: 2px;color: white;background: #09e1c0;text-align: center;font-size: 14px;cursor: pointer;}
+#hotPoint_input input[type="button"]:hover{background: #22f0d0;}
+.hotPoint_list{position:relative;    overflow-y: auto; overflow-x: hidden; height: calc(100% - 88px);}
+.hotPoint_list #list{/* position:absolute;*/width: 100%;flex-direction: column-reverse; border-top:1px solid #ddd;}
+.hotPoint_list #list>li{/* position:absolute;*/padding-left: 20px;display:flex;display:-webkit-flex;justify-content: flex-start;align-items: center; width: 282px;height: 48px;border-bottom: 1px solid #ddd;cursor: pointer;background: #fafafa;transition: background 0.1s;position:  relative;}
+.hotPoint_list #list>li:before{position:absolute;content:"";width:0px;height:48px;background:#09e1c0;left:0px;top:-1px;transition: width 0.2s;}
+.hotPoint_list #list>li.open:before{ width:8px !important;}
+.hotPoint_list #list>li{ background:#fff;}
+.hotPoint_list #list>li.open{  }
+.hotPoint_list #list>li:hover{background:#eee;} 
+.hotPoint_list #list div{/* display: flex;display: -webkit-flex;*/align-items: center;}
+.hotPoint_list #list>li span{padding-left: 5px;font-weight:bold;  white-space: nowrap;  overflow: hidden; text-overflow: ellipsis;}
+.hotPoint_list #list>li .delete{position: absolute;top: 0px;right: 0px;height: 48px;width: 48px;background-repeat: no-repeat;background-position: center center;background-image: url(../images/del.png);background-size: initial;}
+.hotPoint_list #list>li .delete:hover{background-color:rgba(175, 175, 175, 0.1);}
+.hotPoint_list #list>li .DelConfirm{font-size: 12px;position: absolute;width:60px;z-index: 100;background: #fff;height: 56px;border-radius: 2px;box-shadow: 0 1px 6px 0px rgba(153, 153, 153, 1);text-align: center;line-height: 28px;right: 40px;opacity:0;transform: translateX(15px) scale(0,0);transform-origin:right;transition: transform 0.1s,opacity 0.1s;}
+.hotPoint_list #list>li .DelConfirm.open{opacity:1;transform: translateX(0px) scale(1, 1);}
+/*#list>li .DelConfirm:after{content: '';width: 0;height: 0;border-top: 5px solid transparent;border-left: 8px solid #ffffff;border-bottom: 5px solid transparent;position: absolute;right: -8px;top: 25px;color: #999;}*/
+.hotPoint_list #list>li .DelConfirm>div{height:50%;}
+.hotPoint_list #list>li .DelConfirm>div:hover{background:#eee;}
+.hotPoint_list #list>li .DelConfirm .DelYes{color: rgba(224, 82, 71, 1);}
+.hotPoint_list #list>li div.left{     flex: auto;    max-width: 80%;display: flex;display: -webkit-flex;}
+#information_file{display:none;position:relative;}
+.information_show_div{display:flex;display:-webkit-flex;justify-content:space-between;padding:10px 0px 20px;}
+.information_show_div span{padding-left:20px;line-height: 24px;}
+
+.information_show_div label{width:160px;height:28px;line-height:30px;cursor:pointer;display: inline-block;background:#09e1c0;color: #fff;text-align: center;transition: background 0.2s;letter-spacing:0.05em;}
+
+input::-webkit-input-placeholder, textarea::-webkit-input-placeholder{color: #999 !important;font-weight:normal !important;}
+input:-moz-placeholder, textarea:-moz-placeholder{color:#999 !important;font-weight:normal !important;}
+input::-moz-placeholder, textarea::-moz-placeholder{color:#999 !important;font-weight:normal !important;}
+input:-ms-input-placeholder, textarea:-ms-input-placeholder{color:#999 !important;font-weight:normal !important;} 
+
+.Zprompt-popupBox{ font-family: "Microsoft YaHei"; position:absolute;top:0px;left:0px;background:rgba(0,0,0,0.3);width:100%;height:100%;z-index:200;overflow:auto;}
+.Zprompt-popupBox .center{position: absolute; left: 50%; top: 50%; transform: translateX(-50%) translateY(-50%);}
+.Zprompt-popup{padding: 0px;width:600px;height:289px;font-size:14px;box-shadow:0 0 5px #ccc;-moz-box-shadow:0 0 5px #ccc;-webkit-box-shadow:0 0 5px #ccc;color:#333;border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;background:#fff;}
+.Zprompt-title{width:600px;display:flex;display:-webkit-flex;justify-content:space-between}
+.Zprompt-title a{text-decoration:none;height:20px;width:16px;opacity: 0.7;margin:10px}
+.Zprompt-title a:hover{opacity: 1}
+.Zprompt-title h2{padding-top:45px;padding-left:50px;font-size:24px;font-weight:600;margin:0}
+.Zprompt-main-false{margin-top:15px;width:598px;height:75px;display:flex;display:-webkit-flex;align-items:center;padding-left:49px;margin-left:1px;border-bottom:2px solid #eee;border-top:2px solid #eee;font-weight:700}
+.Zprompt-main-false span{padding-left:10px;font-weight:normal;letter-spacing:1px;}
+.Zprompt-footer{width:600px;height:95px;display:flex;display:-webkit-flex;justify-content:center;align-items:flex-end}
+.Zprompt-footer a{width:120px;height:48px;background:#09e1c0;text-align:center;line-height:48px;color: white;    margin: 0 10px;}
+.Zprompt-footer a:hover{background:#01dab9}
+.Zprompt-footer a.btn1{background:#c5c5c5}
+.Zprompt-footer a.btn1:hover{background:#b1b1b1}
+
+@keyframes flash {
+  0% {  
+	opacity:0;
+  } 
+  20% { 
+	opacity:1;
+  }
+   60% { 
+
+	opacity:1;
+  }
+   100% { 
+	opacity:0;
+  } 
+} 
+.Zprompt-popupBox #Zinfo{    width: 100px; height: 140px; opacity:0;}
+.Zprompt-popupBox #Zinfo.animate{  animation: flash 1s; -webkit-animation: flash 1s; animation-iteration-count:1; } 
+.Zprompt-popupBox #Zinfo .Zimg{    width: 100%; height: 100px;  background-image:url(../images/stips.png);  
+background-repeat: no-repeat;
+background-position: center center;}
+.Zprompt-popupBox #Zinfo .Ztitle{   text-align: center;  font-size: 16px;  letter-spacing:1px;   text-shadow: 2px 2px 6px rgba(27, 27, 27, 0.81);}
+.myAccount-cutAvatar{display: none;position:absolute;top:0px;left:0px;background:rgba(0,0,0,0.3);width:100%;height:100%;z-index:200;overflow:auto;}
+.myAccount-cutAvatar .myAccount-cutAvatar-inner {width:600px;height:543px;position:absolute;background:white;left:50%;top:50%;margin-left:-300px;margin-top:-272px;}
+.myAccount-cutAvatar .myAccount-cutAvatar-top {width:100%;height:95px;border-bottom:2px solid #eeeeee;font-size:24px;display:flex;display:-webkit-flex;justify-content:space-between;}
+.myAccount-cutAvatar .myAccount-cutAvatar-top span {margin-top:40px;margin-left:50px;color: #333;font-weight: bold;}
+.myAccount-cutAvatar .myAccount-cutAvatar-top a {margin:10px;height: 16px;width: 16px;line-height: 1px;opacity: 0.7;}
+.myAccount-cutAvatar .myAccount-cutAvatar-top a:hover{opacity: 1} 
+.myAccount-cutAvatar .myAccount-cutAvatar-main {width:100%;}
+.myAccount-cutAvatar .myAccount-cutAvatar-main {display:flex;display:-webkit-flex;padding:40px 0px 0px 50px;}
+.myAccount-cutAvatar .myAccount-cutAvatar-main>div:first-child {width:500px;height:300px;background:#eeeeee;display:flex;display:-webkit-flex;justify-content:center;align-items:center;}
+.myAccount-cutAvatar .myAccount-cutAvatar-main>div:first-child img {max-width:500px;height:auto;max-height:300px;}
+.myAccount-cutAvatar .myAccount-cutAvatar-inner>div:last-child {text-align:center;}
+.myAccount-cutAvatar input {background:#09e1c0;color:white;width:122px;height:50px;font-size:14px;cursor:pointer;border:1px solid white;outline:none;}
+#discrib .preholder{text-align:center;}
+
+
+
+
+
+#hotPoint_input .project-name,#hotPoint_input .project-intro{
+  flex-direction:column;
+
+  line-height: normal;
+
+}
+#hotPoint_input .project-name input,#hotPoint_input .project-intro>div,   .project-intro{
+  width:100%;
+}
+#hotPoint_input .project-name>span,#hotPoint_input .project-intro>span{
+  margin-bottom: 8px;
+}
+
+#hotPoint_input .project-intro{
+  margin:8px 0px 10px
+}
+.information_input .project-name,.information_input .project-intro{
+   flex-direction:column;
+
+   padding: 6px 0px 10px;
+   line-height: normal;
+}
+ 
+.information_input .project-name input,.information_input .project-intro>div{
+  width:calc( 100% - 40px );
+  margin-left:20px;
+  margin-top: 5px;
+}
+.information_input .project-intro{
+ margin:0px;
+}
+#type{
+     flex-direction:column;
+   width:100%;
+   position: relative;
+   margin: 0px;
+}
+#type a{
+    width:100%;
+}
+
+.noteBox{z-index: 999;display: none;width: 282px;height: 126px;background: white;padding: 20px 0px 0px 20px;opacity: 0;transition: opacity 0.5s ease;position: absolute;}
+.noteBox-row{display: flex;display: -webkit-flex;font-size: 14px;margin-bottom: 10px;}
+.noteBox-row h3{font-size: 14px;color: #333;}
+#noteInput_text{width: 242px;height: 28px;border: 1px solid #ccc;color: #333;padding-left: 10px;}
+.noteBox-row:last-child{justify-content: flex-end;margin-right: 20px;}
+.noteBox-ok{border-radius: 2px;cursor: pointer;width: 32px;height: 20px;color: white;background: #09e1c0;font-size: 12px;display: flex;display: -webkit-flex;justify-content: center;align-items: center;}
+.noteBox-cancel{border-radius: 2px;cursor: pointer;width: 20px;height: 20px;background: #f56c6c;display: flex;display: -webkit-flex;justify-content: center;align-items: center;margin-left: 6px;}
+.noteBox.show{display: block;}
+.noteBox.active{opacity: 1;}
+
+.sizeWaring:before{color:#f56c6c !important;}
+.empty_warn{border:1px solid #f56c6c !important;color: #f56c6c !important;}
+.empty_warn::placeholder{color: #f56c6c !important;}
+
+.hide{ display:none;}
+.unable{pointer-events:none;  opacity:0.5;  }
+
+
+.editor .Main{ 
+	height:20px;
+	align-items: center;
+    display: flex;
+    justify-content: space-between;
+} 
+.editor .Main .scrollBar {
+    position: relative;
+    width: calc(96% - 45px);
+    height: 4px;
+    background-color: #c7c7c7;
+    cursor: pointer;
+}
+.editor .scrollBar .scroll_Track {
+	width: 0px;
+    height: 4px;
+    background-color: #09e1c0;
+}
+.editor .scrollBar .scroll_Thumb {
+	height: 12px;
+    width: 14px;
+    background-color: #919191;
+    /*-webkit-border-radius: 8px;
+    -moz-border-radius: 8px;
+    border-radius: 4px;
+     -webkit-box-shadow: 0px 0px 5px #74b5f5;
+    -moz-box-shadow: 0px 0px 5px #74b5f5;
+    box-shadow: 0px 0px 4px #74b5f5; */
+    position: absolute;
+    margin-top: -8px;
+    cursor: pointer;
+    -webkit-user-select: none;
+}
+.editor .BarTxt {
+	position:relative;
+	width:40px;
+}
+.editor .BarTxt .scrollBarTxt{
+    width: 100%;
+    text-align: center;
+    height: 20px;
+    border: 0;
+    /* border-radius: 4px; */
+    padding: 4px 0;
+    text-align: center;
+    color: #fff;
+    background: #919191;
+    font-size: 12px;
+}
+.editor #floorLogoSize {
+    font-size: 12px;
+    width: 160px;
+}
+.editor #floorLogoSize .slider{
+	float: left;
+    width: 100%;
+}
+
+.editor #scenePSD span{
+	line-height: 24px;
+}
+.editor #scenePSD ul.MenuOptions{
+	width: 100%;
+    overflow: hidden; 
+    background: #fff; 
+    padding: 0px;
+    cursor: pointer;
+    flex-direction: row;
+    align-items: center;
+    
+}
+.editor #scenePSD .MenuOptions li{
+	float: left; 
+	text-align:center;
+	line-height: 28px;
+	font-size:14px;
+	display:inline-block; 
+	color:#999;
+	transition:color 0.1s;
+}
+ 
+
+
+.editor .MenuOptions li.chosen{
+	background-color:#09e1c0;
+	color:#fff !important
+} 
+.editor .MenuOptions li:hover{
+	color: #333;
+}
+.editor .MenuOptions li.chosen:hover{
+	background-color:#09e1c0;
+	color:#fff;
+
+}
+
+.editor .quarterCell{
+	width: 25%;
+} 
+.editor .thirdCell{
+	width: 33.33%;
+}
+.editor .halfCell{
+	width: 50%;
+}
+
+.editor  a.button{
+	width: 100%;
+    height: 30px;
+    background: #0ed8b9;
+    display: inline-block;
+    margin-top: 10px;
+    text-align: center;
+    color: #fff; 
+}
+.editor  a.button:hover{
+	background:#04c7a9;
+}
+.editor  a.button:active{
+	background:#05a089;
+}
+
+
+.editor  #scenePSD .word{
+	margin-top:10px; 
+}
+.editor  #scenePSD .word>*{
+	float:left;
+}
+.editor  #scenePSD .word input{
+	/* width: 75%;  */
+	width:100%;
+}
+ 
+			
+img{
+	pointer-events:none;
+}
+
+ 
+
+ 
+
+
+
+.editor .selection{
+    display: block;
+    position: relative;
+    height: 30px;
+    overflow: hidden;
+    color: #000;
+    padding-right: 40px;
+    padding-left: 10px;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    background: #fff;
+    cursor: pointer;
+    outline: none;
+    line-height: 30px;
+	transition-duration:0.1s;
+	border: 1px solid white;
+}
+.editor  .selection:after{
+	content: "\f0d7";
+    display: block;
+    position: absolute;
+    top: 0;
+    right: 0;
+    width: 30px;
+    height: 30px;
+    font-family: FontAwesome;
+    text-align: center;
+    line-height: 30px;
+}
+.editor  .selection.focus{ 
+	color:#555;
+}
+.editor  ul.listOptions{
+	position: absolute;
+    left: 0px;
+    top: 56px;
+    z-index: 100;
+    width: 100%;
+    overflow: hidden; 
+    color: #9b9b9b;
+    background: #fff;
+    box-shadow: 0 5px 5px rgba(0,0,0,.3);
+	padding:0;
+	margin:0;
+	cursor:pointer;
+} 
+.editor  ul.listOptions>li{
+	height: 30px;
+    list-style-type: none;
+    color: #9b9b9b;
+    padding: 0 10px;
+    line-height: 30px;
+ /*    overflow: hidden; */
+    width:100%;
+    white-space: nowrap; 
+    margin: 0px;
+} 
+.editor  ul.listOptions>li.hover{
+    background: #fafafa;
+}
+
+#hotspot{
+	position: absolute;
+	height: 100%;
+	 
+	touch-action: none;
+	-webkit-user-select: none;
+	-webkit-user-drag: none;
+	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
+	bottom:0;
+	left: 0;
+	pointer-events: none;
+	z-index:99;
+	transition:opacity 0.1s;
+}
+#hotspot *{
+	margin: 0;
+	padding: 0;
+	border: 0;
+	font-size: 100%;
+	font: inherit;
+	vertical-align: baseline;
+	-webkit-font-smoothing: antialiased;
+}		
+ 
+
+#hotspot>*{
+	pointer-events: all;
+	position:absolute;
+	display: block; 
+	
+}
+
+  
+
+#hotspot >.markspot{
+	background-image: url(../images/markspotAll.png);
+	background-size: cover;
+	background-repeat: no-repeat;
+	background-position: center -76px;
+	width: 60px;
+	height: 76px;
+	margin-left: -32px;
+	margin-top: -62px;
+	cursor: -webkit-grab;
+} 
+#hotspot >.markspot.zero{
+	background-position: center 0;
+}
+#hotspot >.markspot.two{
+	background-position: center -152px;
+}
+
+
+ 
+
+
+.editor .hotPoint_list{
+	width: calc(100% + 12px);/* 滑动条隐藏 */
+}
+ 
+.editor .hotPoint_list #list>li div.left>img{
+	width:24px;
+}
+
+.editor #select .showStyle>div:first-child > img{
+	width:20px;
+}
+.editor #select ul li > img{
+	width:40px;
+	height: auto;
+	display: block;
+}
+ 
+.warning-border{
+	border: 1px solid #f56c6c !important;
+}
+ 
+ 
+ 
+ 
+ @keyframes flash{
+  0% {
+    opacity: 0; }
+  1% {
+    opacity: 1; }
+  30% {
+    opacity: 1; }
+  100% {
+    opacity: 0; } 
+ }
+ #webgl .snapshotFlash{
+	opacity: 0;
+    position: absolute;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+    z-index: -1;
+    background: #ffffff;
+    pointer-events: none;
+ }
+ #webgl .snapshotFlash.active{
+	z-index: 100;
+	-webkit-animation-name:flash;
+	animation-name:flash;
+	-webkit-animation-duration:1s;
+	animation-duration:1s;
+	-webkit-animation-fill-mode:both;
+	animation-fill-mode:both;
+}
+
+#webgl .snapshotGui{
+	position:absolute; 
+    z-index: 100;
+	width: calc(94% - 80px);
+    height: calc(85% - 80px);
+    border: 1px solid rgba(255,255,255,0.5); 
+    left: calc(3% + 40px);
+    top: calc(3% + 80px);
+	pointer-events: none;
+	opacity:0;
+	transition: opacity 0.3s,
+				border 0.3s;
+	
+}
+#webgl .snapshotGui .corner{
+	width:100px;
+	height:100px;
+	position:absolute;
+	transition:opacity 0.3s;
+	opacity: 0.5;
+}
+#webgl .snapshotGui.highLight .corner{
+	opacity: 0.8;
+}
+#webgl .snapshotGui.highLight{
+	border: 1px solid rgba(255,255,255,0.8); 
+}
+#webgl .snapshotGui .corner.leftTop{
+	border-top:4px solid #fff;
+	border-left:4px solid #fff;
+	left:-40px;
+	top:-40px;
+}
+#webgl .snapshotGui .corner.rightTop{
+	border-top:4px solid #fff;
+	border-right:4px solid #fff;
+	right:-40px;
+	top:-40px;
+}
+#webgl .snapshotGui .corner.leftBott{
+	border-left:4px solid #fff;
+	border-bottom:4px solid #fff;
+	left:-40px;
+	bottom:-40px;
+}
+#webgl .snapshotGui .corner.rightBott{
+	border-right: 4px solid #fff;
+    border-bottom: 4px solid #fff;
+    right: -40px;
+    bottom: -40px;
+}
+ 
+#webgl .snapshotGui .confirmSnap{
+	background: rgba(9, 225, 192, 0.9);
+    color: #fff;
+    border-radius: 5px;
+    /* margin: 0 auto; */
+    bottom: 20px;
+    position: absolute;
+    width: 220px;
+    letter-spacing: 0.1em;
+    height: 48px;
+    text-align: center;
+    line-height: 48px;
+    font-size: 16px;
+    font-weight: 100;
+    left: calc(50% - 110px);
+    font-family: SourceHanSansCN;
+	pointer-events: all;
+	cursor:pointer;
+	transition:background 0.2s;
+}
+#webgl .snapshotGui .confirmSnap:hover{
+	background:rgba(9, 225, 192, 0.78)  /* #14ebca */
+}
+
+
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+