qj-happy-common-zhongjian 1.0.27

package/src/views/pc/default/top-modules/zgltop.vue

@@ -0,0 +1,500 @@
+<template>
+	<div class="common-top-bar cephalosome">
+		<div class="halo">
+			<div class="halo_head auto">
+				<div class="halo_he">
+					<span class="color_h register" v-if="!isLogin || !userInfor">欢迎光临众管联</span>
+					<span class="color_h welcome" v-if="isLogin && userInfor">
+            <!-- <a class="login-btn">请登录</a> -->
+            <a class="show-name" href="javascript:;">{{'Hi,'}}{{userInfor.merberCompname}}</a>
+          </span>
+					<span class="bx-reg color_h" v-if="isLogin && userInfor">
+            <a @click="logout" class="quit">退出</a>
+          </span>
+				</div>
+				<div class="halo_he halo_rig">
+					<span class="color_h " style="padding: 0px;" v-if="!isLogin || !userInfor">您好，请<a href="/paas/index/index.html#/loginPc">登录</a>
+          </span>
+					<span class="color_h" style="padding: 0px; padding-right: 6px;" v-if="!isLogin || !userInfor">
+            <a style="color: #48b1e0!important;margin-left: 6px;" href="/paas/index/index.html#/regPc">免费注册</a>
+          </span>
+					<span class="color_h" style="border-left: 1px solid #ccc;" v-if="isLogin && userInfor">
+            <a href="/paas/user-manager/index.html#/user">
+              <span class="useicon bgcoloricon">
+                 <i class="iconfont icon-UCC-PC-huiyuan"></i> 
+                <!--<img alt src="../assets/hyzx.png" />-->
+              </span>会员中心
+					</a>
+					</span>
+					<span class="color_h" style="border-left: 1px solid #ccc;" v-if="!isLogin || !userInfor">
+            <a href="/paas/user-manager/index.html#/user">
+              <span class="useicon">
+                <!--<img alt src="../assets/hyzx.png" />-->
+                <i class="iconfont icon-UCC-PC-huiyuan"></i>
+              </span>会员中心
+					</a>
+					</span>
+					<span class="color_h kfbot" style="border-left: 1px solid #ccc;">
+            <a>
+              <span class="kficon">
+                <i class="iconfont icon-kefu2"></i>
+                <!--<img alt src="../assets/a13.png" />-->
+              </span>客服：0755-26855555
+					</a>
+					</span>
+				</div>
+			</div>
+		</div>
+		<slot></slot>
+	</div>
+</template>
+
+<script>
+	import { logout } from "#/api/login";
+	import { getToken, removeToken } from "#/utils/auth";
+	import API from "#/api/common/index.js";
+	import erwm from "#/assets/newerwei.png";
+
+	export default {
+		data() {
+			return {
+				gw: "暂无顾问",
+				flaggw: false,
+				myerwm: erwm,
+				show: false,
+				total: 0,
+				logins: null
+			};
+		},
+		updated() {
+			this.gw = this.th("none");
+		},
+		computed: {
+			isLogin() {
+				this.logins = this.getUserCookie() ?
+					getToken(this.getUserCookie()) :
+					false;
+				return this.getUserCookie() ? getToken(this.getUserCookie()) : false;
+			},
+			userInfor() {
+				let info =
+					this.getUserCookie() && getToken(this.getUserCookie()) ?
+					JSON.parse(getToken(this.getUserCookie())) : {};
+				return info;
+			}
+		},
+		watch: {
+			logins(newVal, oldVal) {
+				if(newVal) {
+					this.getCarNum();
+				}
+			}
+		},
+		mounted() {
+			window.addEventListener("click", this.gwhide);
+		},
+		methods: {
+			th(key) {
+				return this.$th("common.pc.default.topModules.topDefault.", key);
+			},
+			getCarNum() {
+				API.shoppingList().then(res => {
+					this.total = res && res.total;
+				});
+			},
+			gwopen() {
+				API.getCustrelByEmployee().then(res => {
+					if(res) {
+						if(res.employeePhone) {
+							this.gw = res.employeePhone;
+						} else {
+							this.gw = this.th("none");
+						}
+					} else {
+						this.gw = this.th("none");
+					}
+				});
+				this.flaggw = true;
+			},
+			gwhide() {
+				this.flaggw = false;
+			},
+			enter() {
+				this.show = true;
+			},
+			leave() {
+				this.show = false;
+			},
+			login() {
+				location.href = "/paas/pc-mall/index.html#/loginPc";
+			},
+			register() {
+				location.href = "/paas/pc-mall/index.html#/regPc";
+			},
+			logout() {
+				// 退出
+				logout().then(() => {
+					let newDomain = document.domain
+						.split(".")
+						.splice(-2)
+						.join(".");
+					removeToken("LOGININFO", newDomain, "/");
+					removeToken("personalInfo", newDomain, "/");
+					// location.reload();
+					location.href = location.origin;
+				});
+			},
+			getUserCookie() {
+				let cookie = document.cookie;
+				let start = cookie.indexOf("saas-user-");
+				if(start > -1) {
+					let end = cookie.indexOf("=", start);
+					return cookie.substring(start, end);
+				} else {
+					return null;
+				}
+			}
+		}
+	};
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+	// .common-top-bar {
+	//   position: relative;
+	//   .right{
+	//   	.cars{
+	//   		position: relative;
+	//   	}
+	//   	span{
+	//   		 display: inline-block;
+	//        color: #666666;;
+	//        border-radius: 50%;
+	//         // top: 5px;
+	//         // right: -15px;
+	//         width: 18px;
+	//         height: 18px;
+	//         text-align: center;
+	//         // line-height: 18px;
+	//         position: absolute;
+	//         font-size: 14px;
+	//   	}
+	//   }
+	// }
+	// .login-name {
+	//   float: left;
+	//   font-size: 14px;
+	//   color: #333;
+	//   span {
+	//     margin-right: 17px;
+	//   }
+	//   a {
+	//     color: #333;
+	//     margin: 0 7px;
+	//   }
+	// }
+	// .login-names {
+	//   color: #666;
+	//   span {
+	//     cursor: pointer;
+	//   }
+	//   a {
+	//     color: #666;
+	//   }
+	// }
+	// .common-top-bar {
+	//   .rignt-line {
+	//     color: #ccc;
+	//   }
+	//   color: #666;
+	//   font-size: 13px;
+	//   width: 100%;
+	//   height: 38px;
+	//   line-height: 38px;
+	//   background-color: #fafafa;
+	//   .inner {
+	//     .left {
+	//       float: left;
+	//     }
+	//     .right {
+	//       float: right;
+	//       position: relative;
+	//       span{
+	//         width: 66px;
+	//       }
+	//       ul {
+	//         margin-right: 1px;
+	//         width: 315px;
+	//         height: 38px;
+	//         li{
+	//           // float: left;
+	//           display: inline-block;
+	//         }
+	//          .li{
+	//             height: 24px;
+	//             padding: 0 23px 0;
+	//             // width: 52px;
+	//             position: relative;
+	//             // margin: 0 7px;
+	//                 a {
+	//                   display: block;
+	//                   color: #666;
+	//                   height: 38px;
+	//                   // width: 52px;
+	//                   line-height: 38px;
+	//                 }
+	//           }
+	//       }
+	//       .line {
+	//         width: 1px;
+	//         height: 16px;
+	//         background: #ccc;
+	//         margin: 12px 28px;
+	//       }
+	//       .item {
+	//         vertical-align: top;
+	//         height: 20px;
+	//         margin-top: 12px;
+	//         line-height: 20px;
+	//       }
+	//     }
+	//   }
+	// }
+	.auto {
+		margin: 0 auto;
+		width: 1200px;
+	}
+	
+	.pad-l10 {
+		padding-left: 10px;
+	}
+	
+	.cephalosome {
+		width: 100%;
+		min-width: 1200px;
+		height: 40px;
+		top: 0;
+		z-index: 9999;
+		.kfbot {
+			padding-right: 0px !important;
+			position: relative;
+			.shopping_service {
+				position: absolute;
+				top: 2rem;
+				right: -6.6rem;
+				width: 15rem;
+				display: none;
+				text-align: center;
+			}
+		}
+		.halo {
+			background: rgba(245, 245, 245, 1);
+			box-sizing: border-box;
+			font-size: 14px;
+			.useicon {
+				/*display: inline-block;
+				text-align: center;*/
+				vertical-align: sub;
+				i {
+					font-size: 22px;
+					margin-right: -7px;
+					color: #74747499;
+				}
+				img {
+					width: 20px;
+					height: 18px;
+					text-align: center;
+					line-height: 20px;
+				}
+			}
+			.bgcoloricon {}
+			.kficon {
+				width: 19px;
+				height: 20px;
+				display: inline-block;
+				text-align: center;
+				line-height: 20px;
+				color: rgba(160, 160, 160, 1);
+				margin-right: 7px;
+				i {
+					font-size: 15px;
+				}
+				img {
+					width: 24px;
+					height: 24px;
+					text-align: center;
+					line-height: 24px;
+				}
+			}
+			.halo_head {
+				width: 1200px;
+				height: 40px;
+				line-height: 39px;
+				display: -webkit-flex;
+				display: flex;
+				.register {
+					padding: 0px !important;
+				}
+				.halo_he {
+					flex: 1;
+					>span {
+						padding: 0 12px 0;
+					}
+					.color_h {
+						font-family: Microsoft YaHei;
+						font-weight: 400;
+						color: #515151;
+						a {
+							color: #515151;
+						}
+						a:hover {
+							color: #48B1E0;
+							span {
+								color: #48B1E0;
+							}
+							i {
+								color: #48B1E0;
+							}
+						}
+					}
+					#halo_version {
+						margin: 0 3% 0 1%;
+					}
+				}
+				.halo_rig {
+					text-align: right;
+				}
+			}
+		}
+		.Helmet {
+			background: white;
+			.Helmet_p {
+				position: relative;
+				height: 120px;
+				box-sizing: border-box;
+				display: -webkit-flex;
+				display: flex;
+				.Helmet_e {
+					width: 205px;
+					height: 68px;
+					overflow: hidden;
+					margin: 32px 80px 0 0;
+					.Helme_img {
+						width: 100%;
+						height: 100%;
+						img {
+							vertical-align: top;
+							width: 100%;
+							height: 100%;
+						}
+					}
+				}
+				.Helmet_w {
+					margin: 43px 0 0 20px;
+					width: 700px;
+					.Helmet_t {
+						width: 540px;
+						height: 45px;
+						margin: 0 34px 13px 57px;
+						.Helmet_input {
+							position: relative;
+							width: 518px;
+							height: 48px;
+							line-height: 48px;
+							background: white;
+							border: 1px solid #1cac43;
+							box-sizing: border-box;
+							-webkit-transition: all 0.3s;
+							transition: all 0.3s;
+							>i {
+								vertical-align: middle;
+								color: #c0c4cc;
+								font-size: 8px;
+							}
+							>input::-webkit-input-placeholder {
+								/* placeholder颜色  */
+								color: #989898;
+								/* placeholder字体大小  */
+								font-size: 14px;
+							}
+							>input {
+								width: 340px;
+								color: #989898;
+								font-size: 14px;
+							}
+							.Helmet_seek {
+								cursor: pointer;
+								display: inline-block;
+								width: 130px;
+								height: 47.9px;
+								background: #1cac43;
+								text-align: center;
+								font-size: 22px;
+								font-weight: Regular;
+								color: white;
+								border: 1px solid #1cac43;
+								box-sizing: border-box;
+								position: relative;
+								right: -1px;
+								float: right;
+								line-height: 45px;
+							}
+						}
+					}
+				}
+				.Helmet_s {
+					border: 1px solid #1cac43;
+					cursor: pointer;
+					margin-top: 43px;
+					width: 208px;
+					height: 48px;
+					.Helmet_ico {
+						display: inline-block;
+						position: relative;
+						height: 45px;
+						line-height: 44px;
+						background: white;
+						// border: 1px solid #d5d3d3;
+						font-size: 25px;
+						font-weight: 400;
+						color: #000000;
+						text-align: center;
+						padding: 0 20px;
+						.Helmet_i {
+							>i {
+								font-size: 20px !important;
+								vertical-align: middle;
+								color: #939393;
+							}
+						}
+					}
+					.mcar {
+						font-size: 16px;
+						color: #545353;
+					}
+					.ico_car {
+						width: 32px;
+						height: 32px;
+						line-height: 31px;
+						font-style: normal;
+						display: none;
+						background: #ff9e01;
+						border-radius: 50%;
+						text-align: center;
+						top: 18%;
+						right: 6.5%;
+						position: absolute;
+						font-size: 18px;
+						font-weight: 400;
+						color: rgba(255, 255, 255, 1);
+					}
+				}
+				.Helmet_V {
+					display: none;
+					position: absolute;
+					right: 0%;
+					top: 1%;
+				}
+			}
+		}
+	}
+</style>

package/src/views/routerView.vue

@@ -0,0 +1,9 @@
+<template>
+  <div>
+    <keep-alive>
+      <router-view></router-view>
+    </keep-alive>
+  </div>
+</template>
+<style lang="scss">
+</style>

package/src/views/templates/components/temp-select.vue

@@ -0,0 +1,80 @@
+<template>
+    <el-select
+            v-model.trim="item.value"
+            filterable
+            remote
+            :placeholder="'placeholder' in item ? item.placeholder : ''"
+            @change="selChange($event,item)"
+            @visible-change="valid($event,item)"
+            :remote-method="remoteMethod"
+            :loading="loading">
+        <el-option v-for="(itemOption , indexOption) in optionList" :key="indexOption" :label="'props' in item ? itemOption[item.props.label] : itemOption.label" :value="'props' in item ? itemOption[item.props.value]:itemOption.value"></el-option>
+    </el-select>
+</template>
+<script>
+import request from "#/utils/request";
+const querystring = require("querystring");
+export default {
+  props: ["item"],
+  data() {
+    return {
+      optionList: [],
+      loading: false
+    };
+  },
+  mounted() {},
+  methods: {
+    remoteMethod(query) {
+      if (query !== "") {
+        this.loading = true;
+        this.throttle(this.getOptionList(query), 500);
+      } else {
+        this.optionList = [];
+      }
+    },
+    getOptionList(val) {
+      let formData = {};
+      formData[this.item.searchParam] = val;
+      return request({
+        url: this.item.url,
+        method: "get",
+        params: formData
+      }).then(res => {
+        this.optionList = res.rows;
+        this.item.options = res.rows
+        this.loading = false;
+      });
+    },
+    throttle(fn, delay) {
+      var timer = null;
+      var startTime = Date.now();
+
+      return function() {
+        let curTime = Date.now();
+        let remaining = delay - (curTime - startTime);
+        let context = this;
+        let args = arguments;
+
+        clearTimeout(timer);
+        if (remaining <= 0) {
+          fn.apply(context, args);
+          startTime = Date.now();
+        } else {
+          timer = setTimeout(fn, remaining);
+        }
+      };
+    },
+    selChange(val, item) {
+      //select选中的事件
+      console.log(item, "目前选中的值");
+      console.log(this.temInput);
+      this.$emit("selChange", val, item);
+    },
+    valid(val, item) {
+      if(!val) {
+        this.$parent.$parent.validateField(item.name)
+      }    
+    },
+  }
+};
+</script>