diff --git a/.drone.yml b/.drone.yml
index c4a3777..4cf35bf 100644
--- a/.drone.yml
+++ b/.drone.yml
@@ -26,6 +26,9 @@ steps:
       # 将用户中心仪表盘主题 hgcloud_home 同步到运行目录
       - cp -rf /www/wwwroot/hgdemo.hgidc.cn/public/web/BlackFruit-web/clientarea/home/hgcloud_home /www/wwwroot/hgdemo.hgidc.cn/public/home/template/pc/
 
+      # 将购物车主题 hgcart 同步到运行目录
+      - cp -rf /www/wwwroot/hgdemo.hgidc.cn/public/web/BlackFruit-web/clientarea/cart/hgcart /www/wwwroot/hgdemo.hgidc.cn/public/cart/template/pc/
+
   - name: Restart Nginx
     commands:
       - nginx -s reload
diff --git a/clientarea/cart/hgcart/.gitkeep b/clientarea/cart/hgcart/.gitkeep
new file mode 100644
index 0000000..e69de29
diff --git a/clientarea/cart/hgcart/api/goodsList.js b/clientarea/cart/hgcart/api/goodsList.js
new file mode 100644
index 0000000..bcfe556
--- /dev/null
+++ b/clientarea/cart/hgcart/api/goodsList.js
@@ -0,0 +1,112 @@
+// 获取商品一级分组
+function productGroupFirst() {
+  return Axios.get(`/product/group/first`);
+}
+
+//获取商品二级分组
+function productGroupSecond(id) {
+  return Axios.get(`/product/group/second?id=${id}`, id);
+}
+
+// 商品列表
+function productGoods(params) {
+  return Axios.get(`/product`, { params });
+}
+
+// 获取可用域名后缀
+function domainSuffix(id) {
+  return Axios.get(`/idcsmart_domain/domain_suffix?host_id=${id}`);
+}
+
+// 域名查询
+function domainSearch(params) {
+  return Axios.get(`/idcsmart_domain/check_domain`, { params });
+}
+
+// 获取域名价格
+function domainPrice(params) {
+  return Axios.get(`/idcsmart_domain/get_price`, { params });
+}
+
+// 获取whois信息
+function domainWhois(params) {
+  return Axios.get(`/idcsmart_domain/whois`, { params });
+}
+
+// 加入购物车
+function addToCart(params) {
+  return Axios.post(`/cart`, params, { timeout: 1000 * 60 * 20 });
+}
+
+// 结算购物车
+function cartCheckout(params) {
+  return Axios.post(`/cart/settle`, params);
+}
+
+// 获取商品活动促销信息
+function eventPromotion(params) {
+  return Axios.get(`/event_promotion/product/${params.id}/event_promotion`, {
+    params
+  });
+}
+
+// 编辑购物车商品
+function updateCart(params) {
+  return Axios.put(`/cart/${params.position}`, params);
+}
+
+// 删除购物车商品
+function deleteCart(params) {
+  return Axios.delete(`/cart/${params.position}`, params);
+}
+
+// 批量删除购物车商品
+function deleteCartBatch(params) {
+  return Axios.delete(`/cart/batch`, { params });
+}
+
+// 信息模板列表
+function templateList(params) {
+  return Axios.get(`/idcsmart_domain/info_template`, { params });
+}
+
+// 信息模板详情
+function templateDetails(id) {
+  return Axios.get(`/idcsmart_domain/info_template/${id}`);
+}
+
+// 新建信息模板
+function templateAdd(params) {
+  return Axios.post(`/idcsmart_domain/info_template`, params);
+}
+
+// 删除信息模板
+function templateDelete(id) {
+  return Axios.delete(`/idcsmart_domain/info_template/${id}`);
+}
+
+// 信息模板实名认证
+function templateAuth(params) {
+  return Axios.post(
+    `/idcsmart_domain/info_template/${params.id}/certifications`,
+    params
+  );
+}
+
+// 支持的信息模板
+function templateSupport(params) {
+  return Axios.get(`/idcsmart_domain/info_template/support`, { params });
+}
+
+// 批量查询域名
+function domainBatch(params) {
+  return Axios.get(`/idcsmart_domain/bulk_check`, {
+    params,
+    timeout: 1000 * 60 * 20
+  });
+}
+
+// 获取域名设置
+function domainSetting() {
+  return Axios.get(`/idcsmart_domain/config`);
+}
diff --git a/clientarea/cart/hgcart/api/product.js b/clientarea/cart/hgcart/api/product.js
new file mode 100644
index 0000000..255729c
--- /dev/null
+++ b/clientarea/cart/hgcart/api/product.js
@@ -0,0 +1,35 @@
+// 获取商品列表页
+function getProduct(id) {
+  return Axios.get(`/menu/${id}/host`);
+}
+// 获取详情
+function getProductDetail(id) {
+  return Axios.get(`/host/${id}/view`);
+}
+// 获取订购页
+function getOrederConfig(params) {
+  return Axios.get(`/product/${params.id}/config_option`, { params });
+}
+// 产品详情
+function hostDetail(params) {
+  return Axios.get(`/host/${params.id}`, { params });
+}
+// 产品合同是否逾期
+function timeoutStatus(id) {
+  return Axios.get(`/e_contract/host/${id}/timeout`);
+}
+
+// 商品详情
+function apiProductDetail(params) {
+  return Axios.get(`/product/${params.id}`, { params });
+}
+
+//获取商品二级分组
+function productGroupSecond(id) {
+  return Axios.get(`/product/group/second?id=${id}`, id);
+}
+
+// 商品列表
+function productGoods(params) {
+  return Axios.get(`/product`, { params });
+}
diff --git a/clientarea/cart/hgcart/api/shopping.js b/clientarea/cart/hgcart/api/shopping.js
new file mode 100644
index 0000000..5100fdd
--- /dev/null
+++ b/clientarea/cart/hgcart/api/shopping.js
@@ -0,0 +1,48 @@
+// 获取购物车
+function cartList() {
+  return Axios.get(`/cart`);
+}
+
+//修改购物车商品数量
+function editGoodsNum(index, num) {
+  return Axios.put(`/cart/${index}/qty`, { qty: num });
+}
+
+//批量删除购物车商品
+function deleteGoods(arr) {
+  const params = { positions: arr };
+  return Axios.delete(`/cart/batch`, { data: params });
+}
+
+// 修改配置计算价格
+function configOption(id, params) {
+  return Axios.post(`/product/${id}/config_option`, params);
+}
+
+// 结算购物车
+function cart_settle(params) {
+  return Axios.post(`/cart/settle`, params);
+}
+
+// 获取商品折扣金额
+function clientLevelAmount(params) {
+  return Axios.get(`/client_level/product/${params.id}/amount`, { params });
+}
+
+// 结算商品
+function product_settle(params) {
+  return Axios.post(`/product/settle`, params);
+}
+//支付接口
+function payLisy() {
+  return Axios.get(`/gateway`);
+}
+// 修改购物车
+function updateCart(params) {
+  return Axios.put(`/cart/${params.position}`, params);
+}
+
+// 商品列表
+function productDetail(id) {
+  return Axios.get(`/product/${id}`);
+}
diff --git a/clientarea/cart/hgcart/css/goods.css b/clientarea/cart/hgcart/css/goods.css
new file mode 100644
index 0000000..ecd9f89
--- /dev/null
+++ b/clientarea/cart/hgcart/css/goods.css
@@ -0,0 +1,52 @@
+.template {
+  height: 100%;
+}
+.main-card {
+  height: 100%;
+}
+.config-box {
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+}
+.content {
+  flex: 1;
+}
+.goods-item-name {
+  cursor: pointer;
+  padding: 6px 12px;
+  border: 1px solid var(--color-primary);
+  color: var(--color-primary);
+  border-radius: 3px;
+  margin-bottom: 30px;
+  display: inline-block;
+}
+.goods-change-box {
+  max-width: 100%;
+}
+.goods-change-box .goods-item-box {
+  max-height: 500px;
+  overflow-y: auto;
+  padding: 0.2rem;
+}
+.goods-change-box .goods-item-box .goods-group-item {
+  margin-bottom: 0.3rem;
+}
+.goods-change-box .goods-item-box .goods-group-item .goods-group-name {
+  font-weight: 700;
+  font-size: 0.18rem;
+  margin-bottom: 0.15rem;
+}
+.goods-change-box .goods-item-box .goods-group-item .goods-group-info {
+  display: grid;
+  grid-template-columns: repeat(4, 1fr);
+  grid-column-gap: 15px;
+  row-gap: 0.1rem;
+}
+.goods-change-box .goods-item-box .goods-group-item .goods-group-info .option-name {
+  cursor: pointer;
+  font-size: 0.14rem;
+}
+.goods-change-box .goods-item-box .goods-group-item .goods-group-info .option-name:hover {
+  color: var(--color-primary);
+}
diff --git a/clientarea/cart/hgcart/css/goods.less b/clientarea/cart/hgcart/css/goods.less
new file mode 100644
index 0000000..05648d1
--- /dev/null
+++ b/clientarea/cart/hgcart/css/goods.less
@@ -0,0 +1,68 @@
+.template {
+  height: 100%;
+}
+
+.main-card {
+  height: 100%;
+}
+
+.config-box {
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+}
+
+.content {
+  flex: 1
+}
+
+
+
+
+.goods-item-name {
+  cursor: pointer;
+  padding: 6px 12px;
+  border: 1px solid var(--color-primary);
+  color: var(--color-primary);
+  border-radius: 3px;
+  margin-bottom: 30px;
+  display: inline-block;
+}
+
+
+.goods-change-box {
+  max-width: 100%;
+
+  .goods-item-box {
+    max-height: 500px;
+    overflow-y: auto;
+    padding: .2rem;
+
+    .goods-group-item {
+      margin-bottom: .3rem;
+
+      .goods-group-name {
+        font-weight: 700;
+        font-size: .18rem;
+        margin-bottom: .15rem;
+      }
+
+      .goods-group-info {
+        // 一行4个 grid 布局
+        display: grid;
+        grid-template-columns: repeat(4, 1fr);
+        grid-column-gap: 15px;
+        row-gap: .1rem;
+
+        .option-name {
+          cursor: pointer;
+          font-size: .14rem;
+
+          &:hover {
+            color: var(--color-primary);
+          }
+        }
+      }
+    }
+  }
+}
diff --git a/clientarea/cart/hgcart/css/goodsList.css b/clientarea/cart/hgcart/css/goodsList.css
new file mode 100644
index 0000000..1ae2b51
--- /dev/null
+++ b/clientarea/cart/hgcart/css/goodsList.css
@@ -0,0 +1,968 @@
+.main-title {
+  font-size: 0.28rem;
+  color: #171725;
+}
+.cart-des {
+  padding: 0.1rem;
+  border-radius: 0.03rem;
+  border: 1px solid #e6e7eb;
+  box-sizing: border-box;
+  overflow-y: auto;
+  margin-bottom: 0.24rem;
+}
+.cart-des * {
+  all: revert;
+}
+.main-content-box {
+  box-sizing: border-box;
+  padding-bottom: 0.1rem;
+  width: 100%;
+  border-radius: 0.03rem;
+}
+.search-box {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+.search-box .el-select {
+  width: 3.2rem;
+  font-size: 0.15rem;
+}
+.search-box .el-select .el-input__inner {
+  height: 0.46rem !important;
+  line-height: 0.46rem;
+}
+.search-box .el-select .el-input__suffix .el-input__icon {
+  line-height: 1;
+}
+.second-select {
+  margin: 0 0.1rem;
+}
+.second-select .el-input__inner {
+  height: 0.46rem;
+  line-height: 0.46rem;
+}
+.search-input {
+  width: 3.2rem;
+}
+.search-input .el-input__inner {
+  height: 0.46rem !important;
+  line-height: 0.46rem;
+}
+.search-btn {
+  margin-left: 0.1rem;
+  width: 0.8rem;
+  height: 0.46rem;
+  background: var(--color-primary);
+  border-radius: 0.03rem;
+  border: none;
+  font-size: 0.16rem;
+  color: rgba(255, 255, 255, 0.9);
+}
+.second-desc {
+  height: 0.4rem;
+  font-size: 0.14rem;
+  color: var(--color-danger);
+  background: rgba(220, 45, 45, 0.1);
+  margin-top: 0.24rem;
+  border-radius: 0.04rem;
+}
+.shopping-box {
+  box-sizing: border-box;
+  margin-top: 0.24rem;
+  min-height: 3rem;
+}
+.goods-list-div {
+  width: 100%;
+  display: grid;
+  grid-template-columns: repeat(4, 1fr);
+  row-gap: 0.2rem;
+  column-gap: 0.2rem;
+}
+.shopping-item {
+  position: relative;
+  box-sizing: border-box;
+  min-height: 2.75rem;
+  border: 1px solid #EDEDED;
+  border-radius: 0.08rem;
+  overflow: hidden;
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+  padding-bottom: 0.16rem;
+}
+.shopping-item .client-box {
+  position: absolute;
+  top: 0;
+  right: 0;
+  background-color: var(--color-primary);
+  padding: 0 0.08rem;
+  color: #fff;
+  font-size: 14px;
+  border-radius: 0px 0px 0px 8px;
+}
+.shopping-item .goods-name {
+  margin-top: 0.18rem;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  column-gap: 0.3rem;
+  padding: 0 0.16rem;
+}
+.shopping-item .goods-name .goods-name-text {
+  font-size: 16px;
+  font-weight: 700;
+  flex: 1;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.shopping-item .goods-name .qty-box {
+  font-size: 12px;
+  color: #CFD2E1;
+  flex-shrink: 0;
+  position: relative;
+}
+.shopping-item .goods-name .qty-box img {
+  position: absolute;
+  top: -0.2rem;
+  right: 0;
+  width: 0.55rem;
+  height: 0.48rem;
+}
+.shopping-item .goods-name.sold-out .goods-name-text {
+  color: #CFD2E1;
+}
+.shopping-item .goods-name.sold-out .qty-box {
+  width: 0.55rem;
+}
+.shopping-item .goods-content {
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+}
+.shopping-item .goods-active {
+  margin-top: 0.12rem;
+  padding: 0 0.16rem;
+  display: flex;
+  flex-wrap: wrap;
+  column-gap: 0.08rem;
+  row-gap: 0.08rem;
+}
+.shopping-item .goods-active .active-name {
+  font-size: 12px;
+  color: var(--color-primary);
+  background: rgba(57, 124, 252, 0.1);
+  padding: 0.03rem 0.08rem;
+  border-radius: 2px;
+}
+.shopping-item .goods-tag {
+  box-sizing: border-box;
+  height: 0.36rem;
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  row-gap: 0.08rem;
+  column-gap: 0.16rem;
+  background: rgba(57, 124, 252, 0.15);
+  padding: 0 0.16rem;
+}
+.shopping-item .goods-tag .tag-item {
+  position: relative;
+  font-size: 12px;
+  flex-shrink: 0;
+  color: var(--color-primary);
+  padding-left: 0.08rem;
+}
+.shopping-item .goods-tag .tag-item::after {
+  content: '';
+  position: absolute;
+  top: 50%;
+  left: 0;
+  width: 0.04rem;
+  height: 0.04rem;
+  transform: translateY(-50%);
+  border-radius: 50%;
+  background: rgba(57, 124, 252, 0.45);
+}
+.shopping-item .goods-description {
+  box-sizing: border-box;
+  padding: 0.24rem 0.21rem 0.22rem 0.16rem;
+  max-height: 400px;
+  min-height: 150px;
+  flex: 1;
+  overflow: auto;
+  font-size: 14px;
+  white-space: normal;
+  background: #F4F4F4;
+}
+.shopping-item .goods-description * {
+  all: revert;
+}
+.shopping-item .goods-description ul {
+  padding-left: 0.16rem;
+  margin: 0;
+}
+.shopping-item .goods-description img {
+  max-width: 100%;
+}
+.shopping-item .goods-description::-webkit-scrollbar {
+  /*滚动条整体样式*/
+  width: 0px;
+}
+.shopping-item .goods-description:hover::-webkit-scrollbar {
+  width: 4px;
+}
+.shopping-item .price-box {
+  margin-top: 0.18rem;
+  padding: 0 0.16rem;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  column-gap: 0.1rem;
+}
+.shopping-item .price-box .price-box-left {
+  text-align: right;
+  display: flex;
+  align-items: flex-end;
+  column-gap: 0.04rem;
+}
+.shopping-item .price-box .original-price {
+  font-size: 12px;
+  color: #CFD2E1;
+  text-decoration: line-through;
+}
+.shopping-item .price-box .item-price {
+  font-size: 24px;
+  color: var(--color-price-text);
+}
+.shopping-item .price-box .item-price .item-price-prefix {
+  font-size: 12px;
+}
+.shopping-item .price-box .item-price .item-price-cycle {
+  font-size: 14px;
+  color: #485169;
+}
+.shopping-item .price-box .buy-btn {
+  height: 0.3rem;
+}
+.tips {
+  color: #8692b0;
+  font-size: 0.13rem;
+  text-align: center;
+}
+.domain-box .register-type {
+  display: flex;
+  align-items: center;
+}
+.domain-box .register-type .el-divider {
+  background-color: #D8D8D8;
+  margin: 0 0.24rem;
+}
+.domain-box .register-type .reg-ridio {
+  font-size: 0.14rem;
+  color: #646464;
+  cursor: pointer;
+}
+.domain-box .register-type .isActice {
+  color: var(--color-primary);
+}
+.domain-box .domain-search {
+  margin-top: 0.32rem;
+  position: relative;
+  display: flex;
+  align-items: center;
+}
+.domain-box .domain-search .el-input {
+  height: 0.56rem;
+}
+.domain-box .domain-search .el-input .el-input__inner {
+  height: 0.56rem;
+  line-height: 0.56rem;
+}
+.domain-box .domain-search .el-input-group__append {
+  padding: 0;
+  background: #ffffff;
+  border-right: 0;
+  border-top-right-radius: 0;
+  border-bottom-right-radius: 0;
+}
+.domain-box .domain-search .input-btn {
+  width: 1.7rem;
+}
+.domain-box .domain-search .suffix-box {
+  width: 1.7rem;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  color: #2B2B2B;
+  font-size: 0.16rem;
+  cursor: pointer;
+}
+.domain-box .domain-search .suffix-box .el-icon-arrow-down {
+  font-size: 0.14rem;
+  color: #8692b0;
+  margin-left: 0.1rem;
+}
+.domain-box .domain-search .search-button {
+  height: 0.56rem;
+  padding-left: 0.7rem;
+  padding-right: 0.7rem;
+  border: none;
+  border-top-left-radius: 0;
+  border-bottom-left-radius: 0;
+  background: var(--color-primary);
+  color: #ffffff;
+  font-size: 0.16rem;
+}
+.domain-box .domain-search .suffix-list {
+  z-index: 2;
+  position: absolute;
+  top: 0.56rem;
+  left: 0;
+  display: flex;
+  flex-wrap: wrap;
+  width: calc(100% - 2.7rem);
+  padding: 0.3rem 0.23rem 0.3rem 0.46rem;
+  background: #feffff;
+  box-shadow: 0rem 0.05rem 0.1rem 0.01rem rgba(0, 0, 0, 0.1);
+  border-radius: 0.03rem 0.03rem 0.03rem 0.03rem;
+}
+.domain-box .domain-search .suffix-list .suffix-item {
+  margin-right: 0.16rem;
+  margin-bottom: 0.16rem;
+  width: 1.1rem;
+  height: 0.4rem;
+  border: 0.01rem solid #e6eaed;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  font-size: 0.16rem;
+  color: #2B2B2B;
+  cursor: pointer;
+}
+.domain-box .domain-search .suffix-list .suffix-item:hover {
+  background: rgba(0, 88, 255, 0.08);
+}
+.domain-box .domain-search .suffix-list .suffix-active {
+  background: rgba(0, 88, 255, 0.08);
+  border: 0.01rem solid var(--color-primary);
+  color: var(--color-primary);
+}
+.domain-box .batch-search-box {
+  margin-top: 0.32rem;
+}
+.domain-box .batch-search-box .batch-tips {
+  box-sizing: border-box;
+  color: #8692b0;
+  font-size: 0.14rem;
+  padding: 0.16rem;
+  border-radius: 0.04rem;
+  border: 0.01rem solid #EAEAEA;
+}
+.domain-box .batch-search-box .batch-tips .input-batch .el-textarea__inner {
+  height: 1.3rem;
+  border: none;
+  padding: 0;
+}
+.domain-box .batch-search-box .batch-btn {
+  margin-top: 0.16rem;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+.domain-box .batch-search-box .batch-btn .upload-btn {
+  display: flex;
+  align-items: center;
+  column-gap: 0.08rem;
+  font-size: 0.12rem;
+  color: var(--color-primary);
+  cursor: pointer;
+}
+.domain-box .batch-search-box .batch-btn .el-button {
+  height: 0.36rem;
+}
+.domain-box .domain-content {
+  margin-top: 0.24rem;
+  display: flex;
+  column-gap: 0.4rem;
+}
+.domain-box .domain-content .domain-left {
+  flex: 1;
+}
+.domain-box .domain-content .domain-left .domain-one {
+  height: 100%;
+}
+.domain-box .domain-content .domain-left .domain-one .domain-one-list {
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+}
+.domain-box .domain-content .domain-left .domain-one .search-title {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  font-size: 0.16rem;
+  color: #2B2B2B;
+}
+.domain-box .domain-content .domain-left .domain-one .search-title .search-fillter {
+  display: flex;
+  align-items: center;
+  column-gap: 0.08rem;
+  cursor: pointer;
+}
+.domain-box .domain-content .domain-left .domain-one .search-title .search-fillter.is_select {
+  color: var(--color-primary);
+}
+.domain-box .domain-content .domain-left .domain-one .fillter-list {
+  margin-top: 0.24rem;
+  border-radius: 8px;
+  box-sizing: border-box;
+  border: 1px solid #EAEAEA;
+  padding: 0.24rem;
+  display: flex;
+  flex-wrap: wrap;
+  gap: 0.24rem;
+}
+.domain-box .domain-content .domain-left .domain-one .fillter-list .fillter-item {
+  width: 1rem;
+  height: 0.4rem;
+  border: 0.01rem solid #e6eaed;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  font-size: 0.14rem;
+  color: #2B2B2B;
+  cursor: pointer;
+  border-radius: 0.04rem;
+}
+.domain-box .domain-content .domain-left .domain-one .fillter-list .fillter-item:hover {
+  background: rgba(0, 88, 255, 0.08);
+}
+.domain-box .domain-content .domain-left .domain-one .fillter-list .fillter-item.is_select {
+  background: rgba(0, 88, 255, 0.08);
+  border-color: var(--color-primary);
+  color: var(--color-primary);
+}
+.domain-box .domain-content .domain-left .domain-one .start-search {
+  margin-top: 0.24rem;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  flex-direction: column;
+  height: 93%;
+  border-radius: 8px;
+  border: 0.01rem solid #EAEAEA;
+}
+.domain-box .domain-content .domain-left .domain-one .start-search img {
+  width: 0.58rem;
+  height: 0.57rem;
+}
+.domain-box .domain-content .domain-left .domain-one .start-search p {
+  text-align: center;
+  margin-top: 0.19rem;
+  font-size: 0.18rem;
+  color: #2B2B2B;
+}
+.domain-box .domain-content .domain-left .domain-one .domain-list {
+  margin-top: 0.24rem;
+  background: #ffffff;
+  border: 1px solid #EAEAEA;
+  border-radius: 8px;
+  flex: 1;
+  overflow-y: auto;
+}
+.domain-box .domain-content .domain-left .domain-one .domain-list .domain-item {
+  height: 0.6rem;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  border-bottom: 0.01rem solid #ededed;
+  padding: 0 0.33rem 0 0.3rem;
+  transition: background-color 0.25s ease;
+}
+.domain-box .domain-content .domain-left .domain-one .domain-list .domain-item:hover {
+  background-color: #f5f7fa;
+}
+.domain-box .domain-content .domain-left .domain-one .domain-list .domain-item .item-left .domain-name {
+  font-size: 0.16rem;
+  color: #2B2B2B;
+}
+.domain-box .domain-content .domain-left .domain-one .domain-list .domain-item .item-left .domain-status {
+  margin-left: 0.42rem;
+  font-size: 0.13rem;
+  color: rgba(0, 0, 0, 0.6);
+}
+.domain-box .domain-content .domain-left .domain-one .domain-list .domain-item .item-right {
+  display: flex;
+  align-items: center;
+}
+.domain-box .domain-content .domain-left .domain-one .domain-list .domain-item .item-right .premium-type {
+  padding: 0.06rem 0.12rem;
+  margin-right: 0.25rem;
+  font-size: 0.14rem;
+  color: #8692b0;
+  border-radius: 0.16rem 0.16rem 0.16rem 0.16rem;
+  background: #f3f3f5;
+}
+.domain-box .domain-content .domain-left .domain-one .domain-list .domain-item .item-right .whois-box {
+  font-size: 0.14rem;
+  color: #2B2B2B;
+}
+.domain-box .domain-content .domain-left .domain-one .domain-list .domain-item .item-right .whois-box:hover {
+  color: var(--color-primary);
+  cursor: pointer;
+}
+.domain-box .domain-content .domain-left .domain-one .domain-list .domain-item .item-right .pirce-box {
+  cursor: pointer;
+}
+.domain-box .domain-content .domain-left .domain-one .domain-list .domain-item .item-right .pirce-box .original-price {
+  color: #8692b0;
+  font-size: 0.12rem;
+  text-decoration: line-through;
+  margin-right: 0.17rem;
+}
+.domain-box .domain-content .domain-left .domain-one .domain-list .domain-item .item-right .pirce-box .now-price {
+  font-size: 0.12rem;
+  color: var(--color-price-text);
+}
+.domain-box .domain-content .domain-left .domain-one .domain-list .domain-item .item-right .add-btn {
+  margin-left: 0.4rem;
+  height: 0.36rem;
+}
+.domain-box .domain-content .domain-left .batch-box {
+  height: 100%;
+}
+.domain-box .domain-content .domain-left .batch-box .batch-main {
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+}
+.domain-box .domain-content .domain-left .batch-box .batch-main .batch-search {
+  margin-top: 0.24rem;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  flex-direction: column;
+  height: 100%;
+  background: #ffffff;
+  border: 0.01rem solid #EAEAEA;
+  border-radius: 0.08rem;
+}
+.domain-box .domain-content .domain-left .batch-box .batch-main .batch-search img {
+  width: 0.58rem;
+  height: 0.57rem;
+}
+.domain-box .domain-content .domain-left .batch-box .batch-main .batch-search p {
+  text-align: center;
+  margin-top: 0.19rem;
+  font-size: 0.18rem;
+  color: #2B2B2B;
+}
+.domain-box .domain-content .domain-left .batch-box .batch-main .search-title {
+  font-size: 0.16rem;
+  color: #2B2B2B;
+}
+.domain-box .domain-content .domain-left .batch-box .batch-main .avail-list {
+  margin-top: 0.24rem;
+  background: #ffffff;
+  border: 0.01rem solid #EAEAEA;
+  border-radius: 0.08rem 0.08rem 0 0;
+  border-bottom: none;
+  max-height: 5rem;
+  overflow-y: auto;
+}
+.domain-box .domain-content .domain-left .batch-box .batch-main .el-collapse {
+  border: none;
+}
+.domain-box .domain-content .domain-left .batch-box .batch-main .batch-item {
+  height: 0.64rem;
+  box-sizing: border-box;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  border-bottom: 0.01rem solid #EAEAEA;
+  padding: 0 0.24rem;
+  transition: background-color 0.25s ease;
+}
+.domain-box .domain-content .domain-left .batch-box .batch-main .batch-item:hover {
+  background-color: #f5f7fa;
+}
+.domain-box .domain-content .domain-left .batch-box .batch-main .batch-item:nth-last-of-type(1) {
+  border-bottom: none;
+}
+.domain-box .domain-content .domain-left .batch-box .batch-main .batch-item .item-left .domain-name {
+  font-size: 0.14rem;
+  color: #2B2B2B;
+}
+.domain-box .domain-content .domain-left .batch-box .batch-main .batch-item .item-left .domain-status {
+  margin-left: 0.42rem;
+  font-size: 0.14rem;
+  color: rgba(0, 0, 0, 0.6);
+}
+.domain-box .domain-content .domain-left .batch-box .batch-main .batch-item .item-right {
+  display: flex;
+  align-items: center;
+}
+.domain-box .domain-content .domain-left .batch-box .batch-main .batch-item .item-right .premium-type {
+  padding: 0.06rem 0.12rem;
+  margin-right: 0.25rem;
+  font-size: 0.14rem;
+  color: #8692b0;
+  border-radius: 0.16rem 0.16rem 0.16rem 0.16rem;
+  background: #f3f3f5;
+}
+.domain-box .domain-content .domain-left .batch-box .batch-main .batch-item .item-right .whois-box {
+  font-size: 0.14rem;
+  color: #2B2B2B;
+}
+.domain-box .domain-content .domain-left .batch-box .batch-main .batch-item .item-right .whois-box:hover {
+  color: var(--color-primary);
+  cursor: pointer;
+}
+.domain-box .domain-content .domain-left .batch-box .batch-main .batch-item .item-right .pirce-box {
+  cursor: pointer;
+}
+.domain-box .domain-content .domain-left .batch-box .batch-main .batch-item .item-right .pirce-box .oir-price {
+  color: #8692b0;
+  font-size: 0.14rem;
+  text-decoration: line-through;
+  margin-right: 0.17rem;
+}
+.domain-box .domain-content .domain-left .batch-box .batch-main .batch-item .item-right .pirce-box .now-price {
+  font-size: 0.12rem;
+  color: var(--color-price-text);
+}
+.domain-box .domain-content .domain-left .batch-box .batch-main .batch-item .item-right .pirce-box .el-icon-arrow-down {
+  font-size: 0.12rem;
+  color: #8692b0;
+}
+.domain-box .domain-content .domain-left .batch-box .batch-main .batch-item .item-right .add-btn {
+  margin-left: 0.4rem;
+  border-radius: 0.04rem;
+}
+.domain-box .domain-content .domain-left .batch-box .batch-main .all-check {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  box-sizing: border-box;
+  padding: 0 0.24rem;
+  height: 0.64rem;
+  background: #F9F9F9;
+  color: #2B2B2B;
+  font-size: 0.14rem;
+  border: 0.01rem solid #EAEAEA;
+  border-top: none;
+  border-radius: 0 0 0.08rem 0.08rem;
+}
+.domain-box .domain-content .domain-left .batch-box .batch-main .all-check .el-button {
+  color: #ffffff;
+  font-size: 0.14rem;
+  background: var(--color-primary);
+}
+.domain-box .domain-content .domain-left .batch-box .unavail-title {
+  width: 100%;
+  font-size: 0.16rem;
+  color: #2B2B2B;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+.domain-box .domain-content .domain-left .batch-box .unavail-title .open-text {
+  cursor: pointer;
+  font-size: 0.14rem;
+  color: var(--color-primary);
+}
+.domain-box .domain-content .domain-left .batch-box .unavail-list {
+  margin-top: 0.24rem;
+  display: flex;
+  flex-wrap: wrap;
+  border-radius: 0.08rem;
+  border: 0.01rem solid #e6e7eb;
+}
+.domain-box .domain-content .domain-left .batch-box .unavail-list .unavail-item {
+  width: 50%;
+  height: 0.64rem;
+  box-sizing: border-box;
+  padding: 0.17rem 0.24rem;
+  border-bottom: 0.01rem solid #ededed;
+}
+.domain-box .domain-content .domain-left .batch-box .unavail-list .unavail-item:nth-child(odd) {
+  position: relative;
+}
+.domain-box .domain-content .domain-left .batch-box .unavail-list .unavail-item:nth-child(odd)::after {
+  content: "";
+  position: absolute;
+  top: 50%;
+  right: 0;
+  transform: translateY(-50%);
+  width: 0.01rem;
+  height: 0.32rem;
+  background: #ededed;
+}
+.domain-box .domain-content .domain-left .batch-box .unavail-list .unavail-item .unavail-name {
+  font-size: 0.14rem;
+  color: #2B2B2B;
+}
+.domain-box .domain-content .domain-left .batch-box .unavail-list .unavail-item .unavail-reason {
+  margin-left: 0.4rem;
+  color: rgba(0, 0, 0, 0.6);
+  font-size: 0.14rem;
+}
+.domain-box .domain-content .domain-right {
+  box-sizing: border-box;
+  width: 5.33rem;
+  height: 7rem;
+  flex-shrink: 0;
+}
+.domain-box .domain-content .domain-right .car-top {
+  display: flex;
+  justify-content: space-between;
+  color: #2B2B2B;
+  font-size: 0.16rem;
+}
+.domain-box .domain-content .domain-right .car-top .clear-car {
+  cursor: pointer;
+  color: #A2A2A2;
+}
+.domain-box .domain-content .domain-right .car-top .clear-car .icon {
+  fill: #A2A2A2;
+  margin-right: 0.08rem;
+}
+.domain-box .domain-content .domain-right .car-top .clear-car:hover {
+  color: var(--color-danger);
+}
+.domain-box .domain-content .domain-right .car-top .clear-car:hover .icon {
+  fill: var(--color-danger);
+}
+.domain-box .domain-content .domain-right .car-box {
+  box-sizing: border-box;
+  margin-top: 0.24rem;
+  height: 5.3rem;
+  border-radius: 8px;
+  border: 0.01rem solid #EAEAEA;
+  background: #ffffff;
+  overflow-y: auto;
+}
+.domain-box .domain-content .domain-right .car-no {
+  height: 100%;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  font-size: 0.14rem;
+  color: #8692b0;
+}
+.domain-box .domain-content .domain-right .car-list .car-item {
+  padding: 0.16rem 0.32rem;
+  border-bottom: 0.01rem solid #F6F7FB;
+}
+.domain-box .domain-content .domain-right .car-list .car-item:hover {
+  background: #F7F8F9;
+}
+.domain-box .domain-content .domain-right .car-list .car-item:hover .car-del {
+  display: block;
+}
+.domain-box .domain-content .domain-right .car-list .car-item:nth-last-of-type(1) {
+  border-bottom: none;
+}
+.domain-box .domain-content .domain-right .car-list .car-item .caritem-top,
+.domain-box .domain-content .domain-right .car-list .car-item .car-bottom {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+.domain-box .domain-content .domain-right .car-list .car-item .car-bottom {
+  color: #2B2B2B;
+  margin-top: 0.16rem;
+}
+.domain-box .domain-content .domain-right .car-list .car-item .car-name {
+  display: flex;
+  align-items: center;
+  column-gap: 0.16rem;
+}
+.domain-box .domain-content .domain-right .car-list .car-item .car-name .shop-name {
+  font-size: 0.14rem;
+  color: #2B2B2B;
+}
+.domain-box .domain-content .domain-right .car-list .car-item .car-del {
+  display: none;
+  cursor: pointer;
+  color: #9E9E9E;
+  font-size: 0.14rem;
+}
+.domain-box .domain-content .domain-right .car-list .car-item .car-del .icon {
+  fill: #9E9E9E;
+  margin-right: 0.04rem;
+}
+.domain-box .domain-content .domain-right .car-list .car-item .car-del:hover {
+  color: var(--color-danger);
+}
+.domain-box .domain-content .domain-right .car-list .car-item .car-del:hover .icon {
+  fill: var(--color-danger);
+  margin-right: 0.04rem;
+}
+.domain-box .domain-content .domain-right .car-list .car-item .car-year .el-select {
+  width: 0.96rem;
+  height: 0.36rem;
+  border-radius: 0.04rem;
+}
+.domain-box .domain-content .domain-right .car-list .car-item .car-price {
+  font-size: 0.14rem;
+  color: var(--color-price-text);
+}
+.car-money {
+  padding: 0 0.2rem;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-top: 0.26rem;
+  font-size: 0.16rem;
+  font-weight: 400;
+  color: rgba(0, 0, 0, 0.9);
+}
+.car-money .mon-right {
+  font-size: 0.14rem;
+}
+.car-money .mon-right p {
+  margin: 0;
+}
+.car-money .mon-right .original-price {
+  text-decoration: line-through;
+  color: #999;
+}
+.car-money .mon-right .original-price .hide {
+  visibility: hidden;
+}
+.car-money .money-text {
+  color: var(--color-price-text);
+}
+.car-settle {
+  margin-top: 0.2rem;
+}
+.car-settle .settle-btn {
+  width: 100%;
+  background: var(--color-primary);
+  font-size: 0.16rem;
+  color: rgba(255, 255, 255, 0.9);
+  border: none;
+  border-radius: 0;
+}
+.price-list {
+  display: flex;
+  font-size: 0.14rem;
+}
+.price-list .price-item > div {
+  width: 0.85rem;
+  height: 0.45rem;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+.price-list .price-item .price-year {
+  background: #f8fafc;
+}
+.price-list .price-item .price-new {
+  border-bottom: 1px solid #e6e7eb;
+}
+.blue-a-text {
+  color: var(--color-primary);
+  cursor: pointer;
+}
+.up-dialog .el-dialog__header {
+  display: none;
+}
+.up-dialog .el-dialog__body {
+  padding: 0.6rem 0.8rem;
+}
+.up-dialog .dia-title {
+  font-size: 0.24rem;
+  color: #171725;
+}
+.up-dialog .dia-concent {
+  margin-top: 0.3rem;
+}
+.up-dialog .dia-concent .up-tips {
+  font-size: 0.16rem;
+  color: #1e2736;
+}
+.up-dialog .dia-concent .file-box {
+  margin-top: 0.1rem;
+  display: flex;
+  align-items: center;
+}
+.up-dialog .dia-concent .file-box .file-name {
+  flex: 1;
+  border: 0.01rem solid #e6e7eb;
+  height: 0.46rem;
+  line-height: 0.46rem;
+  padding: 0 0.16rem;
+  background: rgba(102, 107, 128, 0.08);
+  font-size: 0.15rem;
+}
+.up-dialog .dia-concent .file-box .file-name:focus {
+  outline: none;
+  border: 0.01rem solid #e6e7eb;
+}
+.up-dialog .dia-concent .file-box .file-btn {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 0.12rem 0.28rem;
+  height: 0.46rem;
+  box-sizing: border-box;
+  color: #4e5259;
+  font-size: 0.16rem;
+  border: 0.01rem solid #e6e7eb;
+  margin-left: 0.1rem;
+  cursor: pointer;
+}
+.up-dialog .dia-foter {
+  display: flex;
+  justify-content: flex-end;
+  align-items: center;
+  margin-top: 0.4rem;
+}
+.up-dialog .dia-foter .confim-btn,
+.up-dialog .dia-foter .cancel-btn {
+  min-width: 1.12rem;
+  border: none;
+  border-radius: 0.03rem 0.03rem 0.03rem 0.03rem;
+  font-size: 0.16rem;
+}
+.up-dialog .dia-foter .confim-btn {
+  background: var(--color-primary);
+  color: rgba(255, 255, 255, 0.9);
+}
+.up-dialog .dia-foter .cancel-btn {
+  margin-left: 0.12rem;
+  background: #e7e7e7;
+  color: #1e2736;
+}
+.el-popover {
+  max-width: none;
+}
+@media screen and (max-width: 915px) {
+  .goods-list-div {
+    grid-template-columns: repeat(2, 1fr);
+  }
+}
+@media screen and (max-width: 750px) {
+  .goods-list-div {
+    grid-template-columns: repeat(1, 1fr);
+  }
+  .search-box .el-select .el-input__inner {
+    height: 40px !important;
+    line-height: 40px;
+  }
+  .second-select .el-input__inner {
+    height: 40px !important;
+    line-height: 40px;
+  }
+  .search-input .el-input__inner {
+    height: 40px !important;
+    line-height: 40px;
+  }
+  .search-btn {
+    height: 40px;
+  }
+}
diff --git a/clientarea/cart/hgcart/css/goodsList.less b/clientarea/cart/hgcart/css/goodsList.less
new file mode 100644
index 0000000..22e6f2e
--- /dev/null
+++ b/clientarea/cart/hgcart/css/goodsList.less
@@ -0,0 +1,1207 @@
+.main-title {
+  font-size: 0.28rem;
+  color: #171725;
+}
+
+.cart-des {
+  padding: .1rem;
+  border-radius: .03rem;
+  border: 1px solid #e6e7eb;
+  box-sizing: border-box;
+  overflow-y: auto;
+  margin-bottom: 0.24rem;
+
+  * {
+    all: revert;
+  }
+
+}
+
+
+.main-content-box {
+  box-sizing: border-box;
+  padding-bottom: 0.1rem;
+  width: 100%;
+  border-radius: 0.03rem;
+}
+
+.search-box {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
+.search-box .el-select {
+  width: 3.2rem;
+  font-size: 0.15rem;
+}
+
+.search-box .el-select .el-input__inner {
+  height: 0.46rem !important;
+
+  line-height: 0.46rem;
+}
+
+.search-box .el-select .el-input__suffix .el-input__icon {
+  line-height: 1;
+}
+
+.second-select {
+  margin: 0 0.1rem;
+}
+
+.second-select .el-input__inner {
+  height: 0.46rem;
+  line-height: 0.46rem;
+}
+
+.search-input {
+  width: 3.2rem;
+}
+
+.search-input .el-input__inner {
+  height: 0.46rem !important;
+  line-height: 0.46rem;
+}
+
+.search-btn {
+  margin-left: 0.1rem;
+  width: 0.8rem;
+  height: 0.46rem;
+  background: var(--color-primary);
+  border-radius: 0.03rem;
+  border: none;
+  font-size: 0.16rem;
+  color: rgba(255, 255, 255, 0.9);
+}
+
+.second-desc {
+  height: 0.4rem;
+  font-size: 0.14rem;
+  color: var(--color-danger);
+  background: rgba(220, 45, 45, 0.1);
+  margin-top: 0.24rem;
+  border-radius: 0.04rem;
+}
+
+.shopping-box {
+  box-sizing: border-box;
+  margin-top: 0.24rem;
+  min-height: 3rem;
+}
+
+.goods-list-div {
+  width: 100%;
+  display: grid;
+  grid-template-columns: repeat(4, 1fr);
+  row-gap: 0.2rem;
+  column-gap: 0.2rem;
+}
+
+
+
+.shopping-item {
+  position: relative;
+  box-sizing: border-box;
+  min-height: 2.75rem;
+  border: 1px solid #EDEDED;
+  border-radius: 0.08rem;
+  overflow: hidden;
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+  padding-bottom: 0.16rem;
+
+  .client-box {
+    position: absolute;
+    top: 0;
+    right: 0;
+    background-color: var(--color-primary);
+    padding: 0 0.08rem;
+    color: #fff;
+    font-size: 14px;
+    border-radius: 0px 0px 0px 8px;
+  }
+
+  .goods-name {
+    margin-top: 0.18rem;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    column-gap: 0.3rem;
+    padding: 0 0.16rem;
+
+    .goods-name-text {
+      // color: #485169;
+      font-size: 16px;
+      font-weight: 700;
+      flex: 1;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+    }
+
+    .qty-box {
+      font-size: 12px;
+      color: #CFD2E1;
+      flex-shrink: 0;
+      position: relative;
+
+
+
+      img {
+        position: absolute;
+        top: -0.2rem;
+        right: 0;
+        width: 0.55rem;
+        height: 0.48rem;
+      }
+
+    }
+
+    &.sold-out {
+      .goods-name-text {
+        color: #CFD2E1;
+      }
+
+      .qty-box {
+        width: 0.55rem;
+      }
+    }
+  }
+
+  .goods-content {
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between;
+  }
+
+  .goods-active {
+    margin-top: 0.12rem;
+    padding: 0 0.16rem;
+    display: flex;
+    flex-wrap: wrap;
+    column-gap: 0.08rem;
+    row-gap: 0.08rem;
+
+    .active-name {
+      font-size: 12px;
+      color: var(--color-primary);
+      background: rgba(57, 124, 252, 0.1);
+      padding: 0.03rem 0.08rem;
+      border-radius: 2px;
+    }
+  }
+
+  .goods-tag {
+    box-sizing: border-box;
+    height: 0.36rem;
+    display: flex;
+    flex-wrap: wrap;
+    align-items: center;
+    row-gap: 0.08rem;
+    column-gap: 0.16rem;
+    background: rgba(57, 124, 252, 0.15);
+    padding: 0 .16rem;
+
+    .tag-item {
+      position: relative;
+      font-size: 12px;
+      flex-shrink: 0;
+      color: var(--color-primary);
+      padding-left: 0.08rem;
+
+      &::after {
+        content: '';
+        position: absolute;
+        top: 50%;
+        left: 0;
+        width: 0.04rem;
+        height: 0.04rem;
+        transform: translateY(-50%);
+        border-radius: 50%;
+        background: rgba(57, 124, 252, 0.45);
+      }
+    }
+  }
+
+  .goods-description {
+    box-sizing: border-box;
+    padding: 0.24rem 0.21rem 0.22rem 0.16rem;
+    max-height: 400px;
+    min-height: 150px;
+    flex: 1;
+    overflow: auto;
+    font-size: 14px;
+    white-space: normal;
+    background: #F4F4F4;
+
+
+    * {
+      all: revert;
+    }
+
+    ul {
+      padding-left: 0.16rem;
+      margin: 0;
+    }
+
+    img {
+      max-width: 100%;
+    }
+
+    &::-webkit-scrollbar {
+      /*滚动条整体样式*/
+      width: 0px;
+    }
+
+    &:hover {
+      &::-webkit-scrollbar {
+        width: 4px;
+      }
+    }
+  }
+
+
+  .price-box {
+    margin-top: 0.18rem;
+    padding: 0 0.16rem;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    column-gap: 0.1rem;
+
+    .price-box-left {
+      text-align: right;
+      display: flex;
+      align-items: flex-end;
+      column-gap: 0.04rem;
+    }
+
+
+    .original-price {
+      font-size: 12px;
+      color: #CFD2E1;
+      text-decoration: line-through;
+    }
+
+    .item-price {
+      font-size: 24px;
+      color: var(--color-price-text);
+
+      .item-price-prefix {
+        font-size: 12px;
+      }
+
+      .item-price-cycle {
+        font-size: 14px;
+        color: #485169;
+      }
+    }
+
+    .buy-btn {
+      height: 0.3rem;
+    }
+
+  }
+}
+
+
+.tips {
+  color: #8692b0;
+  font-size: 0.13rem;
+  text-align: center;
+}
+
+.domain-box {
+  .register-type {
+    display: flex;
+    align-items: center;
+
+    .el-divider {
+      background-color: #D8D8D8;
+      margin: 0 0.24rem;
+    }
+
+    .reg-ridio {
+      font-size: 0.14rem;
+      color: #646464;
+      cursor: pointer;
+    }
+
+    .isActice {
+      color: var(--color-primary);
+    }
+  }
+
+  .domain-search {
+    margin-top: 0.32rem;
+    position: relative;
+    display: flex;
+    align-items: center;
+
+    .el-input {
+      height: 0.56rem;
+
+      .el-input__inner {
+        height: 0.56rem;
+        line-height: 0.56rem;
+      }
+    }
+
+    .el-input-group__append {
+      padding: 0;
+      background: #ffffff;
+      border-right: 0;
+      border-top-right-radius: 0;
+      border-bottom-right-radius: 0;
+    }
+
+    .input-btn {
+      width: 1.7rem;
+    }
+
+    .suffix-box {
+      width: 1.7rem;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      color: #2B2B2B;
+      font-size: 0.16rem;
+      cursor: pointer;
+
+      .el-icon-arrow-down {
+        font-size: 0.14rem;
+        color: rgba(134, 146, 176, 1);
+        margin-left: 0.1rem;
+      }
+    }
+
+    .search-button {
+      height: 0.56rem;
+      padding-left: 0.7rem;
+      padding-right: 0.7rem;
+      border: none;
+      border-top-left-radius: 0;
+      border-bottom-left-radius: 0;
+      background: var(--color-primary);
+      color: #ffffff;
+      font-size: 0.16rem;
+    }
+
+    .suffix-list {
+      // 定位在输入框下方
+      z-index: 2;
+      position: absolute;
+      top: 0.56rem;
+      left: 0;
+      display: flex;
+      flex-wrap: wrap;
+      width: calc(100% - 2.7rem);
+      padding: 0.3rem 0.23rem 0.3rem 0.46rem;
+      background: #feffff;
+      box-shadow: 0rem 0.05rem 0.1rem 0.01rem rgba(0, 0, 0, 0.1);
+      border-radius: 0.03rem 0.03rem 0.03rem 0.03rem;
+
+      .suffix-item {
+        margin-right: 0.16rem;
+        margin-bottom: 0.16rem;
+        width: 1.1rem;
+        height: 0.4rem;
+        border: 0.01rem solid #e6eaed;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        font-size: 0.16rem;
+        color: #2B2B2B;
+        cursor: pointer;
+
+        &:hover {
+          background: rgba(0, 88, 255, 0.08);
+        }
+      }
+
+      .suffix-active {
+        background: rgba(0, 88, 255, 0.08);
+        border: 0.01rem solid var(--color-primary);
+        color: var(--color-primary);
+      }
+    }
+  }
+
+  .batch-search-box {
+    margin-top: 0.32rem;
+
+    .batch-tips {
+      box-sizing: border-box;
+      color: #8692b0;
+      font-size: 0.14rem;
+      padding: 0.16rem;
+      border-radius: 0.04rem;
+      border: 0.01rem solid #EAEAEA;
+
+      .input-batch {
+        .el-textarea__inner {
+          height: 1.3rem;
+          border: none;
+          padding: 0;
+        }
+      }
+
+
+    }
+
+    .batch-btn {
+      margin-top: 0.16rem;
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+
+      .upload-btn {
+        display: flex;
+        align-items: center;
+        column-gap: 0.08rem;
+        font-size: 0.12rem;
+        color: var(--color-primary);
+        cursor: pointer;
+
+      }
+
+
+      .el-button {
+        height: 0.36rem;
+      }
+    }
+
+  }
+
+
+
+  .domain-content {
+    margin-top: 0.24rem;
+    display: flex;
+    column-gap: 0.4rem;
+
+    .domain-left {
+      flex: 1;
+
+      .domain-one {
+        height: 100%;
+
+        .domain-one-list {
+          height: 100%;
+          display: flex;
+          flex-direction: column;
+
+        }
+
+        .search-title {
+          display: flex;
+          align-items: center;
+          justify-content: space-between;
+          font-size: 0.16rem;
+          color: #2B2B2B;
+
+          .search-fillter {
+            display: flex;
+            align-items: center;
+            column-gap: 0.08rem;
+            cursor: pointer;
+
+            &.is_select {
+              color: var(--color-primary);
+            }
+          }
+        }
+
+        .fillter-list {
+          margin-top: 0.24rem;
+          border-radius: 8px;
+          box-sizing: border-box;
+          border: 1px solid #EAEAEA;
+          padding: 0.24rem;
+          display: flex;
+          flex-wrap: wrap;
+          gap: 0.24rem;
+
+          .fillter-item {
+            width: 1rem;
+            height: 0.4rem;
+            border: 0.01rem solid #e6eaed;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            font-size: 0.14rem;
+            color: #2B2B2B;
+            cursor: pointer;
+            border-radius: .04rem;
+
+            &:hover {
+              background: rgba(0, 88, 255, 0.08);
+            }
+
+            &.is_select {
+              background: rgba(0, 88, 255, 0.08);
+              border-color: var(--color-primary);
+              color: var(--color-primary);
+            }
+          }
+        }
+
+        .start-search {
+          margin-top: 0.24rem;
+          display: flex;
+          justify-content: center;
+          align-items: center;
+          flex-direction: column;
+          height: 93%;
+          border-radius: 8px;
+          border: 0.01rem solid #EAEAEA;
+
+          img {
+            width: 0.58rem;
+            height: 0.57rem;
+          }
+
+          p {
+            text-align: center;
+            margin-top: 0.19rem;
+            font-size: 0.18rem;
+            color: #2B2B2B;
+          }
+        }
+
+        .domain-list {
+          margin-top: 0.24rem;
+          background: #ffffff;
+          border: 1px solid #EAEAEA;
+          border-radius: 8px;
+          flex: 1;
+          overflow-y: auto;
+
+          .domain-item {
+            height: 0.6rem;
+            display: flex;
+            justify-content: space-between;
+            align-items: center;
+            border-bottom: 0.01rem solid #ededed;
+            padding: 0 0.33rem 0 0.3rem;
+            transition: background-color 0.25s ease;
+
+            // hover时的样式
+            &:hover {
+              background-color: #f5f7fa;
+            }
+
+            .item-left {
+              .domain-name {
+                font-size: 0.16rem;
+                color: #2B2B2B;
+              }
+
+              .domain-status {
+                margin-left: 0.42rem;
+                font-size: 0.13rem;
+                color: rgba(0, 0, 0, 0.6);
+              }
+            }
+
+            .item-right {
+              display: flex;
+              align-items: center;
+
+              .premium-type {
+                padding: 0.06rem 0.12rem;
+                margin-right: 0.25rem;
+                font-size: 0.14rem;
+                color: #8692b0;
+                border-radius: 0.16rem 0.16rem 0.16rem 0.16rem;
+                background: #f3f3f5;
+              }
+
+              .whois-box {
+                font-size: 0.14rem;
+                color: #2B2B2B;
+
+                &:hover {
+                  color: var(--color-primary);
+                  cursor: pointer;
+                }
+              }
+
+              .pirce-box {
+                cursor: pointer;
+
+                .original-price {
+                  color: #8692b0;
+                  font-size: 0.12rem;
+                  text-decoration: line-through;
+                  margin-right: 0.17rem;
+                }
+
+                .now-price {
+                  font-size: 0.12rem;
+                  color: var(--color-price-text);
+                }
+
+
+              }
+
+              .add-btn {
+                margin-left: 0.4rem;
+                height: 0.36rem;
+              }
+            }
+          }
+        }
+      }
+
+      .batch-box {
+        height: 100%;
+
+
+        .batch-main {
+          height: 100%;
+          display: flex;
+          flex-direction: column;
+
+          .batch-search {
+            margin-top: 0.24rem;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            flex-direction: column;
+            height: 100%;
+            background: #ffffff;
+            border: 0.01rem solid #EAEAEA;
+            border-radius: 0.08rem;
+
+            img {
+              width: 0.58rem;
+              height: 0.57rem;
+            }
+
+            p {
+              text-align: center;
+              margin-top: 0.19rem;
+              font-size: 0.18rem;
+              color: #2B2B2B;
+            }
+          }
+
+          .search-title {
+            font-size: 0.16rem;
+            color: #2B2B2B;
+          }
+
+          .avail-list {
+            margin-top: 0.24rem;
+            background: #ffffff;
+            border: 0.01rem solid #EAEAEA;
+            border-radius: 0.08rem 0.08rem 0 0;
+            border-bottom: none;
+            max-height: 5rem;
+            overflow-y: auto;
+
+          }
+
+          .el-collapse {
+            border: none;
+          }
+
+          .batch-item {
+            height: 0.64rem;
+            box-sizing: border-box;
+            display: flex;
+            justify-content: space-between;
+            align-items: center;
+            border-bottom: 0.01rem solid #EAEAEA;
+            padding: 0 0.24rem;
+            transition: background-color 0.25s ease;
+
+            // hover时的样式
+            &:hover {
+              background-color: #f5f7fa;
+            }
+
+            &:nth-last-of-type(1) {
+              border-bottom: none;
+            }
+
+            .item-left {
+              .domain-name {
+                font-size: 0.14rem;
+                color: #2B2B2B;
+              }
+
+              .domain-status {
+                margin-left: 0.42rem;
+                font-size: 0.14rem;
+                color: rgba(0, 0, 0, 0.6);
+              }
+            }
+
+            .item-right {
+              display: flex;
+              align-items: center;
+
+              .premium-type {
+                padding: 0.06rem 0.12rem;
+                margin-right: 0.25rem;
+                font-size: 0.14rem;
+                color: #8692b0;
+                border-radius: 0.16rem 0.16rem 0.16rem 0.16rem;
+                background: #f3f3f5;
+              }
+
+              .whois-box {
+                font-size: 0.14rem;
+                color: #2B2B2B;
+
+                &:hover {
+                  color: var(--color-primary);
+                  cursor: pointer;
+                }
+              }
+
+              .pirce-box {
+                cursor: pointer;
+
+                .oir-price {
+                  color: #8692b0;
+                  font-size: 0.14rem;
+                  text-decoration: line-through;
+                  margin-right: 0.17rem;
+                }
+
+                .now-price {
+                  font-size: 0.12rem;
+                  color: var(--color-price-text);
+                }
+
+                .el-icon-arrow-down {
+                  font-size: 0.12rem;
+                  color: rgba(134, 146, 176, 1);
+                }
+              }
+
+              .add-btn {
+                margin-left: 0.4rem;
+                border-radius: 0.04rem;
+              }
+            }
+          }
+
+          .all-check {
+            display: flex;
+            justify-content: space-between;
+            align-items: center;
+            box-sizing: border-box;
+            padding: 0 0.24rem;
+            height: 0.64rem;
+            background: #F9F9F9;
+            color: #2B2B2B;
+            font-size: 0.14rem;
+            border: 0.01rem solid #EAEAEA;
+            border-top: none;
+            border-radius: 0 0 0.08rem 0.08rem;
+
+            .el-button {
+              color: #ffffff;
+              font-size: 0.14rem;
+              background: var(--color-primary);
+            }
+          }
+        }
+
+        .unavail-title {
+          width: 100%;
+          font-size: 0.16rem;
+          color: #2B2B2B;
+          display: flex;
+          align-items: center;
+          justify-content: space-between;
+
+          .open-text {
+            cursor: pointer;
+            font-size: 0.14rem;
+            color: var(--color-primary);
+          }
+        }
+
+        .unavail-list {
+          margin-top: 0.24rem;
+          display: flex;
+          flex-wrap: wrap;
+          border-radius: 0.08rem;
+          border: 0.01rem solid #e6e7eb;
+
+          .unavail-item {
+            // 两个一行
+            width: 50%;
+            height: 0.64rem;
+            box-sizing: border-box;
+            padding: 0.17rem 0.24rem;
+            border-bottom: 0.01rem solid #ededed;
+
+            // 奇数的后面有一条竖线
+            &:nth-child(odd) {
+              position: relative;
+
+              &::after {
+                content: "";
+                position: absolute;
+                top: 50%;
+                right: 0;
+                transform: translateY(-50%);
+                width: 0.01rem;
+                height: 0.32rem;
+                background: #ededed;
+              }
+            }
+
+            .unavail-name {
+              font-size: 0.14rem;
+              color: #2B2B2B;
+            }
+
+            .unavail-reason {
+              margin-left: 0.4rem;
+              color: rgba(0, 0, 0, 0.6);
+              font-size: 0.14rem;
+            }
+          }
+        }
+      }
+    }
+
+    .domain-right {
+      box-sizing: border-box;
+      width: 5.33rem;
+      height: 7rem;
+      flex-shrink: 0;
+
+      .car-top {
+        display: flex;
+        justify-content: space-between;
+        color: #2B2B2B;
+        font-size: 0.16rem;
+
+
+        .clear-car {
+          cursor: pointer;
+          color: #A2A2A2;
+
+          .icon {
+            fill: #A2A2A2;
+            margin-right: 0.08rem;
+          }
+
+          &:hover {
+            .icon {
+              fill: var(--color-danger);
+            }
+
+            color: var(--color-danger);
+          }
+        }
+      }
+
+      .car-box {
+        box-sizing: border-box;
+        margin-top: 0.24rem;
+        height: 5.3rem;
+        border-radius: 8px;
+        border: 0.01rem solid #EAEAEA;
+        background: #ffffff;
+        overflow-y: auto;
+      }
+
+      .car-no {
+        height: 100%;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        font-size: 0.14rem;
+        color: rgba(134, 146, 176, 1);
+      }
+
+      .car-list {
+        .car-item {
+          padding: 0.16rem 0.32rem;
+          border-bottom: 0.01rem solid #F6F7FB;
+
+          &:hover {
+            background: #F7F8F9;
+
+            .car-del {
+              display: block;
+            }
+          }
+
+          &:nth-last-of-type(1) {
+            border-bottom: none;
+          }
+
+          .caritem-top,
+          .car-bottom {
+            display: flex;
+            justify-content: space-between;
+            align-items: center;
+          }
+
+          .car-bottom {
+            color: #2B2B2B;
+            margin-top: 0.16rem;
+          }
+
+          .car-name {
+            display: flex;
+            align-items: center;
+            column-gap: 0.16rem;
+
+            .shop-name {
+              font-size: 0.14rem;
+              color: #2B2B2B;
+            }
+          }
+
+          .car-del {
+            display: none;
+            cursor: pointer;
+            color: #9E9E9E;
+            font-size: 0.14rem;
+
+            .icon {
+              fill: #9E9E9E;
+              margin-right: 0.04rem;
+            }
+
+            &:hover {
+
+              .icon {
+                fill: var(--color-danger);
+                margin-right: 0.04rem;
+              }
+
+              color: var(--color-danger);
+            }
+          }
+
+          .car-year {
+            .el-select {
+              width: 0.96rem;
+              height: 0.36rem;
+              border-radius: 0.04rem;
+            }
+          }
+
+          .car-price {
+            font-size: 0.14rem;
+            color: var(--color-price-text);
+          }
+        }
+      }
+    }
+  }
+}
+
+.car-money {
+  padding: 0 0.2rem;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-top: 0.26rem;
+  font-size: 0.16rem;
+  font-weight: 400;
+  color: rgba(0, 0, 0, 0.9);
+
+  .mon-right {
+    font-size: 0.14rem;
+
+    p {
+      margin: 0;
+    }
+
+    .original-price {
+      text-decoration: line-through;
+      color: #999;
+
+      .hide {
+        visibility: hidden;
+      }
+    }
+  }
+
+  .money-text {
+    color: var(--color-price-text);
+  }
+}
+
+.car-settle {
+  margin-top: 0.2rem;
+
+  .settle-btn {
+    width: 100%;
+    background: var(--color-primary);
+    font-size: 0.16rem;
+    color: rgba(255, 255, 255, 0.9);
+    border: none;
+    border-radius: 0;
+  }
+}
+
+.price-list {
+  display: flex;
+  font-size: 0.14rem;
+
+  .price-item {
+    >div {
+      width: 0.85rem;
+      height: 0.45rem;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+    }
+
+    .price-year {
+      background: rgb(248, 250, 252);
+    }
+
+    .price-new {
+      border-bottom: 1px solid #e6e7eb;
+    }
+  }
+}
+
+.blue-a-text {
+  color: var(--color-primary);
+  cursor: pointer;
+}
+
+.up-dialog {
+  .el-dialog__header {
+    display: none;
+  }
+
+  .el-dialog__body {
+    padding: 0.6rem 0.8rem;
+  }
+
+  .dia-title {
+    font-size: 0.24rem;
+    color: #171725;
+  }
+
+  .dia-concent {
+    margin-top: 0.3rem;
+
+    .up-tips {
+      font-size: 0.16rem;
+      color: #1e2736;
+    }
+
+    .file-box {
+      margin-top: 0.1rem;
+      display: flex;
+      align-items: center;
+
+      .file-name {
+        flex: 1;
+        border: 0.01rem solid #e6e7eb;
+        height: 0.46rem;
+        line-height: 0.46rem;
+        padding: 0 0.16rem;
+        background: rgba(102, 107, 128, 0.08);
+        font-size: 0.15rem;
+
+        // 选中时的样式
+        &:focus {
+          outline: none;
+          border: 0.01rem solid #e6e7eb;
+        }
+      }
+
+      .file-btn {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        padding: 0.12rem 0.28rem;
+        height: 0.46rem;
+        box-sizing: border-box;
+        color: #4e5259;
+        font-size: 0.16rem;
+        border: 0.01rem solid #e6e7eb;
+        margin-left: 0.1rem;
+        cursor: pointer;
+      }
+    }
+  }
+
+  .dia-foter {
+    display: flex;
+    justify-content: flex-end;
+    align-items: center;
+    margin-top: 0.4rem;
+
+    .confim-btn,
+    .cancel-btn {
+      min-width: 1.12rem;
+      border: none;
+      border-radius: 0.03rem 0.03rem 0.03rem 0.03rem;
+      font-size: 0.16rem;
+    }
+
+    .confim-btn {
+      background: var(--color-primary);
+      color: rgba(255, 255, 255, 0.9);
+    }
+
+    .cancel-btn {
+      margin-left: 0.12rem;
+      background: #e7e7e7;
+      color: #1e2736;
+    }
+  }
+}
+
+.el-popover {
+  max-width: none;
+}
+
+
+
+
+@media screen and (max-width: 915px) {
+  .goods-list-div {
+    grid-template-columns: repeat(2, 1fr);
+  }
+
+
+}
+
+@media screen and (max-width: 750px) {
+
+  .goods-list-div {
+    grid-template-columns: repeat(1, 1fr);
+  }
+
+  .search-box .el-select .el-input__inner {
+    height: 40px !important;
+    line-height: 40px;
+  }
+
+  .second-select .el-input__inner {
+    height: 40px !important;
+    line-height: 40px;
+  }
+
+  .search-input .el-input__inner {
+    height: 40px !important;
+    line-height: 40px;
+  }
+
+  .search-btn {
+    height: 40px;
+  }
+}
diff --git a/clientarea/cart/hgcart/css/goods_iframe.css b/clientarea/cart/hgcart/css/goods_iframe.css
new file mode 100644
index 0000000..201ba12
--- /dev/null
+++ b/clientarea/cart/hgcart/css/goods_iframe.css
@@ -0,0 +1,34 @@
+.template {
+  height: 100%;
+}
+.config-box {
+  height: 100%;
+}
+.content {
+  height: 100%;
+  background: #fff;
+}
+.ifram-hiden {
+  display: none !important;
+}
+.l-empty {
+  width: 0 !important;
+}
+html {
+  font-size: 100px !important;
+}
+.template > .tit {
+  display: none;
+}
+.template .main-card {
+  max-width: inherit;
+}
+.common-config .common-box .order-right {
+  right: -0.2rem;
+}
+.config-box .f-order {
+  width: 100%;
+}
+.config-box .f-order .main-card {
+  height: 100%;
+}
diff --git a/clientarea/cart/hgcart/css/goods_iframe.less b/clientarea/cart/hgcart/css/goods_iframe.less
new file mode 100644
index 0000000..c44d2ed
--- /dev/null
+++ b/clientarea/cart/hgcart/css/goods_iframe.less
@@ -0,0 +1,42 @@
+.template {
+  height: 100%;
+}
+
+
+.config-box {
+  height: 100%;
+}
+
+.content {
+  height: 100%;
+  background: #fff;
+}
+
+.ifram-hiden {
+  display: none !important;
+}
+
+.l-empty {
+  width: 0 !important;
+}
+
+html {
+  font-size: 100px !important;
+}
+.template>.tit{
+  display: none;
+}
+
+.template .main-card{
+  max-width: inherit;
+}
+
+.common-config .common-box .order-right{
+  right: -.2rem;
+}
+.config-box .f-order{
+  width: 100%;
+  .main-card{
+    height: 100%;
+  }
+}
diff --git a/clientarea/cart/hgcart/css/settlement.css b/clientarea/cart/hgcart/css/settlement.css
new file mode 100644
index 0000000..1941226
--- /dev/null
+++ b/clientarea/cart/hgcart/css/settlement.css
@@ -0,0 +1,295 @@
+.main-title {
+  color: #171725;
+  font-size: 0.28rem;
+  margin-bottom: 0.4rem;
+}
+.table-name {
+  display: flex;
+  align-items: center;
+}
+.goods-name {
+  color: #171725;
+  font-weight: bold;
+  font-size: 0.16rem;
+}
+.goods-info {
+  margin-bottom: 0.1rem;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  flex-wrap: wrap;
+  font-size: 0.14rem;
+}
+.goodsInfo-price {
+  color: #1E2736;
+}
+.goodsInfo-name {
+  color: #757575;
+}
+.radio-box {
+  /* width: 80%; */
+}
+.table-content {
+  font-size: 0.14rem;
+}
+.goods-table {
+  margin-top: 0.16rem;
+  width: 100%;
+  text-align: left;
+  border: 1px solid #E6E7EB;
+  border-radius: 0.03rem;
+  border-collapse: collapse;
+}
+.info-box {
+  width: 90%;
+}
+.goods-table thead {
+  line-height: 0.46rem;
+  background: #EEF4FF;
+  height: 0.46rem;
+  color: #757575;
+}
+.goods-table tbody tr td {
+  padding-top: 0.29rem;
+  padding-bottom: 0.3rem;
+}
+.description-box {
+  width: 5.5rem;
+}
+.price-box,
+.num-box {
+  width: 2.4rem;
+}
+.total-box {
+  width: 1rem;
+}
+.delete-btn {
+  cursor: pointer;
+  font-size: 0.18rem;
+  color: #F0142F;
+}
+.item-price {
+  color: #171725;
+}
+.item-total {
+  font-weight: bold;
+  color: #171725;
+}
+.shopping-goods {
+  margin-bottom: 0.4rem;
+}
+.goods-box {
+  padding-bottom: 2.6rem;
+}
+.el-footer {
+  width: calc(100vw - 160px);
+  padding-left: 2.1rem;
+  padding-right: 1.2rem;
+  box-sizing: border-box;
+  display: flex;
+  align-items: center;
+  font-size: 0.18rem;
+  box-shadow: 0rem 0rem 0.2rem rgba(0, 0, 0, 0.15);
+  position: fixed;
+  bottom: 0;
+  background-color: #fff;
+  z-index: 9;
+}
+.footer-box {
+  width: 100%;
+  height: 100%;
+  margin: 0 auto;
+  max-width: 1500px;
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+}
+.goodsInfo-type {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  /* white-space: nowrap; */
+  color: #1E2736;
+}
+.footer-left {
+  color: #333333;
+  font-size: 0.18rem;
+  display: flex;
+  justify-content: start;
+}
+.radio-box .el-radio .el-radio__input .el-radio__inner {
+  width: 0.24rem;
+  height: 0.24rem;
+  background-color: #fff;
+}
+.radio-box .el-radio .el-radio__input .el-radio__inner::after {
+  width: 0.12rem;
+  height: 0.12rem;
+  background: var(--color-primary);
+}
+.radio-box .el-radio {
+  margin-bottom: 0.2rem;
+}
+.footer-left .radio-box .el-radio .el-radio__label {
+  font-size: 0.16rem;
+  color: #1E2736;
+}
+.footer-right {
+  font-size: 0.14rem;
+  color: #1E2736;
+  display: flex;
+}
+.total-price {
+  font-weight: bold;
+  font-size: 0.28rem;
+  color: var(--color-price-text);
+}
+.text-red {
+  color: var(--color-warning);
+}
+.btn-box {
+  position: relative;
+  margin-left: 0.4rem;
+}
+.pay-text {
+  white-space: nowrap;
+  margin-right: 0.31rem;
+  color: #333333;
+  font-size: 0.18rem;
+  font-weight: 300;
+}
+.buy-btn {
+  width: 2.04rem;
+  height: 0.46rem;
+  background: var(--color-primary);
+  border-radius: 0.04rem;
+  font-size: 0.16rem;
+  font-weight: 500;
+  color: #FFFFFF;
+}
+.delect-btn {
+  margin: 0 0.4rem;
+}
+.all-check .el-checkbox__label {
+  color: #333333;
+  font-size: 0.18rem;
+}
+.qty-num {
+  color: #4E5259;
+  height: 0.13rem;
+  margin-top: 0.1rem;
+}
+.qty-tips {
+  margin-top: 0.2rem;
+  font-size: 0.13rem;
+  color: var(--color-primary);
+}
+.check-box {
+  margin-top: 0.1rem;
+}
+.bule-text {
+  cursor: pointer;
+  color: var(--color-primary);
+}
+.totalprice-box {
+  white-space: nowrap;
+}
+.red-text {
+  color: var(--color-danger);
+}
+.original-price {
+  text-decoration: line-through;
+  color: #999999;
+}
+.discount-codeNumber {
+  margin-top: 0.08rem;
+  font-size: 0.14rem;
+  font-weight: bold;
+  color: var(--color-discount-num);
+}
+.cash-box {
+  margin-top: 0.08rem;
+}
+.remove-discountCode {
+  margin-left: 0.09rem;
+}
+.cash-codeNumber {
+  margin-top: 0.08rem;
+  cursor: pointer;
+  height: 0.32rem;
+  line-height: 0.32rem;
+  background: rgba(240, 20, 46, 0.12);
+  padding: 0 0.14rem;
+  color: var(--color-cash-num);
+  font-weight: bold;
+  font-size: 0.14rem;
+}
+@media screen and (max-width: 750px) {
+  .footer-box {
+    display: block;
+  }
+  .table-content {
+    overflow-x: auto;
+  }
+  .description-box {
+    min-width: 5.5rem;
+  }
+  .price-box {
+    min-width: 2.4rem;
+  }
+  .num-box {
+    min-width: 2.4rem;
+  }
+  .total-box {
+    min-width: 2.4rem;
+  }
+  .el-footer {
+    padding: 0.3rem;
+    width: 100%;
+    height: auto !important;
+  }
+  .el-input .el-input__inner {
+    font-size: inherit !important;
+  }
+  .bule-text {
+    cursor: pointer;
+    color: var(--color-primary);
+  }
+  .check-box {
+    margin-top: 0.1rem;
+  }
+  .footer-left {
+    display: none;
+    flex-direction: column;
+    color: #333333;
+    font-size: 0.18rem;
+  }
+  .btn-box {
+    display: flex;
+    margin-left: 0;
+    flex-direction: column-reverse;
+    align-items: self-end;
+  }
+  .delect-btn {
+    margin: 0;
+  }
+  .footer-right {
+    font-size: 0.14rem;
+    color: #1E2736;
+    display: block;
+    text-align: right;
+  }
+  .delect-goods {
+    color: var(--color-danger);
+  }
+  .buy-btn {
+    margin-left: 0;
+    margin-top: 0.2rem;
+    width: 2.04rem;
+    height: 0.46rem;
+    background: var(--color-primary);
+    border-radius: 0.04rem;
+    font-size: 0.16rem;
+    font-weight: 500;
+    color: #FFFFFF;
+  }
+}
diff --git a/clientarea/cart/hgcart/css/settlement.less b/clientarea/cart/hgcart/css/settlement.less
new file mode 100644
index 0000000..e4243cd
--- /dev/null
+++ b/clientarea/cart/hgcart/css/settlement.less
@@ -0,0 +1,364 @@
+.main-title {
+  color: #171725;
+  font-size: 0.28rem;
+  margin-bottom: 0.4rem;
+}
+
+
+
+.table-name {
+  display: flex;
+  align-items: center;
+}
+
+.goods-name {
+  color: #171725;
+  font-weight: bold;
+  font-size: 0.16rem;
+}
+
+.goods-info {
+  margin-bottom: 0.1rem;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  flex-wrap: wrap;
+  font-size: 0.14rem;
+}
+
+.goodsInfo-price {
+  color: #1E2736;
+}
+
+.goodsInfo-name {
+  color: #757575;
+}
+
+.radio-box {
+  /* width: 80%; */
+}
+
+.table-content {
+  font-size: 0.14rem;
+}
+
+.goods-table {
+  margin-top: 0.16rem;
+  width: 100%;
+  text-align: left;
+  border: 1px solid #E6E7EB;
+  border-radius: 0.03rem;
+  border-collapse: collapse;
+}
+
+.info-box {
+  width: 90%;
+}
+
+.goods-table thead {
+  line-height: 0.46rem;
+  background: #EEF4FF;
+  height: 0.46rem;
+  color: #757575;
+}
+
+.goods-table tbody tr td {
+  padding-top: 0.29rem;
+  padding-bottom: 0.3rem;
+}
+
+.description-box {
+  width: 5.5rem;
+}
+
+.price-box,
+.num-box {
+  width: 2.4rem;
+}
+
+.total-box {
+  width: 1rem;
+}
+
+.delete-btn {
+  cursor: pointer;
+  font-size: 0.18rem;
+  color: #F0142F;
+}
+
+.item-price {
+  color: #171725;
+}
+
+.item-total {
+  font-weight: bold;
+  color: #171725;
+}
+
+.shopping-goods {
+  margin-bottom: 0.4rem;
+}
+
+.goods-box {
+  padding-bottom: 2.6rem;
+}
+
+
+.el-footer {
+  width: calc(100vw - 160px);
+  padding-left: 2.1rem;
+  padding-right: 1.2rem;
+  box-sizing: border-box;
+  display: flex;
+  align-items: center;
+  font-size: 0.18rem;
+  box-shadow: 0rem 0rem 0.2rem rgba(0, 0, 0, 0.15);
+  position: fixed;
+  bottom: 0;
+  background-color: #fff;
+  z-index: 9;
+}
+
+.footer-box {
+  width: 100%;
+  height: 100%;
+  margin: 0 auto;
+  max-width: 1500px;
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+}
+
+.goodsInfo-type {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  /* white-space: nowrap; */
+  color: #1E2736;
+}
+
+.footer-left {
+  color: #333333;
+  font-size: 0.18rem;
+  display: flex;
+  justify-content: start;
+}
+
+.radio-box .el-radio .el-radio__input .el-radio__inner {
+  width: 0.24rem;
+  height: 0.24rem;
+  background-color: #fff;
+}
+
+.radio-box .el-radio .el-radio__input .el-radio__inner::after {
+  width: 0.12rem;
+  height: 0.12rem;
+  background: var(--color-primary);
+}
+
+.radio-box .el-radio {
+  margin-bottom: 0.2rem;
+}
+
+.footer-left .radio-box .el-radio .el-radio__label {
+  font-size: 0.16rem;
+  color: #1E2736;
+}
+
+.footer-right {
+  font-size: 0.14rem;
+  color: #1E2736;
+  display: flex;
+}
+
+.total-price {
+  font-weight: bold;
+  font-size: 0.28rem;
+  color: var(--color-price-text);
+}
+
+.text-red {
+  color: var(--color-warning);
+}
+
+.btn-box {
+  position: relative;
+  margin-left: 0.4rem;
+}
+
+
+
+.pay-text {
+  white-space: nowrap;
+  margin-right: 0.31rem;
+  color: #333333;
+  font-size: 0.18rem;
+  font-weight: 300;
+}
+
+.buy-btn {
+  width: 2.04rem;
+  height: 0.46rem;
+  background: var(--color-primary);
+  border-radius: 0.04rem;
+  font-size: 0.16rem;
+  font-weight: 500;
+  color: #FFFFFF;
+}
+
+.delect-btn {
+  margin: 0 0.4rem;
+}
+
+.all-check .el-checkbox__label {
+  color: #333333;
+  font-size: 0.18rem;
+}
+
+.qty-num {
+  color: #4E5259;
+  height: 0.13rem;
+  margin-top: 0.1rem;
+}
+
+.qty-tips {
+  margin-top: 0.2rem;
+  font-size: 0.13rem;
+  color: var(--color-primary);
+}
+
+.check-box {
+  margin-top: 0.1rem;
+}
+
+.bule-text {
+  cursor: pointer;
+  color: var(--color-primary);
+}
+
+.totalprice-box {
+  white-space: nowrap;
+}
+
+.red-text {
+  color: var(--color-danger);
+}
+
+.original-price {
+  text-decoration: line-through;
+  color: #999999;
+}
+
+.discount-codeNumber {
+  margin-top: 0.08rem;
+  font-size: 0.14rem;
+  font-weight: bold;
+  color: var(--color-discount-num);
+}
+
+.cash-box {
+  margin-top: 0.08rem;
+}
+
+.remove-discountCode {
+  margin-left: 0.09rem;
+}
+
+.cash-codeNumber {
+  margin-top: 0.08rem;
+  cursor: pointer;
+  height: 0.32rem;
+  line-height: 0.32rem;
+  background: rgba(240, 20, 46, 0.12);
+  padding: 0 0.14rem;
+  color: var(--color-cash-num);
+  font-weight: bold;
+  font-size: 0.14rem;
+}
+
+@media screen and (max-width: 750px) {
+  .footer-box {
+    display: block;
+  }
+
+  .table-content {
+    overflow-x: auto;
+  }
+
+  .description-box {
+    min-width: 5.5rem;
+  }
+
+  .price-box {
+    min-width: 2.4rem;
+  }
+
+  .num-box {
+    min-width: 2.4rem;
+  }
+
+  .total-box {
+    min-width: 2.4rem;
+  }
+
+  .el-footer {
+    padding: 0.3rem;
+    width: 100%;
+    height: auto !important;
+  }
+
+  .el-input .el-input__inner {
+    font-size: inherit !important;
+  }
+
+  .bule-text {
+    cursor: pointer;
+    color: var(--color-primary);
+  }
+
+  .check-box {
+    margin-top: 0.1rem;
+  }
+
+  .footer-left {
+    display: none;
+    flex-direction: column;
+    color: #333333;
+    font-size: 0.18rem;
+  }
+
+  .btn-box {
+    display: flex;
+    margin-left: 0;
+    flex-direction: column-reverse;
+    align-items: self-end;
+  }
+
+  .delect-btn {
+    margin: 0;
+  }
+
+  .footer-right {
+    font-size: 0.14rem;
+    color: #1E2736;
+    display: block;
+    text-align: right;
+  }
+
+  .delect-goods {
+    color: var(--color-danger);
+  }
+
+  .buy-btn {
+    margin-left: 0;
+    margin-top: 0.2rem;
+    width: 2.04rem;
+    height: 0.46rem;
+    background: var(--color-primary);
+    border-radius: 0.04rem;
+    font-size: 0.16rem;
+    font-weight: 500;
+    color: #FFFFFF;
+  }
+
+
+}
diff --git a/clientarea/cart/hgcart/css/shoppingCar.css b/clientarea/cart/hgcart/css/shoppingCar.css
new file mode 100644
index 0000000..01d6787
--- /dev/null
+++ b/clientarea/cart/hgcart/css/shoppingCar.css
@@ -0,0 +1,281 @@
+.main-title {
+  color: #171725;
+  font-size: 0.28rem;
+  margin-bottom: 0.4rem;
+}
+.search-box {
+  margin-top: -0.62rem;
+  margin-bottom: 0.1rem;
+  text-align: right;
+}
+.search-box .el-input {
+  width: 3.2rem;
+}
+.search-box .el-input .el-input__inner {
+  height: 46px;
+  line-height: 46px;
+}
+.table-name {
+  display: flex;
+  align-items: center;
+}
+.goods-name {
+  color: #171725;
+  font-weight: bold;
+  font-size: 0.16rem;
+}
+.el-link.el-link--primary {
+  margin-left: 0.08rem;
+  color: var(--color-primary);
+  font-size: 0.14rem;
+}
+.table-content {
+  font-size: 0.14rem;
+}
+.goods-table {
+  margin-top: 0.16rem;
+  width: 100%;
+  text-align: left;
+  border: 1px solid #e6e7eb;
+  border-radius: 0.03rem;
+  border-collapse: collapse;
+}
+.goods-table thead {
+  line-height: 0.46rem;
+  background: #eef4ff;
+  height: 0.46rem;
+  color: #757575;
+}
+.goods-table tbody tr td {
+  padding-top: 0.29rem;
+  padding-bottom: 0.3rem;
+}
+.description-box {
+  width: 5.5rem;
+}
+.price-box {
+  width: 4rem;
+}
+.total-box {
+  min-width: 1.5rem;
+}
+.num-box {
+  width: 2.4rem;
+}
+.action-box {
+  width: 1rem;
+}
+.delete-btn {
+  cursor: pointer;
+  font-size: 0.18rem;
+  color: var(--color-danger);
+}
+.item-price {
+  color: #171725;
+}
+.item-total {
+  font-size: 0.14rem;
+  font-weight: bold;
+  color: #171725;
+}
+.original-price {
+  text-decoration: line-through;
+  color: #999999;
+}
+.discount-codeNumber {
+  font-size: 0.12rem;
+  font-weight: bold;
+  color: var(--color-discount-num);
+}
+.remove-discountCode {
+  cursor: pointer;
+  margin-left: 0.09rem;
+}
+.shopping-goods {
+  margin-bottom: 0.4rem;
+}
+.goods-box {
+  padding-bottom: 1.6rem;
+}
+.el-footer {
+  width: calc(100vw - 160px);
+  padding-left: 2.1rem;
+  padding-right: 1.2rem;
+  box-sizing: border-box;
+  font-size: 0.18rem;
+  box-shadow: 0rem 0rem 0.2rem rgba(0, 0, 0, 0.15);
+  height: 1.6rem !important;
+  position: fixed;
+  bottom: 0;
+  background-color: #fff;
+  z-index: 9;
+}
+.footer-box {
+  height: 100%;
+  margin: 0 auto;
+  max-width: 1500px;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+.no-goods-td {
+  display: flex;
+  align-items: center;
+  width: 4.8rem;
+}
+.no-goods-tips {
+  color: #8692b0;
+  font-size: 0.13rem;
+  font-weight: 500;
+  white-space: nowrap;
+}
+.buy-again-btn {
+  margin-left: 0.1rem;
+  background: #e1f0ff;
+  height: 0.32rem;
+  min-width: 0.6rem;
+  border-radius: 0.03rem;
+  font-size: 0.14rem;
+  font-weight: 400;
+  color: var(--color-primary);
+}
+.footer-left {
+  color: #333333;
+  font-size: 0.18rem;
+}
+.footer-right {
+  font-size: 0.14rem;
+  color: #1e2736;
+  display: flex;
+  align-items: center;
+}
+.total-price {
+  font-weight: bold;
+  font-size: 0.28rem;
+  color: var(--color-price-text);
+}
+.text-red {
+  color: var(--color-warning);
+}
+.goods-info {
+  margin-bottom: 0.1rem;
+  display: flex;
+  justify-content: space-between;
+  font-size: 0.14rem;
+}
+.goodsInfo-price {
+  color: #1e2736;
+}
+.goodsInfo-type {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  /* white-space: nowrap; */
+  width: 80%;
+  color: #1e2736;
+}
+.goodsInfo-name {
+  color: #757575;
+}
+.buy-btn {
+  margin-left: 0.4rem;
+  width: 2.04rem;
+  height: 0.46rem;
+  background: var(--color-primary);
+  border-radius: 0.04rem;
+  font-size: 0.16rem;
+  font-weight: 500;
+  color: #ffffff;
+}
+.delect-btn {
+  margin: 0 0.4rem;
+}
+.mar-left-24 {
+  margin-left: 24px;
+}
+.info-box {
+  width: 90%;
+}
+.all-check .el-checkbox__label {
+  color: #333333;
+  font-size: 0.18rem;
+}
+.qty-num {
+  color: #4e5259;
+  height: 0.13rem;
+  margin-top: 0.1rem;
+}
+.qty-tips {
+  margin-top: 0.2rem;
+  font-size: 0.13rem;
+  color: #3699ff;
+}
+.red-text {
+  color: var(--color-danger);
+}
+.discount-box {
+  margin-top: 0.08rem;
+  font-size: 0.14rem;
+  font-weight: 400;
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  column-gap: 0.05rem;
+  row-gap: 0.05rem;
+}
+@media screen and (max-width: 750px) {
+  .table-content {
+    overflow-x: auto;
+  }
+  .search-box .el-input {
+    width: 4.2rem;
+  }
+  .description-box {
+    min-width: 5.5rem;
+  }
+  .price-box {
+    min-width: 4rem;
+  }
+  .num-box {
+    min-width: 2.5rem;
+  }
+  .action-box {
+    min-width: 1.5rem;
+  }
+  .el-footer {
+    padding: 0 0.3rem;
+    width: 100%;
+  }
+  .el-input .el-input__inner {
+    font-size: inherit !important;
+  }
+  .footer-left {
+    display: flex;
+    flex-direction: column;
+    color: #333333;
+    font-size: 0.18rem;
+  }
+  .delect-btn {
+    margin: 0;
+  }
+  .footer-right {
+    font-size: 0.14rem;
+    color: #1e2736;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+  }
+  .delect-goods {
+    color: var(--color-danger);
+  }
+  .buy-btn {
+    margin-left: 0;
+    margin-top: 0.2rem;
+    width: 2.04rem;
+    height: 0.46rem;
+    background: var(--color-primary);
+    border-radius: 0.04rem;
+    font-size: 0.16rem;
+    font-weight: 500;
+    color: #ffffff;
+  }
+}
diff --git a/clientarea/cart/hgcart/css/shoppingCar.less b/clientarea/cart/hgcart/css/shoppingCar.less
new file mode 100644
index 0000000..8d11956
--- /dev/null
+++ b/clientarea/cart/hgcart/css/shoppingCar.less
@@ -0,0 +1,339 @@
+.main-title {
+  color: #171725;
+  font-size: 0.28rem;
+  margin-bottom: 0.4rem;
+}
+
+.search-box {
+  margin-top: -0.62rem;
+  margin-bottom: 0.1rem;
+  text-align: right;
+}
+
+.search-box .el-input {
+  width: 3.2rem;
+}
+
+.search-box .el-input .el-input__inner {
+  height: 46px;
+  line-height: 46px;
+}
+
+.table-name {
+  display: flex;
+  align-items: center;
+}
+
+.goods-name {
+  color: #171725;
+  font-weight: bold;
+  font-size: 0.16rem;
+}
+
+.el-link.el-link--primary {
+  margin-left: 0.08rem;
+  color: var(--color-primary);
+  font-size: 0.14rem;
+}
+
+.table-content {
+  font-size: 0.14rem;
+}
+
+.goods-table {
+  margin-top: 0.16rem;
+  width: 100%;
+  text-align: left;
+  border: 1px solid #e6e7eb;
+  border-radius: 0.03rem;
+  border-collapse: collapse;
+}
+
+.goods-table thead {
+  line-height: 0.46rem;
+  background: #eef4ff;
+  height: 0.46rem;
+  color: #757575;
+}
+
+.goods-table tbody tr td {
+  padding-top: 0.29rem;
+  padding-bottom: 0.3rem;
+}
+
+.description-box {
+  width: 5.5rem;
+}
+
+.price-box {
+  width: 4rem;
+}
+
+.total-box {
+  min-width: 1.5rem;
+}
+
+.num-box {
+  width: 2.4rem;
+}
+
+.action-box {
+  width: 1rem;
+}
+
+.delete-btn {
+  cursor: pointer;
+  font-size: 0.18rem;
+  color: var(--color-danger);
+}
+
+.item-price {
+  color: #171725;
+}
+
+.item-total {
+  font-size: 0.14rem;
+  font-weight: bold;
+  color: #171725;
+}
+
+.original-price {
+  text-decoration: line-through;
+  color: #999999;
+}
+
+.discount-codeNumber {
+  font-size: 0.12rem;
+  font-weight: bold;
+  color: var(--color-discount-num);
+}
+
+.remove-discountCode {
+  cursor: pointer;
+  margin-left: 0.09rem;
+}
+
+.shopping-goods {
+  margin-bottom: 0.4rem;
+}
+
+.goods-box {
+  padding-bottom: 1.6rem;
+}
+
+.el-footer {
+  width: calc(100vw - 160px);
+  padding-left: 2.1rem;
+  padding-right: 1.2rem;
+  box-sizing: border-box;
+  font-size: 0.18rem;
+  box-shadow: 0rem 0rem 0.2rem rgba(0, 0, 0, 0.15);
+  height: 1.6rem !important;
+  position: fixed;
+  bottom: 0;
+  background-color: #fff;
+  z-index: 9;
+}
+
+.footer-box {
+  height: 100%;
+  margin: 0 auto;
+  max-width: 1500px;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+
+.no-goods-td {
+  display: flex;
+  align-items: center;
+  width: 4.8rem;
+}
+
+.no-goods-tips {
+  color: #8692b0;
+  font-size: 0.13rem;
+  font-weight: 500;
+  white-space: nowrap;
+}
+
+.buy-again-btn {
+  margin-left: 0.1rem;
+  background: #e1f0ff;
+  height: 0.32rem;
+  min-width: 0.6rem;
+  border-radius: 0.03rem;
+  font-size: 0.14rem;
+  font-weight: 400;
+  color: var(--color-primary);
+}
+
+.footer-left {
+  color: #333333;
+  font-size: 0.18rem;
+}
+
+.footer-right {
+  font-size: 0.14rem;
+  color: #1e2736;
+  display: flex;
+  align-items: center;
+}
+
+.total-price {
+  font-weight: bold;
+  font-size: 0.28rem;
+  color: var(--color-price-text);
+}
+
+.text-red {
+  color: var(--color-warning);
+}
+
+.goods-info {
+  margin-bottom: 0.1rem;
+  display: flex;
+  justify-content: space-between;
+  font-size: 0.14rem;
+}
+
+.goodsInfo-price {
+  color: #1e2736;
+}
+
+.goodsInfo-type {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  /* white-space: nowrap; */
+  width: 80%;
+  color: #1e2736;
+}
+
+.goodsInfo-name {
+  color: #757575;
+}
+
+.buy-btn {
+  margin-left: 0.4rem;
+  width: 2.04rem;
+  height: 0.46rem;
+  background: var(--color-primary);
+  border-radius: 0.04rem;
+  font-size: 0.16rem;
+  font-weight: 500;
+  color: #ffffff;
+}
+
+.delect-btn {
+  margin: 0 0.4rem;
+}
+
+.mar-left-24 {
+  margin-left: 24px;
+}
+
+.info-box {
+  width: 90%;
+}
+
+.all-check .el-checkbox__label {
+  color: #333333;
+  font-size: 0.18rem;
+}
+
+.qty-num {
+  color: #4e5259;
+  height: 0.13rem;
+  margin-top: 0.1rem;
+}
+
+.qty-tips {
+  margin-top: 0.2rem;
+  font-size: 0.13rem;
+  color: #3699ff;
+}
+
+.red-text {
+  color: var(--color-danger);
+}
+
+.discount-box {
+  margin-top: 0.08rem;
+  font-size: 0.14rem;
+  font-weight: 400;
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  column-gap: 0.05rem;
+  row-gap: 0.05rem;
+}
+
+@media screen and (max-width: 750px) {
+  .table-content {
+    overflow-x: auto;
+  }
+
+  .search-box .el-input {
+    width: 4.2rem;
+  }
+
+  .description-box {
+    min-width: 5.5rem;
+  }
+
+  .price-box {
+    min-width: 4rem;
+  }
+
+  .num-box {
+    min-width: 2.5rem;
+  }
+
+  .action-box {
+    min-width: 1.5rem;
+  }
+
+  .el-footer {
+    padding: 0 0.3rem;
+    width: 100%;
+  }
+
+  .el-input .el-input__inner {
+    font-size: inherit !important;
+  }
+
+  .footer-left {
+    display: flex;
+    flex-direction: column;
+    color: #333333;
+    font-size: 0.18rem;
+  }
+
+  .delect-btn {
+    margin: 0;
+  }
+
+  .footer-right {
+    font-size: 0.14rem;
+    color: #1e2736;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+  }
+
+  .delect-goods {
+    color: var(--color-danger);
+  }
+
+  .buy-btn {
+    margin-left: 0;
+    margin-top: 0.2rem;
+    width: 2.04rem;
+    height: 0.46rem;
+    background: var(--color-primary);
+    border-radius: 0.04rem;
+    font-size: 0.16rem;
+    font-weight: 500;
+    color: #ffffff;
+  }
+}
diff --git a/clientarea/cart/hgcart/goods.php b/clientarea/cart/hgcart/goods.php
new file mode 100644
index 0000000..0411cec
--- /dev/null
+++ b/clientarea/cart/hgcart/goods.php
@@ -0,0 +1,57 @@
+<script src="/{$template_catalog}/template/{$themes}/js/common/jquery.mini.js"></script>
+<link rel="stylesheet" href="/{$template_catalog_cart}/template/{$themes_cart}/css/goods.css">
+</head>
+
+<body>
+  <!-- mounted之前显示 -->
+  <div id="mainLoading">
+    <div class="ddr ddr1"></div>
+    <div class="ddr ddr2"></div>
+    <div class="ddr ddr3"></div>
+    <div class="ddr ddr4"></div>
+    <div class="ddr ddr5"></div>
+  </div>
+  <div class="goods">
+
+    <el-container>
+      <aside-menu></aside-menu>
+      <el-container>
+        <top-menu :num="shoppingCarNum"></top-menu>
+        <el-main>
+          <!-- 自己的东西 -->
+          <!-- 后端渲染出来的配置页面 -->
+          <div class="config-box">
+            <el-popover placement="bottom-start" trigger="hover" popper-class="goods-change-box"
+              v-if="commonData.cart_change_product == 1">
+              <div class="goods-item-name" slot="reference">
+                {{secProductGroupList[0]?.goodsList[0]?.product_group_name_first}}
+                <i class="el-icon-arrow-down el-icon--right"></i>
+              </div>
+              <div class="goods-item-box">
+                <el-input style="width:2rem; margin-bottom: .2rem;" v-model="fillterKey" suffix-icon="el-icon-search"
+                  clearable :placeholder="lang.search_placeholder">
+                </el-input>
+                <div class="goods-group-item" v-for="item in calcProductGroup" :key="item.id">
+                  <div class="goods-group-name">{{item.name}}</div>
+                  <div class="goods-group-info">
+                    <div class="option-name" v-for="option in item.goodsList" @click="handleCommand(option.id)">
+                      {{option.name}}
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </el-popover>
+            <div class="content"></div>
+          </div>
+        </el-main>
+      </el-container>
+    </el-container>
+  </div>
+  <!-- =======页面独有======= -->
+  <script src="/{$template_catalog}/template/{$themes}/components/payDialog/payDialog.js"></script>
+  <script src="/{$template_catalog_cart}/template/{$themes_cart}/api/product.js"></script>
+  <script src="/{$template_catalog}/template/{$themes}/components/pagination/pagination.js"></script>
+  <script src="/{$template_catalog}/template/{$themes}/components/discountCode/discountCode.js"></script>
+  <script src="/{$template_catalog}/template/{$themes}/components/eventCode/eventCode.js"></script>
+  <script src="/{$template_catalog}/template/{$themes}/components/customGoods/customGoods.js"></script>
+  <script src="/{$template_catalog_cart}/template/{$themes_cart}/js/goods.js"></script>
diff --git a/clientarea/cart/hgcart/goodsList.php b/clientarea/cart/hgcart/goodsList.php
new file mode 100644
index 0000000..4eb438f
--- /dev/null
+++ b/clientarea/cart/hgcart/goodsList.php
@@ -0,0 +1,457 @@
+<!-- 页面独有样式 -->
+<link rel="stylesheet" href="/{$template_catalog_cart}/template/{$themes_cart}/css/goodsList.css">
+</head>
+
+<body>
+  <!-- mounted之前显示 -->
+  <div id="mainLoading">
+    <div class="ddr ddr1"></div>
+    <div class="ddr ddr2"></div>
+    <div class="ddr ddr3"></div>
+    <div class="ddr ddr4"></div>
+    <div class="ddr ddr5"></div>
+  </div>
+  <div class="template">
+    <el-container>
+      <aside-menu @getruleslist="getRule"></aside-menu>
+      <el-container>
+        <top-menu></top-menu>
+        <el-main>
+          <!-- 自己的东西 -->
+          <div class="main-card">
+            <div v-if="commonData.cart_instruction == 1 && commonData.cart_instruction_content" class="cart-des"
+              v-html="commonData.cart_instruction_content">
+            </div>
+            <div class="main-title" v-else>{{lang.new_goods}}</div>
+            <div class="main-content-box">
+              <div class="search-box">
+                <el-select v-model="select_first_obj.id" :placeholder="lang.first_level" @change="selectFirstType">
+                  <el-option v-for="item in first_group_list" :key="item.id " :label="item.name" :value="item.id">
+                  </el-option>
+                </el-select>
+                <el-select v-model="select_second_obj.id" :placeholder="lang.second_level" :disabled="secondLoading"
+                  :loading="secondLoading" @change="selectSecondType" class="second-select">
+                  <el-option v-for="item in second_group_list" :key="item.name " :label="item.name" :value="item.id">
+                  </el-option>
+                </el-select>
+                <el-input :placeholder="lang.goods_search_placeholder" v-if="!isDomain" clearable v-model="searchValue"
+                  class="search-input" @keyup.enter.native="searchGoods"></el-input>
+                <el-button class="search-btn" type="primary" key="ddd" @click="searchGoods" :loading="searchLoading"
+                  v-if="!isDomain">{{lang.search}}</el-button>
+              </div>
+              <div class="second-desc" v-if="select_second_obj.description">
+                <scroll-text mode="loop">
+                  {{select_second_obj.description}}
+                </scroll-text>
+              </div>
+              <div class="shopping-box" v-loading="goodSLoading">
+                <template v-if="!isDomain">
+                  <div class="no-goods" v-if="goodsList.length === 0 && !goodSLoading">
+                    <el-empty :description="lang.no_goods"></el-empty>
+                  </div>
+                  <div v-else class="goods-list-div">
+                    <template v-for="(item,index) in goodsList">
+                      <div class="shopping-item">
+                        <div class="client-box" v-if="item.client_level_name && item.client_level_name !== ''">
+                          <span>{{lang.shoppingCar_tip_text15}}</span>
+                        </div>
+                        <div v-html="item.description" class="goods-description"></div>
+                        <div class="goods-content">
+                          <div class="goods-tag"
+                            v-if="item.pay_ontrial && item.pay_ontrial?.status === 1 || item.aodun_firewall_product">
+                            <div class="tag-item" v-if="item.pay_ontrial && item.pay_ontrial?.status === 1 ">
+                              {{lang.support_trial}}
+                            </div>
+                            <div class="tag-item" v-if="item.aodun_firewall_product">
+                              {{lang.firewall_text1}}
+                            </div>
+                          </div>
+                          <div class="goods-name" :class="{'sold-out':item.stock_control === 1 && item.qty <= 0}">
+                            <div class="goods-name-text">{{ item.name }}</div>
+                            <div class="qty-box" v-if="item.stock_control === 1">
+                              <span v-if="item.qty > 0">{{lang.stock}}：<span
+                                  class="stock-num">{{item.qty}}</span></span>
+                              <img src="/{$template_catalog_cart}/template/{$themes_cart}/img/sold_out.svg" alt=""
+                                v-else>
+                            </div>
+                          </div>
+                          <div class="goods-active">
+                            <template v-if="item.activeList.length > 0 || item.addon_coin === 1">
+                              <div class="active-name" v-if="item.addon_coin === 1">
+                                {{lang.coin_text10}}{{item.addon_coin_name}}
+                              </div>
+                              <template v-for="active in item.activeList">
+                                <el-popover placement="top-start" trigger="hover">
+                                  <div class="active-item">
+                                    <span v-if="active.type === 'percent'">{{lang.goods_text1}} {{active.value}}%</span>
+                                    <span v-if="active.type === 'reduce'"> {{lang.goods_text2}} {{active.full}}
+                                      {{lang.goods_text3}} {{active.value}}</span>
+                                  </div>
+                                  <div class="active-name" slot="reference">
+                                    {{active.name}}
+                                  </div>
+                                </el-popover>
+                              </template>
+                            </template>
+                            <template v-else>
+                              <div class="active-name" style="opacity: 0;">
+                                {{lang.subaccount_text55}}
+                              </div>
+                            </template>
+                          </div>
+                          <div class="price-box">
+                            <div class="price-box-left">
+                              <span class="item-price">
+                                <span
+                                  class="item-price-prefix">{{commonData.currency_prefix}}</span>{{item.price_discounted || item.price}}<span
+                                  class="item-price-cycle">{{item.cycle ? '/' +  item.cycle : ''}}</span>
+                              </span>
+                              <span class="original-price"
+                                v-if="item.price_discounted && item.price != item.price_discounted">
+                                <span class="item-price-prefix">{{commonData.currency_prefix}}</span> {{item.price}}
+                              </span>
+                            </div>
+                            <el-button :disabled="item.stock_control === 1 && item.qty <= 0" class="buy-btn"
+                              type="primary" @click="goOrder(item)">{{lang.buy}}</el-button>
+                          </div>
+                        </div>
+                      </div>
+                    </template>
+                  </div>
+                </template>
+                <template v-else>
+                  <div class="domain-box">
+                    <div class="register-type">
+                      <span class="reg-ridio" :class="regType === '1' ? 'isActice' : ''"
+                        @click="regType = '1'">{{lang.template_text93}}</span>
+                      <template v-if="domainConfig.batch_search_domain === 1">
+                        <el-divider direction="vertical"></el-divider>
+                        <span class="reg-ridio" :class="regType === '2' ? 'isActice' : ''"
+                          @click="regType = '2'">{{lang.template_text94}}</span>
+                      </template>
+                    </div>
+                    <div class="domain-search" v-if="regType === '1'">
+                      <el-input :placeholder="lang.template_text92" v-model="domainInput" clearable
+                        @keyup.enter.native="handelDomainSearch">
+                        <div class="suffix-box" slot="append" @click="isShowSuffixBox = !isShowSuffixBox">
+                          {{selectSuffix}}
+                          <i class="el-icon-arrow-down select-btn"></i>
+                        </div>
+                      </el-input>
+                      <el-button class="search-button" @click="handelDomainSearch"
+                        :loading="isSearching">{{lang.template_text95}}</el-button>
+                      <div class="suffix-list" v-show="isShowSuffixBox">
+                        <div class="suffix-item" @click="handelSelectSuffix(item.suffix)"
+                          :class="selectSuffix === item.suffix ? 'suffix-active' : ''" v-for="item in suffixList"
+                          :key="item.suffix">{{item.suffix}}</div>
+                      </div>
+                    </div>
+                    <div class="batch-search-box" v-if="regType === '2'">
+                      <div class="batch-tips" v-loading="batchLoading">
+                        <el-input v-model="textarea2" resize="none" class="input-batch" type="textarea"
+                          :placeholder="`${lang.template_text106}\n${lang.template_text107}${domainConfig.number_limit}${lang.template_text108}${domainConfig.number_limit}${lang.template_text109}\n${lang.template_text110}\n${lang.template_text111}`">
+                        </el-input>
+                      </div>
+                      <div class="batch-btn">
+                        <div class="upload-btn" @click="isShowUpload = true">
+                          <svg t="1750672276335" class="icon" viewBox="0 0 1024 1024" version="1.1"
+                            xmlns="http://www.w3.org/2000/svg" p-id="10857" width="16" height="16">
+                            <path
+                              d="M938.855808 638.776382l0 270.299169c0 27.41028-22.210861 49.634444-49.621141 49.634444l-754.442728 0c-27.41028 0-49.647747-22.224164-49.647747-49.634444L85.144192 638.776382c0-27.41028 22.224164-49.634444 49.634444-49.634444s49.634444 22.224164 49.634444 49.634444l0 220.664725 655.17384 0L839.58692 638.776382c0-27.41028 22.224164-49.634444 49.634444-49.634444S938.855808 611.366102 938.855808 638.776382zM349.445764 351.817788l112.918769-115.288746 0 429.77837c0 27.411303 22.224164 49.634444 49.634444 49.634444 27.41028 0 49.634444-22.223141 49.634444-49.634444L561.633421 236.534158 674.547073 351.812671c9.722432 9.927093 22.591531 14.904455 35.470863 14.904455 12.524245 0 25.071002-4.716418 34.725896-14.172791 19.583011-19.184945 19.913539-50.608631 0.733711-70.190619L547.478026 80.195483c-9.335622-9.535167-22.116717-14.905478-35.46063-14.905478-13.338796 0-26.120914 5.370311-35.456536 14.900362L278.542924 282.3486c-19.184945 19.588127-18.86465 51.010791 0.722454 70.190619C298.847365 371.724163 330.271052 371.394658 349.445764 351.817788z"
+                              p-id="10858" fill="var(--color-primary)"></path>
+                          </svg>
+                          {{lang.template_text132}}
+                        </div>
+                        <el-button @click="batchSearchDomain" type="primary"
+                          :loading="batchLoading">{{lang.template_text112}}</el-button>
+                      </div>
+                    </div>
+                    <div class="domain-content">
+                      <div class="domain-left">
+                        <div class="domain-one" v-if="regType === '1'">
+                          <div class="domain-one-list" v-if="domainList.length !==0" v-loading="isSearching">
+                            <div class="search-title">
+                              <span>{{lang.template_text96}}</span>
+                              <span class="search-fillter is_select" @click="openFilter"><i
+                                  class="el-icon-search"></i>{{isShowFilrer ? lang.wx_tip15: lang.wx_tip14}}</span>
+                            </div>
+                            <div class="fillter-list" v-if="isShowFilrer && fillterDomainSuffix.length > 0">
+                              <div class="fillter-item" :class="{'is_select':selectFilterSuffix.includes(item)}"
+                                v-for="item in fillterDomainSuffix" :key="item" @click="handelFilterSuffix(item)">
+                                {{item}}
+                              </div>
+                            </div>
+                            <div class="domain-list">
+                              <div class="domain-item" v-for="(item,index) in calcDomainList" :key="index">
+                                <div class="item-left">
+                                  <span class="domain-name">{{item.name}}</span>
+                                  <span class="domain-status" v-if="item.avail === 0">{{lang.template_text97}}</span>
+                                  <span class="domain-status"
+                                    v-if="(item.avail === 1 || item.avail === -2) && item.description">{{item.description}}</span>
+                                </div>
+                                <div class="item-right">
+                                  <div class="premium-type" v-if="item.type && item.type === 'premium'">
+                                    {{lang.template_text98}}
+                                  </div>
+                                  <el-popover placement="bottom" trigger="hover" v-if="item.avail === 1">
+                                    <div class="pirce-box" slot="reference" v-loading="item.priceLoading">
+                                      <span class="now-price">{{commonData.currency_prefix}}<span
+                                          style="font-size: 0.18rem;  color: var(--color-price-text);">{{item.showPrice}}
+                                        </span><span style="color: #485169;">/{{lang.common_cloud_text112}}</span>
+                                      </span>
+                                      <i style="margin-left: 0.1rem;color: #F6F7FB;" class="el-icon-arrow-down"></i>
+                                    </div>
+                                    <div class="price-list">
+                                      <div class="price-item">
+                                        <div class="price-year"></div>
+                                        <div class="price-new">{{lang.template_text99}}</div>
+                                        <div class="price-renew">{{lang.template_text100}}</div>
+                                      </div>
+                                      <div class="price-item" v-for="items in item.priceArr" :key="items.buyyear">
+                                        <div class="price-year">{{items.buyyear}}{{lang.template_text101}}</div>
+                                        <div class="price-new">{{commonData.currency_prefix}}{{items.buyprice}}</div>
+                                        <div class="price-renew">{{commonData.currency_prefix}}{{items.renewprice}}
+                                        </div>
+                                      </div>
+                                    </div>
+                                  </el-popover>
+                                  <el-button class="add-btn" type="primary" :plain="isAddCart(item)"
+                                    :disabled="isAddCart(item)" v-if="item.avail === 1 "
+                                    @click="addCart(item)">{{lang.template_text102}}
+                                  </el-button>
+                                  <div class="whois-box" v-if="item.avail === 0" @click="goWhois(item)">
+                                    {{lang.template_text103}}
+                                  </div>
+                                  <div v-if="item.avail === -1">{{lang.template_text104}}</div>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                          <template v-else>
+                            <div class="search-title">{{lang.template_text93}}</div>
+                            <div class="start-search" v-loading="isSearching">
+                              <img src="/{$template_catalog}/template/{$themes}/img/goodsList/search_domain.png" alt="">
+                              <p>{{lang.template_text105}}</p>
+                            </div>
+                          </template>
+                        </div>
+                        <div class="batch-box" v-else>
+                          <div class="batch-main">
+                            <template
+                              v-if="availList.length !== 0 || unavailList.length !==0 || faillList.length !== 0">
+                              <div class="search-title">{{lang.template_text113}}({{availList.length}})</div>
+                              <div class="avail-list" v-loading="batchLoading">
+                                <!-- 可注册域名 -->
+                                <el-checkbox-group v-model="batchCheckGroup" @change="handleBatchChange">
+                                  <div class="batch-item" v-for="(item,index) in availList" :key="index">
+                                    <div class="item-left">
+                                      <el-checkbox :label="item.name">
+                                        <span class="domain-name">{{item.name}}</span>
+                                      </el-checkbox>
+                                      <span class="domain-status"
+                                        v-if="item.avail === 0">{{lang.template_text114}}</span>
+                                      <span class="domain-status"
+                                        v-if="(item.avail === 1 || item.avail === -2) && item.description">{{item.description}}</span>
+                                    </div>
+                                    <div class="item-right">
+                                      <div class="premium-type" v-if="item.type && item.type === 'premium'">
+                                        {{lang.template_text115}}
+                                      </div>
+                                      <el-popover placement="bottom" trigger="hover" v-if="item.avail === 1">
+                                        <div class="pirce-box" slot="reference" v-loading="item.priceLoading">
+                                          <span class="now-price">{{commonData.currency_prefix}}<span
+                                              style="font-size: 0.18rem;  color: var(--color-price-text);">{{item.showPrice}}
+                                            </span><span style="color: #485169;">/{{lang.common_cloud_text112}}</span>
+                                          </span>
+                                          <i style="margin-left: 0.1rem;color: #F6F7FB;" class="el-icon-arrow-down"></i>
+                                        </div>
+                                        <div class="price-list">
+                                          <div class="price-item">
+                                            <div class="price-year"></div>
+                                            <div class="price-new">{{lang.template_text99}}</div>
+                                            <div class="price-renew">{{lang.template_text100}}</div>
+                                          </div>
+                                          <div class="price-item" v-for="items in item.priceArr" :key="items.buyyear">
+                                            <div class="price-year">{{items.buyyear}}{{lang.template_text101}}</div>
+                                            <div class="price-new">{{commonData.currency_prefix}}{{items.buyprice}}
+                                            </div>
+                                            <div class="price-renew">
+                                              {{commonData.currency_prefix}}{{items.renewprice}}
+                                            </div>
+                                          </div>
+                                        </div>
+                                      </el-popover>
+                                      <el-button class="add-btn" type="primary" :plain="isAddCart(item)"
+                                        :disabled="isAddCart(item)" v-if="item.avail === 1 "
+                                        @click="addCart(item)">{{lang.template_text102}}</el-button>
+                                    </div>
+                                  </div>
+                                </el-checkbox-group>
+                              </div>
+                              <div class="all-check" v-if="availList.length > 0">
+                                <el-checkbox :indeterminate="isBatchIndeterminate" v-model="isBatchAllCheck"
+                                  @change="handleBatchCheckAllChange">{{lang.template_text116}}</el-checkbox>
+                                <el-button @click="addAllCart" type="primary"
+                                  :loading="addAllLoading">{{lang.template_text117}}
+                                </el-button>
+                              </div>
+                              <el-collapse v-model="activeNames" v-loading="batchLoading">
+                                <el-collapse-item name="1" style="margin-top: 0.6rem;" v-show="unavailList.length > 0">
+                                  <template slot="title">
+                                    <div class="unavail-title">
+                                      <span>{{lang.template_text118}}({{unavailList.length}})</span>
+                                      <span class="open-text"
+                                        v-if="activeNames.includes('1')">{{lang.template_text119}}</span>
+                                      <span class="open-text" v-else>{{lang.template_text120}}</span>
+                                    </div>
+                                  </template>
+                                  <div class="unavail-list">
+                                    <div class="unavail-item" v-for="(item,index) in unavailList" :key="index">
+                                      <span class="unavail-name">{{item.name}}</span>
+                                      <span class="unavail-reason">{{item.reason}}</span>
+                                    </div>
+                                  </div>
+                                </el-collapse-item>
+                                <el-collapse-item name="2" style="margin-top: 0.4rem;" v-show="faillList.length > 0">
+                                  <template slot="title">
+                                    <div class="unavail-title">
+                                      <span>{{lang.template_text121}}({{faillList.length}})</span>
+                                      <span class="open-text"
+                                        v-if="activeNames.includes('2')">{{lang.template_text119}}</span>
+                                      <span class="open-text" v-else>{{lang.template_text120}}</span>
+                                    </div>
+                                  </template>
+                                  <div class="unavail-list">
+                                    <div class="unavail-item" v-for="(item,index) in faillList" :key="index">
+                                      <span class="unavail-name">{{item.name}}</span>
+                                      <span class="unavail-reason">{{item.reason}}</span>
+                                    </div>
+                                  </div>
+                                </el-collapse-item>
+                              </el-collapse>
+                            </template>
+                            <template v-else>
+                              <div class="search-title">{{lang.template_text94}}</div>
+                              <div class="batch-search" v-loading="batchLoading">
+                                <img src="/{$template_catalog}/template/{$themes}/img/goodsList/search_domain.png"
+                                  alt="">
+                                <p>{{lang.template_text122}}</p>
+                              </div>
+                            </template>
+                          </div>
+                        </div>
+                      </div>
+                      <div class="domain-right">
+                        <div class="car-top">
+                          <span>
+                            {{lang.template_text123}}
+                          </span>
+                          <span class="clear-car" @click="deleteClearCart()">
+                            <svg t="1750669572885" class="icon" viewBox="0 0 1024 1024" version="1.1"
+                              xmlns="http://www.w3.org/2000/svg" p-id="9781" width="16" height="16">
+                              <path
+                                d="M895.398771 267.822944 671.950695 267.822944 671.950695 100.238145c0-46.261745-37.501958-83.792903-83.790889-83.792903l-167.583792 0c-46.287924 0-83.79391 37.531157-83.79391 83.792903l0 167.584799-223.445056 0c-61.698102 0-111.723535 50.024426-111.723535 111.723535l0 55.860257c0 41.398553 22.522722 77.540227 55.981082 96.841965 0.190299 56.371748-0.120825 280.654522-0.120825 377.979786 3.818059 112.787799 111.723535 111.723535 111.723535 111.723535l307.238966 0 0-0.872958 20.968111 0c2.225187 0.568883 4.557103 0.872958 6.961514 0.872958s4.736326-0.304075 6.961514-0.872958l181.59341 0c2.225187 0.568883 4.557103 0.872958 6.961514 0.872958s4.735319-0.304075 6.960507-0.872958l132.69366 0c0 0 107.902455 1.066278 111.721521-111.532229 0-97.144027-0.310117-320.985791-0.119818-377.298133 33.45836-19.301738 55.983096-55.443412 55.983096-96.842972L1007.1213 379.546479C1007.122306 317.84737 957.096873 267.822944 895.398771 267.822944zM811.604862 965.328556l-83.790889 0L727.813973 742.644695c0-15.43837-12.494276-27.929625-27.930632-27.929625-15.43837 0-27.932646 12.491255-27.932646 27.929625l0 222.683861-139.65316 0L532.297535 742.644695c0-15.43837-12.491255-27.929625-27.930632-27.929625-15.43837 0-27.929625 12.491255-27.929625 27.929625l0 223.44707c0 0-69.151976 0-139.654167 0L336.783111 742.644695c0-15.43837-12.491255-27.929625-27.930632-27.929625-15.43837 0-27.929625 12.491255-27.929625 27.929625l0 223.44707-83.79391 0c-47.459923 0-84.064758-31.259351-83.790889-83.792903 0.351398-71.180823 0.136935-263.033253 0.040275-335.168591l781.981174 0c-0.097667 72.050761-0.311123 263.506483 0.040275 334.540303C895.670627 934.122569 859.066799 965.328556 811.604862 965.328556zM951.260036 435.406736c0 30.849554-25.01171 55.860257-55.860257 55.860257L113.337047 491.266993c-30.849554 0-55.862271-25.01171-55.862271-55.860257L57.474777 379.546479c0-30.849554 25.013724-55.863278 55.862271-55.863278l279.308334 0 0-167.583792c0-46.259732 37.502965-83.792903 83.790889-83.792903l55.860257 0c46.287924 0 83.792903 37.533171 83.792903 83.792903l0 167.583792 279.308334 0c30.849554 0 55.860257 25.013724 55.860257 55.863278L951.258022 435.406736z"
+                                p-id="9782"></path>
+                            </svg>
+                            {{lang.template_text124}}</span>
+                        </div>
+                        <div class="car-box" v-loading="isCarLoading">
+                          <div class="car-no" v-if="carList.length === 0">
+                            {{lang.template_text125}}
+                            <span v-show="carList.length === 0">{{lang.template_text126}}</span>
+                            <span v-if="!isLogin" class="blue-a-text" @click="goLogin"> {{lang.template_text127}}</span>
+                          </div>
+                          <div class="car-list" v-else>
+                            <el-checkbox-group v-model="checkList" @change="handleCheckedCitiesChange">
+                              <div class="car-item" v-for="(item,index) in carList" :key="index">
+                                <div class="caritem-top">
+                                  <div class="car-name">
+                                    <el-checkbox :label="item.positions">
+                                      <span class="shop-name">{{item.config_options.domain}}</span>
+                                    </el-checkbox>
+                                    <div class="car-del" @click="deleteCart(item)">
+                                      <svg t="1750669572885" class="icon" viewBox="0 0 1024 1024" version="1.1"
+                                        xmlns="http://www.w3.org/2000/svg" p-id="9781" width="16" height="16">
+                                        <path
+                                          d="M895.398771 267.822944 671.950695 267.822944 671.950695 100.238145c0-46.261745-37.501958-83.792903-83.790889-83.792903l-167.583792 0c-46.287924 0-83.79391 37.531157-83.79391 83.792903l0 167.584799-223.445056 0c-61.698102 0-111.723535 50.024426-111.723535 111.723535l0 55.860257c0 41.398553 22.522722 77.540227 55.981082 96.841965 0.190299 56.371748-0.120825 280.654522-0.120825 377.979786 3.818059 112.787799 111.723535 111.723535 111.723535 111.723535l307.238966 0 0-0.872958 20.968111 0c2.225187 0.568883 4.557103 0.872958 6.961514 0.872958s4.736326-0.304075 6.961514-0.872958l181.59341 0c2.225187 0.568883 4.557103 0.872958 6.961514 0.872958s4.735319-0.304075 6.960507-0.872958l132.69366 0c0 0 107.902455 1.066278 111.721521-111.532229 0-97.144027-0.310117-320.985791-0.119818-377.298133 33.45836-19.301738 55.983096-55.443412 55.983096-96.842972L1007.1213 379.546479C1007.122306 317.84737 957.096873 267.822944 895.398771 267.822944zM811.604862 965.328556l-83.790889 0L727.813973 742.644695c0-15.43837-12.494276-27.929625-27.930632-27.929625-15.43837 0-27.932646 12.491255-27.932646 27.929625l0 222.683861-139.65316 0L532.297535 742.644695c0-15.43837-12.491255-27.929625-27.930632-27.929625-15.43837 0-27.929625 12.491255-27.929625 27.929625l0 223.44707c0 0-69.151976 0-139.654167 0L336.783111 742.644695c0-15.43837-12.491255-27.929625-27.930632-27.929625-15.43837 0-27.929625 12.491255-27.929625 27.929625l0 223.44707-83.79391 0c-47.459923 0-84.064758-31.259351-83.790889-83.792903 0.351398-71.180823 0.136935-263.033253 0.040275-335.168591l781.981174 0c-0.097667 72.050761-0.311123 263.506483 0.040275 334.540303C895.670627 934.122569 859.066799 965.328556 811.604862 965.328556zM951.260036 435.406736c0 30.849554-25.01171 55.860257-55.860257 55.860257L113.337047 491.266993c-30.849554 0-55.862271-25.01171-55.862271-55.860257L57.474777 379.546479c0-30.849554 25.013724-55.863278 55.862271-55.863278l279.308334 0 0-167.583792c0-46.259732 37.502965-83.792903 83.790889-83.792903l55.860257 0c46.287924 0 83.792903 37.533171 83.792903 83.792903l0 167.583792 279.308334 0c30.849554 0 55.860257 25.013724 55.860257 55.863278L951.258022 435.406736z"
+                                          p-id="9782"></path>
+                                      </svg>
+                                      {{lang.template_text128}}
+                                    </div>
+                                  </div>
+                                  <div class="car-year">
+                                    <el-select v-model="item.selectYear" @change="(val)=>changeCart(val,item)">
+                                      <el-option v-for="items in item.priceArr" :key="items.buyyear"
+                                        :label="items.buyyear + lang.template_text101" :value="items.buyyear">
+                                      </el-option>
+                                    </el-select>
+                                  </div>
+                                </div>
+                                <div class="car-bottom">
+                                  <span>{{lang.template_text87}}：</span>
+                                  <div v-loading="item.priceLoading" class="car-price">
+                                    {{commonData.currency_prefix}}<span
+                                      style="font-size: 0.18rem; margin-right: 0.02rem;">{{priceCalc(item)}} </span>
+                                  </div>
+                                </div>
+                              </div>
+                            </el-checkbox-group>
+                          </div>
+                        </div>
+                        <div class="car-money">
+                          <el-checkbox :indeterminate="isIndeterminate" v-model="isAllCheck"
+                            @change="handleCheckAllChange">{{lang.template_text129}}</el-checkbox>
+                          <div class="mon-right">
+                            <p class="now-price">
+                              {{lang.template_text87}}:
+                              <span class="money-text">{{commonData.currency_prefix}}<span
+                                  style="font-size: 0.24rem;">{{totalMoneyCalc.toFixed(2)}}</span>
+                              </span>
+                            </p>
+                            <p class="original-price" v-if="showOriginal">
+                              <span class="hide">{{lang.template_text87}}:{{commonData.currency_prefix}}</span>
+                              {{originalPrice}}
+                            </p>
+                          </div>
+                        </div>
+                        <div class="car-settle">
+                          <el-button type="primary" class="settle-btn"
+                            @click="goBuyDomain">{{lang.template_text130}}</el-button>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </template>
+              </div>
+              <p v-if="!isDomain && !scrollDisabled && goodsList.length !==0" class="tips">{{lang.goods_loading}}</p>
+              <!-- <p v-if="!isDomain && scrollDisabled && goodsList.length !== 0" class="tips">{{lang.no_more_goods}}</p> -->
+            </div>
+          </div>
+        </el-main>
+        <div class="up-dialog">
+          <el-dialog width="6.8rem" :visible.sync="isShowUpload" :show-close=false>
+            <div class="dia-title">{{lang.template_text131}}</div>
+            <div class="dia-concent">
+              <p class="up-tips">{{lang.template_text132}}</p>
+              <div class="file-box">
+                <input accept="text/plain" type="file" id="upFile" autocomplete="off" tabindex="-1"
+                  style="display: none;">
+                <input class="file-name" :placeholder="lang.template_text133" readonly :value="fileName">
+                <!-- 选择文件按钮 -->
+                <div class="file-btn" @click="selectFile">{{lang.template_text134}}</div>
+              </div>
+            </div>
+            <div class="dia-foter">
+              <el-button class="confim-btn" @click="confirmUpload">{{lang.template_text135}}</el-button>
+              <el-button class="cancel-btn" @click="cancelUpload">{{lang.template_text136}}</el-button>
+            </div>
+          </el-dialog>
+        </div>
+      </el-container>
+    </el-container>
+  </div>
+  <!-- =======页面独有======= -->
+  <script src="/{$template_catalog}/template/{$themes}/components/scrollText/scrollText.js"></script>
+  <script src="/{$template_catalog_cart}/template/{$themes_cart}/api/goodsList.js"></script>
+  <script src="/{$template_catalog_cart}/template/{$themes_cart}/js/goodsList.js"></script>
+  <script src="/{$template_catalog_cart}/template/{$themes_cart}/api/product.js"></script>
diff --git a/clientarea/cart/hgcart/goods_iframe.php b/clientarea/cart/hgcart/goods_iframe.php
new file mode 100644
index 0000000..8724230
--- /dev/null
+++ b/clientarea/cart/hgcart/goods_iframe.php
@@ -0,0 +1,34 @@
+<script src="/{$template_catalog}/template/{$themes}/js/common/jquery.mini.js"></script>
+<link rel="stylesheet" href="/{$template_catalog_cart}/template/{$themes_cart}/css/goods_iframe.css">
+</head>
+
+<body>
+  <!-- mounted之前显示 -->
+  <div id="mainLoading">
+    <div class="ddr ddr1"></div>
+    <div class="ddr ddr2"></div>
+    <div class="ddr ddr3"></div>
+    <div class="ddr ddr4"></div>
+    <div class="ddr ddr5"></div>
+  </div>
+  <div class="goods">
+    <el-container>
+      <aside-menu v-show="false"></aside-menu>
+      <el-container>
+        <top-menu :num="shoppingCarNum" v-show="false"></top-menu>
+        <!-- 自己的东西 -->
+        <!-- 后端渲染出来的配置页面 -->
+        <div class="config-box">
+          <div class="content"></div>
+        </div>
+      </el-container>
+    </el-container>
+  </div>
+  <!-- =======页面独有======= -->
+  <script src="/{$template_catalog}/template/{$themes}/components/payDialog/payDialog.js"></script>
+  <script src="/{$template_catalog_cart}/template/{$themes_cart}/api/product.js"></script>
+  <script src="/{$template_catalog_cart}/template/{$themes_cart}/js/goods.js"></script>
+  <script src="/{$template_catalog}/template/{$themes}/components/pagination/pagination.js"></script>
+  <script src="/{$template_catalog}/template/{$themes}/components/discountCode/discountCode.js"></script>
+  <script src="/{$template_catalog}/template/{$themes}/components/eventCode/eventCode.js"></script>
+  <script src="/{$template_catalog}/template/{$themes}/components/customGoods/customGoods.js"></script>
\ No newline at end of file
diff --git a/clientarea/cart/hgcart/img/firewall-icon.png b/clientarea/cart/hgcart/img/firewall-icon.png
new file mode 100644
index 0000000..d790a77
Binary files /dev/null and b/clientarea/cart/hgcart/img/firewall-icon.png differ
diff --git a/clientarea/cart/hgcart/img/firewall-icon.svg b/clientarea/cart/hgcart/img/firewall-icon.svg
new file mode 100644
index 0000000..0d465b6
--- /dev/null
+++ b/clientarea/cart/hgcart/img/firewall-icon.svg
@@ -0,0 +1,24 @@
+<svg id="shield" xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="10 6 30 36">
+  <defs>
+    <style>
+
+      .vi-accent {
+        stroke: #fff;
+        stroke-linecap: round;
+        stroke-width: 0;
+        fill-rule: evenodd;
+      }
+      .vi-primary {
+        fill: none;
+        stroke: #fff;
+         stroke-width: 2;
+      }
+
+      .vi-accent {
+        fill: #fff;
+      }
+    </style>
+  </defs>
+  <path class="vi-primary" d="M24.516,41C8.586,34.828,10.032,13.8,10.032,13.8,19.675,15.578,24.516,7,24.516,7s4.83,8.578,14.452,6.8C38.968,13.8,40.411,34.828,24.516,41Z"/>
+  <path class="vi-accent" d="M17,25l5,5L32,20l-2-2-8,8-3-3Z"/>
+</svg>
diff --git a/clientarea/cart/hgcart/img/sold_out.svg b/clientarea/cart/hgcart/img/sold_out.svg
new file mode 100644
index 0000000..ca009ed
--- /dev/null
+++ b/clientarea/cart/hgcart/img/sold_out.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="none" version="1.1" width="55" height="48" viewBox="0 0 55 48"><g transform="matrix(1,-7.436429250162746e-9,7.436429250162746e-9,1,1.3616508636772606e-12,0)"><g><path d="M50.11626006958008,31.99994605286592C46.77669506958008,41.32149705286592,37.765678069580076,47.999971052865924,27.17356906958008,47.999971052865924C16.581459069580077,47.999971052865924,7.570441269580078,41.32149705286592,4.230877037433078,31.99994605286592L5.732880469580078,31.99994605286592C9.007719469580078,40.53801905286592,17.372048069580078,46.60866305286592,27.17356906958008,46.60866305286592C36.975082069580075,46.60866305286592,45.339413069580075,40.53801905286592,48.61425006958008,31.99994605286592L50.11626006958008,31.99994605286592ZM49.85459106958008,15.30429605286592C46.32410406958008,6.34793885286592,37.500259069580075,-0.000024947134079411626,27.17356906958008,-0.000024947134079411626C16.84687806958008,-0.000024947134079411626,8.023034069580078,6.34793885286592,4.4925467995800785,15.30429605286592L6.013250569580078,15.30429605286592C9.466833069580078,7.13404255286592,17.640417069580078,1.3912791528659205,27.17356906958008,1.3912791528659205C36.70671506958008,1.3912791528659205,44.880299069580076,7.13404255286592,48.33388106958008,15.30429605286592L49.85459106958008,15.30429605286592Z" fill-rule="evenodd" fill="#CFD2E1" fill-opacity="1"/></g><g><path d="M40.43146656622314,31.999887107910155C37.743332566223145,36.181108107910156,33.01012156622315,38.95641310791015,27.619873566223145,38.95641310791015C22.229625266223145,38.95641310791015,17.496413966223145,36.181108107910156,14.808281588808144,31.999887107910155L16.514329166223146,31.999887107910155C19.015645466223145,35.373747107910155,23.058363866223146,37.56510910791016,27.619873566223145,37.56510910791016C32.181384566223144,37.56510910791016,36.224102566223145,35.373747107910155,38.72542056622314,31.999887107910155L40.43146656622314,31.999887107910155ZM39.956017566223146,15.304237407910156C37.20586456622314,11.513643007910156,32.70527956622314,9.043373107910156,27.619873566223145,9.043373107910156C22.534467266223146,9.043373107910156,18.033883066223144,11.513643007910156,15.283730536223144,15.304237407910156L17.066046666223144,15.304237407910156C19.588311166223143,12.327917307910155,23.379985766223143,10.434677207910156,27.619873566223145,10.434677207910156C31.859761566223145,10.434677207910156,35.65143656622314,12.327917307910155,38.17370356622314,15.304237407910156L39.956017566223146,15.304237407910156Z" fill-rule="evenodd" fill="#CFD2E1" fill-opacity="1"/></g><g><path d="M0,29.217203940856933L0,18.086771740856932C0,16.934177990856934,0.94708997,15.999815940856934,2.1153848,15.999815940856934L52.884624,15.999815940856934C54.052914,15.999815940856934,55.000004,16.934177990856934,55.000004,18.086771740856932L55.000004,29.217203940856933C55.000004,30.369799940856936,54.052914,31.30416094085693,52.884624,31.30416094085693L2.1153848,31.30416094085693C0.94708997,31.30416094085693,0,30.369799940856936,0,29.217203940856933ZM1.4102565,29.217203940856933Q1.4102565,29.912855940856936,2.1153848,29.912855940856936L52.884624,29.912855940856936Q53.589748,29.912855940856936,53.589748,29.217203940856933L53.589748,18.086771740856932Q53.589748,17.391119940856935,52.884624,17.391119940856935L2.1153848,17.391119940856935Q1.4102565,17.391119940856935,1.4102565,18.086771740856932L1.4102565,29.217203940856933Z" fill-rule="evenodd" fill="#CFD2E1" fill-opacity="1"/></g><g><path d="M26.79487393574219,2.7824251651763916L27.55315373574219,4.007061565176391L28.91025873574219,4.3767176651763915L28.021797135742187,5.503240865176392L28.10225323574219,6.956337665176392L26.79487393574219,6.4279310651763915L25.48749434574219,6.956337665176392L25.567950425742186,5.503240865176392L24.679489135742188,4.3767176651763915L26.036593435742187,4.007061565176391L26.79487393574219,2.7824251651763916Z" fill="#CFD2E1" fill-opacity="1"/></g><g transform="matrix(1,0,0,-1,0,91.82571411132812)"><path d="M26.79487393574219,45.91285705566406L27.55315373574219,47.137493455664064L28.91025873574219,47.507149555664064L28.021797135742187,48.633672755664065L28.10225323574219,50.08676955566406L26.79487393574219,49.558362955664066L25.48749434574219,50.08676955566406L25.567950425742186,48.633672755664065L24.679489135742188,47.507149555664064L26.036593435742187,47.137493455664064L26.79487393574219,45.91285705566406Z" fill="#CFD2E1" fill-opacity="1"/></g><g transform="matrix(0.9411634802818298,-0.3379516303539276,0.3461246192455292,0.9381886124610901,-1.2127698594816536,5.867863960043849)"><path d="M18.33002781357422,6.260685920715332L19.087122413574217,7.487285520715332L20.44210621357422,7.857534120715332L19.55503341357422,8.985863220715332L19.63536381357422,10.441289420715332L18.33002781357422,9.912035720715332L17.02469134357422,10.441289420715332L17.105021713574217,8.985863220715332L16.21794891357422,7.857534120715332L17.57293221357422,7.487285520715332L18.33002781357422,6.260685920715332Z" fill="#CFD2E1" fill-opacity="1"/></g><g transform="matrix(0.9411634802818298,0.3379516303539276,0.3461246192455292,-0.9381886124610901,-13.974232029799737,78.1136678398957)"><path d="M18.33002781357422,43.130245208740234L19.087122413574217,44.356844808740234L20.44210621357422,44.72709340874023L19.55503341357422,45.85542250874023L19.63536381357422,47.31084870874024L18.33002781357422,46.78159500874023L17.02469134357422,47.31084870874024L17.105021713574217,45.85542250874023L16.21794891357422,44.72709340874023L17.57293221357422,44.356844808740234L18.33002781357422,43.130245208740234Z" fill="#CFD2E1" fill-opacity="1"/></g><g transform="matrix(-0.9411634802818298,-0.3379516303539276,-0.3461246192455292,0.9381886124610901,76.0805180235096,13.255141304763072)"><path d="M40.189006085058594,6.260685920715332L40.946100685058596,7.487285520715332L42.301084485058595,7.857534120715332L41.4140116850586,8.985863220715332L41.49434208505859,10.441289420715332L40.189006085058594,9.912035720715332L38.883669615058594,10.441289420715332L38.96399998505859,8.985863220715332L38.076927185058594,7.857534120715332L39.431910485058594,7.487285520715332L40.189006085058594,6.260685920715332Z" fill="#CFD2E1" fill-opacity="1"/></g><g transform="matrix(-0.9411634802818298,0.3379516303539276,-0.3461246192455292,-0.9381886124610901,88.84198019382768,70.72639049517647)"><path d="M40.189006085058594,43.130245208740234L40.946100685058596,44.356844808740234L42.301084485058595,44.72709340874023L41.4140116850586,45.85542250874023L41.49434208505859,47.31084870874024L40.189006085058594,46.78159500874023L38.883669615058594,47.31084870874024L38.96399998505859,45.85542250874023L38.076927185058594,44.72709340874023L39.431910485058594,44.356844808740234L40.189006085058594,43.130245208740234Z" fill="#CFD2E1" fill-opacity="1"/></g><g><path d="M20.308493640100096,25.7883844032959Q20.2691621401001,26.3685160032959,20.190501240100097,26.7618246032959Q20.0823412401001,27.341955203295896,19.925017340100098,27.6271050032959Q19.767693540100097,27.9122530032959,19.4481296401001,28.0351630032959Q19.128566740100098,28.1580720032959,18.4992723401001,28.187570003295896Q17.250515940100097,28.236733003295896,16.286909140100096,28.236733003295896Q15.392130840100098,28.236733003295896,14.241702340100098,28.187570003295896Q13.592742440100098,28.1580720032959,13.253513340100097,28.010581003295897Q12.914284340100098,27.8630900032959,12.766793440100098,27.5238610032959Q12.619302640100099,27.184631303295898,12.619302640100099,26.5356722032959L12.619302640100099,21.9044585032959L13.661571540100098,21.943789503295896L13.661571540100098,23.104051103295898L18.4107775401001,23.104051103295898L18.4107775401001,21.0293460032959L12.393149940100098,21.0293460032959L12.393149940100098,20.006742503295897L19.433381040100098,20.006742503295897L19.433381040100098,24.0873232032959L13.661571540100098,24.0873232032959L13.661571540100098,26.270188303295896Q13.661571540100098,26.6634970032959,13.730400540100097,26.845402703295896Q13.799229640100098,27.0273085032959,13.981135140100097,27.0961370032959Q14.163040440100097,27.1649666032959,14.576015040100097,27.184631303295898Q15.588785640100099,27.233795203295898,16.3852362401001,27.233795203295898Q17.1816868401001,27.233795203295898,18.194457540100096,27.184631303295898Q18.607431840100098,27.155133203295897,18.794253840100097,27.0961370032959Q18.981075740100096,27.037140803295898,19.0646538401001,26.884733203295898Q19.148231940100096,26.732326503295898,19.197395840100096,26.388180703295898Q19.276057240100098,25.906377803295896,19.285890540100098,25.4540720032959L20.308493640100096,25.7883844032959ZM28.233670040100098,24.1561527032959L31.330979040100097,24.1561527032959L31.330979040100097,24.9034395032959L23.9859330401001,24.9034395032959L23.9859330401001,22.405927703295898Q23.6516200401001,22.828734403295897,23.277977040100097,23.202378303295898L22.747010040100097,22.3174329032959Q23.277977040100097,21.894625703295898,23.8482750401001,21.0244298032959Q24.4185730401001,20.1542335032959,24.723388040100097,19.3479500032959L25.627998040100096,19.6625972032959Q25.4116780401001,20.1345682032959,25.293685040100097,20.3607206032959L27.407721040100096,20.3607206032959Q27.319226040100098,20.065739203295898,27.142238040100096,19.534771903295898L28.0468490401001,19.416779003295897Q28.233670040100098,19.908415303295897,28.381162040100097,20.3607206032959L31.114659040100097,20.3607206032959L31.114659040100097,21.1178403032959L28.233670040100098,21.1178403032959L28.233670040100098,21.6684732032959L30.898339040100097,21.6684732032959L30.898339040100097,22.366596703295897L28.233670040100098,22.366596703295897L28.233670040100098,22.917229203295896L30.898339040100097,22.917229203295896L30.898339040100097,23.5956869032959L28.233670040100098,23.5956869032959L28.233670040100098,24.1561527032959ZM24.9593720401001,21.6684732032959L27.2798960401001,21.6684732032959L27.2798960401001,21.1178403032959L24.9593720401001,21.1178403032959L24.9593720401001,21.6684732032959ZM24.9593720401001,22.917229203295896L27.2798960401001,22.917229203295896L27.2798960401001,22.366596703295897L24.9593720401001,22.366596703295897L24.9593720401001,22.917229203295896ZM27.2798960401001,23.5956869032959L24.9593720401001,23.5956869032959L24.9593720401001,24.1561527032959L27.2798960401001,24.1561527032959L27.2798960401001,23.5956869032959ZM24.9003760401001,28.325228003295898L23.9072710401001,28.325228003295898L23.9072710401001,25.404908203295896L30.583692040100097,25.404908203295896L30.583692040100097,28.325228003295898L29.620084040100096,28.325228003295898L29.620084040100096,27.9024210032959L24.9003760401001,27.9024210032959L24.9003760401001,28.325228003295898ZM29.620084040100096,27.1649666032959L29.620084040100096,26.191526403295896L24.9003760401001,26.191526403295896L24.9003760401001,27.1649666032959L29.620084040100096,27.1649666032959ZM34.506949040100096,21.1178403032959L36.0211880401001,21.1178403032959L36.0211880401001,20.6753678032959L34.1431380401001,20.6753678032959L34.1431380401001,20.006742503295897L36.0211880401001,20.006742503295897L36.0211880401001,19.4069462032959L36.876636040100095,19.4462771032959L36.876636040100095,20.006742503295897L38.6071960401001,20.006742503295897L38.6071960401001,20.6753678032959L36.876636040100095,20.6753678032959L36.876636040100095,21.1178403032959L38.361377040100095,21.1178403032959L38.361377040100095,21.7373023032959L34.506949040100096,21.7373023032959L34.506949040100096,21.1178403032959ZM35.264070040100094,23.7530107032959Q35.205073040100096,24.1168213032959,35.0280830401001,24.4363852032959Q34.851094040100094,24.7559490032959,34.4676180401001,25.2377520032959L33.808825040100096,24.8247776032959Q34.2611300401001,24.2741451032959,34.4135390401001,23.8857527032959Q34.5659460401001,23.497360203295898,34.5659460401001,22.907396303295897L34.5659460401001,22.0814476032959L38.2925480401001,22.0814476032959L38.2925480401001,23.6743488032959Q39.0496680401001,23.497360203295898,39.6494650401001,23.2908726032959Q39.1873250401001,22.917229203295896,38.7448530401001,22.3174329032959L38.617028040100095,22.3174329032959L38.617028040100095,21.6684732032959L38.96117304010009,21.6684732032959L38.4793710401001,21.1080079032959Q38.7841840401001,20.921186003295897,38.9120110401001,20.724531603295897Q39.0398360401001,20.527876903295898,39.0398360401001,20.1935644032959L39.0398360401001,19.731426203295896L41.6651730401001,19.731426203295896L41.6651730401001,20.409884403295898Q41.6651730401001,20.6163716032959,41.70450304010009,20.6802840032959Q41.7438340401001,20.744196903295897,41.9011580401001,20.744196903295897L42.5402840401001,20.744196903295897L42.4026270401001,21.4226551032959L41.5668460401001,21.4226551032959Q41.1932020401001,21.4226551032959,41.050628040100094,21.2751641032959Q40.9080530401001,21.127673103295898,40.9080530401001,20.7933607032959L40.9080530401001,20.429549703295898L39.7772890401001,20.429549703295898L39.7772890401001,20.5770407032959Q39.7772890401001,21.1473389032959,38.990672040100094,21.6684732032959L42.1863070401001,21.6684732032959L42.1863070401001,22.3469310032959Q41.7241700401001,22.907396303295897,41.0850420401001,23.3203707032959Q41.6651730401001,23.5465236032959,42.7566040401001,23.7530107032959L42.500955040100095,24.4806323032959Q41.645509040100094,24.2348146032959,41.1833700401001,24.0824070032959Q40.721230040100096,23.9299998032959,40.337754040100094,23.7333450032959Q39.5118050401001,24.126654603295897,38.32204504010009,24.4216361032959L38.0663960401001,23.7530107032959L35.264070040100094,23.7530107032959ZM39.6789640401001,22.3174329032959Q39.9936090401001,22.691076303295898,40.3967520401001,22.9663930032959Q40.9473850401001,22.6812439032959,41.2718630401001,22.3174329032959L39.6789640401001,22.3174329032959ZM36.0801860401001,23.1335492032959L36.0801860401001,22.6615782032959L35.303399040100096,22.6615782032959L35.303399040100096,23.1335492032959L36.0801860401001,23.1335492032959ZM36.7979750401001,23.1335492032959L37.545260040100096,23.1335492032959L37.545260040100096,22.6615782032959L36.7979750401001,22.6615782032959L36.7979750401001,23.1335492032959ZM38.7743520401001,25.267250503295898L38.7743520401001,25.857214003295898L42.589448040100095,25.857214003295898L42.589448040100095,26.6045008032959L38.7743520401001,26.6045008032959L38.7743520401001,27.4206170032959L40.721230040100096,27.4206170032959L40.721230040100096,26.8306541032959L41.5963450401001,26.869984603295897L41.5963450401001,28.492384003295896L40.721230040100096,28.492384003295896L40.721230040100096,28.197403003295896L35.0772470401001,28.197403003295896L35.0772470401001,26.8306541032959L35.9523590401001,26.869984603295897L35.9523590401001,27.4206170032959L37.889407040100096,27.4206170032959L37.889407040100096,26.6045008032959L34.0841420401001,26.6045008032959L34.0841420401001,25.857214003295898L35.6967100401001,25.857214003295898L35.1264100401001,25.4245739032959Q35.7163740401001,24.785447103295898,36.139182040100096,23.900501703295898L36.8864680401001,24.1758180032959Q36.8176390401001,24.333141303295896,36.7094790401001,24.5396290032959L41.5275140401001,24.5396290032959L41.5275140401001,25.267250503295898L38.7743520401001,25.267250503295898ZM37.889407040100096,25.857214003295898L37.889407040100096,25.267250503295898L36.2571740401001,25.267250503295898Q36.0801860401001,25.5229015032959,35.7852030401001,25.857214003295898L37.889407040100096,25.857214003295898Z" fill="#CFD2E1" fill-opacity="1"/></g></g></svg>
\ No newline at end of file
diff --git a/clientarea/cart/hgcart/index_iframe.php b/clientarea/cart/hgcart/index_iframe.php
new file mode 100644
index 0000000..97ab20c
--- /dev/null
+++ b/clientarea/cart/hgcart/index_iframe.php
@@ -0,0 +1,37 @@
+<!-- 页面引入样式位置 -->
+<script src="/{$template_catalog}/template/{$themes}/js/common/jquery.mini.js"></script>
+<link rel="stylesheet" href="/{$template_catalog_cart}/template/{$themes_cart}/css/index_iframe.css">
+
+
+</head>
+
+<body>
+    <div class="goods" v-cloak>
+        <el-container>
+            <aside-menu></aside-menu>
+            <el-container>
+                <el-header>
+                    <top-menu :num="shoppingCarNum"></top-menu>
+                </el-header>
+                <el-main>
+                    <el-card>
+                        <!-- 后端渲染出来的配置页面 -->
+                        <div class="config-box">
+                            <div class="content"></div>
+                        </div>
+                    </el-card>
+                </el-main>
+            </el-container>
+        </el-container>
+    </div>
+    <!-- =======页面引入js和相关组件位置======= -->
+    <!-- 系统组件 -->
+    <script src="/{$template_catalog}/template/{$themes}/components/payDialog/payDialog.js"></script>
+    <script src="/{$template_catalog}/template/{$themes}/components/pagination/pagination.js"></script>
+    <script src="/{$template_catalog}/template/{$themes}/components/discountCode/discountCode.js"></script>
+    <script src="/{$template_catalog}/template/{$themes}/components/customGoods/customGoods.js"></script>
+    <script src="/{$template_catalog}/template/{$themes}/components/eventCode/eventCode.js"></script>
+
+    <!-- 购物车文件 -->
+    <script src="/{$template_catalog_cart}/template/{$themes_cart}/api/product.js"></script>
+    <script src="/{$template_catalog_cart}/template/{$themes_cart}/js/goods.js"></script>
diff --git a/clientarea/cart/hgcart/js/goods.js b/clientarea/cart/hgcart/js/goods.js
new file mode 100644
index 0000000..131392a
--- /dev/null
+++ b/clientarea/cart/hgcart/js/goods.js
@@ -0,0 +1,179 @@
+var orignalSetItem = localStorage.setItem;
+localStorage.setItem = function (key, newValue) {
+  var setItemEvent = new Event("setItemEvent");
+  setItemEvent.newValue = newValue;
+  window.dispatchEvent(setItemEvent);
+  orignalSetItem.apply(this, arguments);
+};
+(function (window, undefined) {
+  var old_onload = window.onload;
+  window.onload = function () {
+    const template = document.getElementsByClassName("goods")[0];
+    Vue.prototype.lang = window.lang;
+    window.addEventListener("setItemEvent", function (e) {
+      if (e.newValue && String(e.newValue).indexOf("cartNum") !== -1) {
+        vm._data.shoppingCarNum = e.newValue.split("-")[1] * 1;
+      }
+    });
+    const vm = new Vue({
+      components: {
+        asideMenu,
+        topMenu,
+        pagination,
+      },
+      created() {
+        const params = getUrlParams();
+        if (params.token) {
+          localStorage.setItem("jwt", params.token);
+        }
+        this.id = params.id;
+        // 只获取 commonData 配置，不触发 getGoodDetail
+        this.commonData = JSON.parse(
+          localStorage.getItem("common_set_before")
+        );
+      },
+      mounted() {
+        if (window.self !== window.top) {
+          this.isIfram = true;
+        }
+        // 先加载 content，完成后再加载 popover 数据，避免并发请求过多
+        this.getList().then(() => {
+          if (this.commonData.cart_change_product == 1) {
+            this.getGoodDetail(this.id);
+          }
+        });
+      },
+      updated() {
+        // // 关闭loading
+        document.getElementById("mainLoading").style.display = "none";
+        document.getElementsByClassName("goods")[0].style.display = "block";
+      },
+      computed: {
+        calcProductGroup() {
+          // fillterKey 过滤关键字 secProductGroupList
+          const fillterKey = this.fillterKey.trim().toLowerCase();
+          const originList = JSON.parse(
+            JSON.stringify(this.secProductGroupList)
+          );
+          const arr = originList
+            .filter((item) => {
+              return (
+                item.goodsList.filter((i) => {
+                  return i.name.toLowerCase().indexOf(fillterKey) !== -1;
+                }).length > 0
+              );
+            })
+            .map((item) => {
+              item.goodsList = item.goodsList.filter((i) => {
+                return i.name.toLowerCase().indexOf(fillterKey) !== -1;
+              });
+              return item;
+            });
+          return arr;
+        },
+      },
+      data() {
+        return {
+          id: "",
+          isIfram: false,
+          shoppingCarNum: 0,
+          fillterKey: "",
+          params: {
+            page: 1,
+            limit: 20,
+            pageSizes: [20, 50, 100],
+            total: 200,
+            orderby: "id",
+            sort: "desc",
+            keywords: "",
+          },
+          commonData: {},
+          content: "",
+          productInfo: {},
+          secProductGroupList: [],
+        };
+      },
+      filters: {
+        formateTime(time) {
+          if (time && time !== 0) {
+            return formateDate(time * 1000);
+          } else {
+            return "--";
+          }
+        },
+      },
+      methods: {
+        async getList() {
+          try {
+            const params = { id: this.id, flag: this.isIfram };
+            const res = await getOrederConfig(params);
+            this.$nextTick(() => {
+              // 解决Jquery加载JS会在文件末尾添加时间戳的问题
+              $.ajaxSetup({
+                cache: true,
+              });
+              $(".config-box .content").html(res.data.data.content);
+            });
+            this.content = res.data.data.content;
+          } catch (error) {}
+        },
+        handleCommand(id) {
+          // 打开新页面 替换id
+          location.href = `goods.htm?id=${id}`;
+        },
+        getGoodDetail(id) {
+          apiProductDetail({ id }).then((res) => {
+            this.productInfo = res.data.data.product;
+            this.getProductGroup_second(
+              this.productInfo.product_group_id_first
+            );
+          });
+        },
+        // 获取二级分类
+        getProductGroup_second(id) {
+          productGroupSecond(id).then((res) => {
+            this.secProductGroupList = res.data.data.list.map((item) => {
+              item.goodsList = [];
+              return item;
+            });
+            this.getProductGoodList();
+          });
+        },
+        // 获取商品列表
+        getProductGoodList() {
+          this.secProductGroupList.forEach((item) => {
+            const params = {
+              page: 1,
+              limit: 999999,
+              id: item.id,
+            };
+            productGoods(params).then((res) => {
+              item.goodsList = res.data.data.list;
+            });
+          });
+        },
+        // 每页展示数改变
+        sizeChange(e) {
+          this.params.limit = e;
+          this.params.page = 1;
+          // 获取列表
+        },
+        // 当前页改变
+        currentChange(e) {
+          this.params.page = e;
+        },
+
+        // 获取通用配置
+        getCommonData() {
+          this.commonData = JSON.parse(
+            localStorage.getItem("common_set_before")
+          );
+          if (this.commonData.cart_change_product == 1) {
+            this.getGoodDetail(this.id);
+          }
+        },
+      },
+    }).$mount(template);
+    typeof old_onload == "function" && old_onload();
+  };
+})(window);
diff --git a/clientarea/cart/hgcart/js/goodsList.js b/clientarea/cart/hgcart/js/goodsList.js
new file mode 100644
index 0000000..d1323b4
--- /dev/null
+++ b/clientarea/cart/hgcart/js/goodsList.js
@@ -0,0 +1,949 @@
+(function (window, undefined) {
+  var old_onload = window.onload;
+  window.onload = function () {
+    const template = document.getElementsByClassName("template")[0];
+    Vue.prototype.lang = window.lang;
+    new Vue({
+      components: {
+        asideMenu,
+        topMenu,
+        scrollText,
+      },
+      created() {
+        window.addEventListener("scroll", this.scrollBottom);
+        // 监听 页面点击事件 用于关闭 isShowSuffixBox
+        document.addEventListener("click", (e) => {
+          const classNameArr = [
+            "suffix-list",
+            "suffix-box",
+            "suffix-item",
+            "suffix-item suffix-active",
+            "el-icon-arrow-down select-btn",
+          ];
+          if (!classNameArr.includes(e.target.className)) {
+            this.isShowSuffixBox = false;
+          }
+        });
+
+        this.getCommonData();
+        this.getCarList();
+
+        sessionStorage.removeItem("product_information");
+        this.fpg_id = this.getQuery("fpg_id") * 1;
+        this.spg_id = this.getQuery("spg_id") * 1;
+        this.host_id = this.getQuery("host_id") * 1;
+        this.domainInput = this.getQuery("domain");
+      },
+      mounted() {
+        const addons_js_arr = JSON.parse(
+          document.querySelector("#addons_js").getAttribute("addons_js")
+        ); // 插件列表
+        const arr = addons_js_arr.map((item) => {
+          return item.name;
+        });
+        if (arr.includes("EventPromotion")) {
+          // 开启活动满减
+          this.isShowFull = true;
+        }
+        this.initData();
+      },
+      updated() {
+        // 关闭loading
+        document.getElementById("mainLoading").style.display = "none";
+        document.getElementsByClassName("template")[0].style.display = "block";
+      },
+      destroyed() {
+        window.removeEventListener("scroll", this.scrollBottom);
+      },
+      data() {
+        return {
+          isShowView: false,
+          searchValue: "", // 搜索内容
+          searchLoading: false,
+          select_first_obj: {
+            id: "", // 一级分组ID
+            type: "", // 一级分组类型
+          }, // 选中的一级分类对象
+          select_second_obj: {
+            id: "", // 二级分组ID
+            type: "", // 二级分组类型
+            description: "", // 二级分组描述
+          }, // 选中的一级分类对象
+          first_group_list: [], // 一级分类数组
+          second_group_list: [], // 二级分类数组
+          commonData: {},
+          scrollDisabled: false,
+          secondLoading: false, // 二级分类加载
+          goodSLoading: false,
+          goodsParmas: {
+            keywords: "", // 关键字,搜索范围:商品ID,商品名,描述
+            id: "", // 二级分组ID
+            page: 1, // 页数
+            limit: 12, // 每页条数
+          },
+          goodsList: [], // 商品列表数组
+          regType: "1",
+          domainInput: "",
+          selectSuffix: "",
+          isAllCheck: false,
+          isShowFull: false,
+          suffixList: [],
+          domainList: [],
+          isSearching: false,
+          isShowSuffixBox: false,
+          carList: [],
+          checkList: [],
+          product_id: "",
+          isCarLoading: false,
+          isIndeterminate: false,
+          isBatchIndeterminate: false,
+          isBatchAllCheck: false,
+          batchLoading: false,
+          addAllLoading: false,
+          textarea2: "",
+          batchCheckGroup: [],
+          availList: [],
+          unavailList: [],
+          faillList: [],
+          activeNames: [],
+          domainConfig: {},
+          isShowUpload: false,
+          fileName: "",
+          fileContent: "",
+          originalPrice: 0.0,
+          /* 传参搜索 */
+          fpg_id: "",
+          spg_id: "",
+          host_id: "",
+          isShowFilrer: false,
+          selectFilterSuffix: [],
+        };
+      },
+      filters: {
+        formateTime(time) {
+          if (time && time !== 0) {
+            return formateDate(time * 1000);
+          } else {
+            return "--";
+          }
+        },
+      },
+      computed: {
+        // 是否选中的分类为域名
+        isDomain() {
+          return this.select_second_obj.type === "domain";
+        },
+        // 计算购物车选中的商品的总价
+        totalMoneyCalc() {
+          let total = 0;
+          this.carList.forEach((item) => {
+            if (this.checkList.includes(item.positions)) {
+              total += this.priceCalc(item) * 1000;
+            }
+          });
+          const firstDiscount = this.carList.filter(
+            (item) => this.checkList[0] === item.positions
+          );
+          let domainDiscount = 0;
+          if (firstDiscount.length > 0) {
+            domainDiscount = firstDiscount[0]?.priceArr[0]?.discount;
+          }
+          this.originalPrice = (total / 1000).toFixed(2);
+          let temp = (total - domainDiscount * 1000) / 1000;
+          if (isNaN(temp)) {
+            temp = 0.0;
+          }
+          return temp;
+        },
+        showDomainList() {
+          return (
+            this.domainList.filter((item) => {
+              return (
+                item.avail === 0 ||
+                (item.avail === 1 && item.priceArr.length > 0)
+              );
+            }) || []
+          );
+        },
+        // 是否登录
+        isLogin() {
+          return window.localStorage.jwt ? true : false;
+        },
+        calcDomainList() {
+          if (this.selectFilterSuffix.length === 0) {
+            return this.showDomainList;
+          } else {
+            return this.showDomainList.filter((item) => {
+              return this.selectFilterSuffix.includes(
+                this.getDomainSuffix(item.name).suffix
+              );
+            });
+          }
+        },
+        fillterDomainSuffix() {
+          // 根据域名后缀分类
+          return [
+            ...new Set(
+              this.showDomainList.map((item) => {
+                return this.getDomainSuffix(item.name).suffix;
+              })
+            ),
+          ];
+        },
+        showOriginal() {
+          const firstDiscount = this.carList.filter(
+            (item) => this.checkList[0] === item.positions
+          );
+          const domainDiscount = firstDiscount[0]?.priceArr[0]?.discount;
+          if (this.checkList.length > 0 && domainDiscount > 0) {
+            return true;
+          } else {
+            return false;
+          }
+        },
+      },
+      methods: {
+        openFilter() {
+          this.isShowFilrer = !this.isShowFilrer;
+          this.selectFilterSuffix = [];
+        },
+        handelFilterSuffix(item) {
+          const index = this.selectFilterSuffix.indexOf(item);
+          if (index !== -1) {
+            this.selectFilterSuffix.splice(index, 1);
+          } else {
+            this.selectFilterSuffix.push(item);
+          }
+        },
+        calcEvent(eventList) {},
+        getQuery(name) {
+          const reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
+          const r = window.location.search.substr(1).match(reg);
+          if (r != null) return decodeURI(r[2]);
+          return null;
+        },
+        goLogin() {
+          sessionStorage.redirectUrl = "/cart/goodsList.htm";
+          location.href = "/login.htm";
+        },
+        // 选择文件
+        selectFile() {
+          document.getElementById("upFile").click();
+          // 监听文件上传
+          document.getElementById("upFile").addEventListener("change", (e) => {
+            // 获取文件
+            const file = e.target.files[0];
+            // 判断文件类型
+            if (file.type !== "text/plain") {
+              this.$message.warning(lang.template_text137);
+              return;
+            }
+            // 读取文件名
+            this.fileName = file.name;
+            // 读取文件
+            const reader = new FileReader();
+            // 判断txt文件编码格式
+            reader.readAsText(file, "utf-8");
+            reader.onload = (e) => {
+              const txtString = e.target.result;
+              // utf-8 的 中文编码 正则表达式
+              const patrn = /[\u4E00-\u9FA5]/gi;
+              // 检测当前文本是否含有中文（如果没有，则当乱码处理）
+              // 两个格式的英文编码一样，所以纯英文文件也当成乱码再处理一次
+              if (!patrn.exec(txtString)) {
+                let reader_gb2312 = new FileReader();
+                // 再拿一次纯文本，这一次拿到的文本一定不会乱码
+                reader_gb2312.readAsText(file, "gb2312");
+                reader_gb2312.onload = (e2) => {
+                  this.fileContent = e2.target.result;
+                };
+              } else {
+                this.fileContent = txtString;
+              }
+            };
+          });
+        },
+        confirmUpload() {
+          // 解析输入框中的换行 把换行替换成\n 传字符串
+          let params = this.fileContent
+            .replace(/[\r\n]/g, ",")
+            .split(",")
+            .filter((item) => {
+              return item !== "";
+            });
+          const maxLimt = this.domainConfig.number_limit || 500;
+          if (params.length > maxLimt) {
+            // 截取前500个
+            params = params.slice(0, maxLimt);
+          }
+          this.textarea2 = params.join("\n");
+          this.cancelUpload();
+        },
+        cancelUpload() {
+          document.getElementById("upFile").value = "";
+          document
+            .getElementById("upFile")
+            .removeEventListener("change", () => {});
+          this.fileName = "";
+          this.fileContent = "";
+          this.isShowUpload = false;
+        },
+        // 获取域名设置
+        getDomainSet() {
+          domainSetting().then((res) => {
+            this.domainConfig = res.data.data;
+            this.selectSuffix = res.data.data.default_search_domain || "";
+            const suffixArr = this.suffixList.reduce((all, cur) => {
+              all.push(cur.suffix);
+              return all;
+            }, []);
+            if (
+              suffixArr.length > 0 &&
+              !suffixArr.includes(this.selectSuffix)
+            ) {
+              this.selectSuffix = this.suffixList[0].suffix;
+            }
+            // 官网跳转查询
+            if (location.href.indexOf("suffix") !== -1) {
+              this.selectSuffix = this.getQuery("suffix");
+              this.handelDomainSearch();
+            }
+          });
+        },
+        // 是否已经加入购物车
+        isAddCart(item) {
+          const isHave = this.carList.find((cartItem) => {
+            return cartItem.config_options.domain === item.name;
+          });
+          return Boolean(isHave);
+        },
+        // 价格计算
+        priceCalc(item) {
+          if (item.priceArr.length === 0) {
+            return 0;
+          }
+          const price =
+            item.priceArr.find((priceItem) => {
+              return priceItem.buyyear === item.selectYear;
+            }) || [];
+          return price.buyprice;
+        },
+        goBuyDomain() {
+          if (this.checkList.length === 0) {
+            this.$message.warning(lang.template_text138);
+            return;
+          }
+          if (!this.isLogin) {
+            this.$message.warning(lang.template_text139);
+            sessionStorage.redirectUrl = "/cart/goodsList.htm";
+            this.goLogin();
+            return;
+          }
+          sessionStorage.setItem(
+            "buyDomainPosition",
+            JSON.stringify(this.checkList)
+          );
+          if (this.host_id) {
+            location.href = `/plugin/${getPluginId(
+              "IdcsmartDomain"
+            )}/buyDomain.htm?host_id=${this.host_id}`;
+          } else {
+            location.href = `/plugin/${getPluginId(
+              "IdcsmartDomain"
+            )}/buyDomain.htm`;
+          }
+        },
+        // 批量查询域名
+        batchSearchDomain() {
+          if (!this.textarea2) {
+            this.$message.warning(lang.template_text140);
+            return;
+          }
+          // 解析输入框中的换行 把换行替换成\n 传字符串
+          const params = this.textarea2
+            .replace(/[\r\n]/g, ",")
+            .split(",")
+            .filter((item) => {
+              return item !== "";
+            })
+            .join(",");
+          const maxLimt = this.domainConfig.number_limit || 500;
+          if (params.split(",").length - 1 >= maxLimt) {
+            this.$message.warning(
+              `${lang.template_text141}${maxLimt}${lang.template_text142}`
+            );
+            return;
+          }
+          this.batchLoading = true;
+          domainBatch({domains: params})
+            .then((res) => {
+              this.availList = res.data.data.avail.map((item) => {
+                item.priceArr = [];
+                item.showPrice = 0;
+                item.priceLoading = true;
+                return item;
+              });
+              // 查询可注册的域名价格
+              this.availList.forEach((item) => {
+                domainPrice({name: item.name, host_id: this.host_id})
+                  .then((res) => {
+                    item.priceArr = res.data.data || [];
+                    item.showPrice = res.data.data[0]?.buyprice || 0;
+                  })
+                  .finally(() => {
+                    item.priceLoading = false;
+                  });
+              });
+              this.unavailList = res.data.data.unavail;
+              this.faillList = res.data.data.fail;
+            })
+            .catch((err) => {})
+            .finally(() => {
+              this.batchLoading = false;
+            });
+        },
+        handleBatchChange(val) {
+          let checkedCount = val.length;
+          this.isBatchAllCheck = checkedCount === this.availList.length;
+          this.isBatchIndeterminate =
+            checkedCount > 0 && checkedCount < this.availList.length;
+        },
+        handleBatchCheckAllChange(val) {
+          this.batchCheckGroup = val
+            ? this.availList.map((item) => {
+                return item.name;
+              })
+            : [];
+          this.isBatchIndeterminate = false;
+        },
+        // 购物车列表
+        getCarList() {
+          this.isCarLoading = true;
+          cartList().then((res) => {
+            const arr = res.data.data.list
+              .map((item, index) => {
+                return {
+                  ...item,
+                  positions: index,
+                  selectYear: item.config_options.year,
+                  priceArr: [],
+                  showPrice: 0,
+                  priceLoading: true,
+                };
+              })
+              .filter((item) => {
+                return item.customfield.is_domain === 1;
+              });
+            // 拉取价格
+            this.carList = arr;
+            this.isCarLoading = false;
+            this.carList.forEach((item) => {
+              domainPrice({
+                name: item.config_options.domain,
+                host_id: this.host_id,
+              })
+                .then((res) => {
+                  item.priceArr = res.data.data || [];
+                  item.showPrice = res.data.data[0]?.buyprice || 0;
+                })
+                .catch((err) => {})
+                .finally(() => {
+                  item.priceLoading = false;
+                });
+            });
+          });
+        },
+        handleCheckAllChange(val) {
+          this.checkList = val
+            ? this.carList.map((item) => {
+                return item.positions;
+              })
+            : [];
+          this.isIndeterminate = false;
+        },
+        handleCheckedCitiesChange(value) {
+          let checkedCount = value.length;
+          this.isAllCheck = checkedCount === this.carList.length;
+          this.isIndeterminate =
+            checkedCount > 0 && checkedCount < this.carList.length;
+        },
+        // 加入购物车
+        addCart(item) {
+          if (this.isAddCart(item)) {
+            return;
+          }
+          this.isCarLoading = true;
+          const params = {
+            product_id: this.product_id,
+            config_options: {
+              domain: item.name,
+              year: 1,
+            },
+            qty: 1,
+            customfield: {
+              is_domain: 1, // 是否域名商品
+            },
+          };
+          addToCart(params)
+            .then((res) => {
+              if (res.data.status === 200) {
+                this.getCarList();
+              }
+            })
+            .catch((err) => {
+              this.$message.error(err.data.msg);
+            })
+            .finally(() => {
+              this.isCarLoading = false;
+            });
+        },
+        // 批量加入购物车
+        addAllCart() {
+          // 判断是否有选中的域名
+          if (this.batchCheckGroup.length === 0) {
+            this.$message.warning(lang.template_text138);
+            return;
+          }
+          if (this.addAllLoading) {
+            return;
+          }
+          this.addAllLoading = true;
+          // 筛选出选中的域名
+          const arr = this.availList.filter((item) => {
+            return this.batchCheckGroup.includes(item.name);
+          });
+          // 循环调用加入购物车接口
+          const productsArr = [];
+          arr.forEach((item) => {
+            const params = {
+              product_id: this.product_id,
+              config_options: {
+                domain: item.name,
+                year: 1,
+              },
+              qty: 1,
+              customfield: {
+                is_domain: 1, // 是否域名商品
+              },
+            };
+            productsArr.push(params);
+          });
+          addToCart({products: productsArr})
+            .then((res) => {
+              if (res.data.status === 200) {
+                this.getCarList();
+              }
+            })
+            .catch((err) => {
+              this.$message.error(err.data.msg);
+            })
+            .finally(() => {
+              this.addAllLoading = false;
+            });
+        },
+
+        // 修改购物车
+        changeCart(val, item) {
+          const params = {
+            position: item.positions,
+            product_id: item.product_id,
+            qty: 1,
+            config_options: {
+              domain: item.config_options.domain,
+              year: val,
+            },
+            customfield: {
+              is_domain: 1, // 是否域名商品
+            },
+          };
+          updateCart(params)
+            .then((res) => {
+              if (res.data.status === 200) {
+                // this.getCarList()
+              }
+            })
+            .catch((err) => {
+              this.$message.error(err.data.msg);
+            });
+        },
+
+        // 删除购物车
+        async deleteCart(item) {
+          this.isCarLoading = true;
+          const params = {
+            position: item.positions,
+          };
+          const res = await deleteCart(params);
+          if (res.data.status === 200) {
+            this.isCarLoading = false;
+            this.getCarList();
+          }
+        },
+        // 批量删除购物车
+        async deleteClearCart() {
+          if (this.carList.length === 0) {
+            return;
+          }
+          this.isCarLoading = true;
+          const params = {
+            positions: this.carList.map((item) => {
+              return item.positions;
+            }),
+          };
+          const res = await deleteCartBatch(params);
+          if (res.data.status === 200) {
+            this.isCarLoading = false;
+            this.getCarList();
+          }
+        },
+        // 获取后缀
+        async getSuffix() {
+          // DA购买域名需要传入产品ID筛选对于的后缀
+          try {
+            const res = await domainSuffix(this.host_id);
+            this.suffixList = res.data.data || [];
+            this.getDomainSet();
+          } catch (error) {
+            this.getDomainSet();
+          }
+        },
+        // 选择后缀
+        handelSelectSuffix(item) {
+          this.selectSuffix = item;
+        },
+        // 域名截断 return domain suffix baidu.com => baidu .com
+        getDomainSuffix(str) {
+          const domainStr = str.trim();
+          const domainRegex = /^[^.]+(\.[^.]+)+$/;
+          const domainData = {
+            domain: domainStr,
+            suffix: "",
+          };
+          if (domainRegex.test(domainStr)) {
+            const parts = domainStr.split(".");
+            domainData.domain = parts[0];
+            domainData.suffix =
+              parts.length >= 2 ? "." + parts.slice(1).join(".") : "";
+          }
+          return domainData;
+        },
+        handelDomainSearch() {
+          // 去除前后空格
+          this.domainInput = this.domainInput.trim();
+          if (!this.domainInput) {
+            this.$message.warning(lang.template_text140);
+            return;
+          }
+          const suffix = this.getDomainSuffix(this.domainInput).suffix;
+          if (
+            suffix &&
+            this.suffixList.find((item) => item.suffix === suffix)
+          ) {
+            this.selectSuffix = suffix;
+          }
+          this.isShowSuffixBox = false;
+          this.isSearching = true;
+          this.domainList = [];
+          this.domainInput = this.getDomainSuffix(this.domainInput).domain;
+          domainSearch({
+            domain: this.domainInput,
+            suffix: this.selectSuffix,
+            host_id: this.host_id,
+          })
+            .then((res) => {
+              if (res.data.status === 200) {
+                const list = res.data.data;
+                this.domainList = list.map((item) => {
+                  item.priceArr = [];
+                  item.showPrice = 0;
+                  item.priceLoading = true;
+
+                  return item;
+                });
+                this.isSearching = false;
+                this.domainList.forEach((item) => {
+                  if (item.avail === 1) {
+                    domainPrice({name: item.name, host_id: this.host_id})
+                      .then((res) => {
+                        item.priceArr = res.data.data || [];
+                        item.showPrice = res.data.data[0]?.buyprice || 0;
+                      })
+                      .finally(() => {
+                        item.priceLoading = false;
+                      });
+                  }
+                });
+                // 判断当前选中的域名后缀是否支持中文
+                const isChinese =
+                  this.suffixList.find((item) => {
+                    return item.suffix === this.selectSuffix;
+                  }).allow_zh === 0;
+                // 判断输入的是否是中文
+                const chineseReg = /[\u4e00-\u9fa5]/g;
+                if (isChinese && chineseReg.test(this.domainInput)) {
+                  this.domainList.unshift({
+                    // 添加一条不支持中文的提示
+                    name: this.domainInput + this.selectSuffix,
+                    avail: -2,
+                    description: lang.template_text143,
+                  });
+                }
+              }
+            })
+            .catch((err) => {
+              this.isSearching = false;
+            });
+        },
+        // 获取域名价格
+        getDomainPrice() {},
+        goWhois(item) {
+          window.open(
+            `/plugin/${getPluginId("IdcsmartDomain")}/whois.htm?domain=${
+              item.name
+            }`
+          );
+        },
+        getRule(arr) {
+          let isHave = this.showFun(arr, "CartController::index");
+          if (isHave) {
+            this.isShowView = true;
+          }
+          if (!this.isShowView) {
+            // 没有权限
+            location.href = "/noPermissions.htm";
+          }
+        },
+        showFun(arr, str) {
+          if (typeof arr == "string") {
+            return true;
+          } else {
+            let isShow = "";
+            isShow = arr.find((item) => {
+              let isHave = item.includes(str);
+              if (isHave) {
+                return isHave;
+              }
+            });
+            return isShow;
+          }
+        },
+        // 获取一级分类
+        getProductGroup_first() {
+          productGroupFirst().then((res) => {
+            this.first_group_list = res.data.data.list;
+          });
+        },
+        // 搜索
+        searchGoods() {
+          this.searchLoading = true;
+          this.goodsParmas.keywords = this.searchValue;
+          this.goodsParmas.id = "";
+          this.goodsParmas.page = 1;
+          this.goodsList = [];
+          this.getProductGoodList();
+        },
+        // 获取二级分类
+        getProductGroup_second(id) {
+          productGroupSecond(id).then((res) => {
+            this.secondLoading = false;
+            this.second_group_list = res.data.data.list;
+            if (res.data.data.list[0]) {
+              this.select_second_obj.id = res.data.data.list[0].id;
+              this.select_second_obj.type = res.data.data.list[0].type;
+              this.select_second_obj.description =
+                res.data.data.list[0]?.description;
+              this.goodsParmas.id = this.select_second_obj.id;
+              if (this.select_second_obj.type === "domain") {
+                this.getSuffix();
+              }
+              this.getProductGoodList();
+            }
+          });
+        },
+        // 获取商品列表
+        getProductGoodList() {
+          this.goodSLoading = true;
+          productGoods(this.goodsParmas).then((res) => {
+            if (
+              this.select_second_obj.type === "domain" &&
+              res.data.data.list[0]
+            ) {
+              this.product_id = res.data.data.list[0].id;
+            }
+            this.searchLoading = false;
+            const list = res.data.data.list.map((item) => {
+              item.activeList = [];
+              return item;
+            });
+            if (this.isShowFull) {
+              list.forEach((item) => {
+                eventPromotion({id: item.id}).then((res) => {
+                  item.activeList = res.data.list;
+                });
+              });
+            }
+            this.goodsList = this.goodsList.concat(list);
+            this.goodSLoading = false;
+            this.scrollDisabled =
+              res.data.data.list.length < this.goodsParmas.limit;
+            this.$nextTick(() => {
+              // 判断当前列表是否达到滚动加载的条件
+              this.needScroll();
+            });
+          });
+        },
+        needScroll() {
+          const scrollTop =
+            document.documentElement.scrollTop || document.body.scrollTop;
+          const clientHeight = document.documentElement.clientHeight;
+          const scrollHeight = document.documentElement.scrollHeight;
+          if (
+            scrollTop + clientHeight >= scrollHeight &&
+            !this.scrollDisabled
+          ) {
+            this.goodsParmas.page++;
+            this.getProductGoodList();
+          }
+        },
+        // 初始化
+        async initData() {
+          // 获取一级分类
+          await productGroupFirst().then((res) => {
+            this.first_group_list = res.data.data.list;
+          });
+          if (this.first_group_list[0]) {
+            this.select_first_obj.id =
+              this.fpg_id || this.first_group_list[0].id;
+            this.secondLoading = true;
+            // 获取二级分类
+            await productGroupSecond(this.select_first_obj.id).then((ress) => {
+              this.second_group_list = ress.data.data.list;
+            });
+            if (this.second_group_list[0]) {
+              this.select_second_obj.id =
+                this.spg_id || this.second_group_list[0].id;
+              const selectItem = this.second_group_list.find(
+                (item) => item.id === this.select_second_obj.id
+              );
+              this.select_second_obj.type = selectItem?.type;
+              this.select_second_obj.description = selectItem?.description;
+              this.goodsParmas.page = 1;
+              this.goodsParmas.id = this.spg_id || this.second_group_list[0].id;
+              this.secondLoading = false;
+              if (this.select_second_obj.type === "domain") {
+                this.getSuffix();
+              }
+              this.getProductGoodList();
+            } else {
+              this.goodSLoading = false;
+              this.goodsList = [];
+            }
+          } else {
+            this.goodSLoading = false;
+            this.goodsList = [];
+          }
+        },
+        // 点击一级分类
+        selectFirstType(val) {
+          this.select_first_obj.id = val;
+          this.secondLoading = true;
+          this.goodsParmas.page = 1;
+          this.second_group_list = [];
+          this.select_second_obj = {
+            id: "",
+            type: "",
+            description: "",
+          };
+          this.getProductGroup_second(val);
+          this.goodsList = [];
+        },
+        // 点击二级分类
+        selectSecondType(val) {
+          this.select_second_obj.id = val;
+          const clickItem = this.second_group_list.find((item) => {
+            return item.id === val;
+          });
+          this.select_second_obj.type = clickItem?.type;
+          this.select_second_obj.description = clickItem?.description;
+          this.goodsList = [];
+          this.goodsParmas.page = 1;
+          this.goodsParmas.id = val;
+          if (this.select_second_obj.type === "domain") {
+            this.getSuffix();
+          }
+          this.getProductGoodList();
+        },
+        // 获取通用配置
+        getCommonData() {
+          getCommon().then((res) => {
+            this.commonData = res.data.data;
+            localStorage.setItem(
+              "common_set_before",
+              JSON.stringify(res.data.data)
+            );
+            document.title =
+              this.commonData.website_name + "-" + lang.common_cloud_text301;
+          });
+        },
+        // 点击购买
+        goOrder(item) {
+          if (
+            Boolean(
+              (JSON.parse(localStorage.getItem("common_set_before")) || {})
+                .custom_fields?.before_settle === 1
+            )
+          ) {
+            window.open("/account.htm");
+            return;
+          }
+          // 新窗口打开
+          window.open(`goods.htm?id=${item.id}`);
+        },
+        // 滚动计算
+        scrollBottom() {
+          if (this.select_second_obj.type === "domain") {
+            return;
+          }
+          const scrollTop =
+            document.documentElement.scrollTop || document.body.scrollTop;
+          const clientHeight = document.documentElement.clientHeight;
+          const scrollHeight = document.documentElement.scrollHeight;
+          if (scrollTop + clientHeight >= scrollHeight) {
+            if (this.scrollDisabled) {
+            } else {
+              this.goodsParmas.page++;
+              this.getProductGoodList();
+            }
+          }
+        },
+      },
+      watch: {
+        "select_first_obj.id": function (val) {
+          // 更改url 中fpg_id 和 spg_id 参数
+          const url = window.location.href;
+          // 拿到当前url中的参数
+          const params = new URLSearchParams(url.split("?")[1]);
+          // 改变参数
+          params.set("fpg_id", val);
+          // 重新组装url
+          const newUrl = `${url.split("?")[0]}?${params.toString()}`;
+          // 替换当前url
+          window.history.replaceState({}, "", newUrl);
+        },
+        "select_second_obj.id": function (val) {
+          // 更改url 中fpg_id 和 spg_id 参数
+          const url = window.location.href;
+          // 拿到当前url中的参数
+          const params = new URLSearchParams(url.split("?")[1]);
+          // 改变参数
+          params.set("spg_id", val);
+          // 重新组装url
+          const newUrl = `${url.split("?")[0]}?${params.toString()}`;
+          // 替换当前url
+          window.history.replaceState({}, "", newUrl);
+        },
+      },
+    }).$mount(template);
+    typeof old_onload == "function" && old_onload();
+  };
+})(window);
diff --git a/clientarea/cart/hgcart/js/settlement.js b/clientarea/cart/hgcart/js/settlement.js
new file mode 100644
index 0000000..e33e001
--- /dev/null
+++ b/clientarea/cart/hgcart/js/settlement.js
@@ -0,0 +1,367 @@
+(function (window, undefined) {
+  var old_onload = window.onload;
+  window.onload = function () {
+    const template = document.getElementsByClassName("template")[0];
+    Vue.prototype.lang = window.lang;
+    const host = location.host;
+    const fir = location.pathname.split("/")[1];
+    const str = `${host}/${fir}/`;
+    new Vue({
+      components: {
+        asideMenu,
+        topMenu,
+        payDialog,
+        eventCode,
+      },
+      created() {
+        localStorage.frontMenusActiveId = "";
+        const temp = this.getQuery(location.search);
+        if (temp.cart) {
+          // 购物车过来
+          this.selectGoodsList = JSON.parse(sessionStorage.shoppingCartList);
+          this.isFormShoppingCart = true;
+        } else {
+          const obj = sessionStorage.product_information
+            ? JSON.parse(sessionStorage.product_information)
+            : sessionStorage.settleItem
+            ? JSON.parse(sessionStorage.settleItem)
+            : {};
+          sessionStorage.settleItem = sessionStorage.product_information;
+          sessionStorage.removeItem("product_information");
+          this.isFormShoppingCart = false;
+          this.productObj = {
+            product_id: temp.id ? temp.id : obj.id ? obj.id : "",
+            config_options: obj.config_options,
+            qty: Number(obj.qty),
+            customfield: obj.customfield,
+            self_defined_field: obj.self_defined_field,
+          };
+          productDetail(this.productObj.product_id).then((res) => {
+            this.productObj.name = res.data.data.product.name;
+          });
+        }
+        this.getCommonData();
+        // this.getPayLisy();
+      },
+      mounted() {
+        this.addons_js_arr = JSON.parse(
+          document.querySelector("#addons_js").getAttribute("addons_js")
+        ); // 插件列表
+        const arr = this.addons_js_arr.map((item) => {
+          return item.name;
+        });
+        if (arr.includes("PromoCode")) {
+          // 开启了优惠码插件
+          this.isShowPromo = true;
+        }
+        if (arr.includes("IdcsmartClientLevel")) {
+          // 开启了等级优惠
+          this.isShowLevel = true;
+        }
+        if (arr.includes("EventPromotion")) {
+          // 开启活动满减
+          this.isShowFull = true;
+        }
+        this.getCartList();
+      },
+      updated() {
+        // 关闭loading
+        document.getElementById("mainLoading").style.display = "none";
+        document.getElementsByClassName("template")[0].style.display = "block";
+      },
+      data() {
+        return {
+          initArr: [],
+          commonData: {}, // 公告接口数据
+          addons_js_arr: [],
+          showPayBtn: false,
+
+          totalPriceLoading: false,
+
+          goodIdList: [],
+          isUseDiscountCode: false,
+          productObj: {
+            customfield: {},
+          }, // 单独结算的商品对象
+          shoppingList: [], // 所有购物车列表
+          listLoading: false,
+          selectGoodsList: [],
+          isFormShoppingCart: true, // 是否从购物车页面结算
+          showGoodsList: [], // 展示的列表
+          payTypeList: [], // 支付渠道数组
+          payType: "", // 选择的支付渠道
+          checked: false, // 勾选隐私协议
+          isShowPromo: false, // 是否开启优惠码
+          isShowLevel: false, // 是否开启等级优惠
+          isShowFull: false,
+          subBtnLoading: false, // 提交按钮loading
+        };
+      },
+
+      filters: {
+        formateTime(time) {
+          if (time && time !== 0) {
+            return formateDate(time * 1000);
+          } else {
+            return "--";
+          }
+        },
+        filterMoney(money) {
+          if (isNaN(money) || money * 1 < 0) {
+            return "0.00";
+          } else {
+            return formatNuberFiexd(money);
+          }
+        },
+      },
+      computed: {
+        finallyPrice() {
+          return this.totalPrice;
+        },
+        totalLevelDiscount() {
+          return formatNuberFiexd(
+            this.showGoodsList.reduce((pre, cur) => {
+              return pre + cur.level_discount * 1;
+            }, 0)
+          );
+        },
+        totalPrice() {
+          return formatNuberFiexd(
+            this.showGoodsList.reduce((pre, cur) => {
+              return pre + cur.calcItemPrice * 1;
+            }, 0)
+          );
+        },
+        orginPrice() {
+          return formatNuberFiexd(
+            this.showGoodsList.reduce((pre, cur) => {
+              return pre + cur.price * 1;
+            }, 0)
+          );
+        },
+        totalCodelDiscount() {
+          return formatNuberFiexd(
+            this.showGoodsList.reduce((pre, cur) => {
+              return pre + cur.code_discount * 1;
+            }, 0)
+          );
+        },
+        totalFullDiscount() {
+          return formatNuberFiexd(
+            this.showGoodsList.reduce((pre, cur) => {
+              return pre + cur.eventDiscount * 1;
+            }, 0)
+          );
+        },
+      },
+      methods: {
+        getRule(arr) {
+          let isHave = this.showFun(arr, "PayController::pay");
+          if (isHave) {
+            this.showPayBtn = true;
+          }
+        },
+        showFun(arr, str) {
+          if (typeof arr == "string") {
+            return true;
+          } else {
+            let isShow = "";
+            isShow = arr.find((item) => {
+              let isHave = item.includes(str);
+              if (isHave) {
+                return isHave;
+              }
+            });
+            return isShow;
+          }
+        },
+        // 获取购物车列表
+        async getCartList() {
+          this.listLoading = true;
+          this.initArr = [];
+          if (this.isFormShoppingCart) {
+            // 从购物车结算
+            await cartList().then((res) => {
+              this.shoppingList = res.data.data.list;
+              this.selectGoodsList.forEach((item) => {
+                const obj = this.shoppingList[item];
+                this.initArr.push(obj);
+              });
+            });
+          } else {
+            // 从商品详情结算
+            this.initArr.push(this.productObj);
+          }
+
+          this.initArr.forEach((item) => {
+            item.isLoading = true;
+            item.priceLoading = false;
+            item.price = 0; // 商品单价
+            item.code_discount = 0; // 商品优惠码抵扣金额
+            item.isUseDiscountCode = false;
+            item.level_discount = 0; // 商品等级优惠折扣金额
+            item.eventDiscount = 0;
+            item.calcItemPrice = 0;
+            this.goodIdList.push(item.product_id);
+            this.getConfigOption(item);
+          });
+          this.showGoodsList = [...this.initArr];
+          this.listLoading = false;
+        },
+        // 获取商品配置项价格
+        getConfigOption(item) {
+          const params = {
+            config_options: {
+              ...item.config_options,
+              promo_code: item.customfield.promo_code,
+              event_promotion: item.customfield.event_promotion,
+            },
+            qty: item.qty,
+          };
+          item.priceLoading = true;
+          configOption(item.product_id, params)
+            .then(async (res) => {
+              item.info = res.data.data;
+              const son_previews = [];
+              if (res.data.data.other && res.data.data.other.son_previews) {
+                res.data.data.other.son_previews.forEach((i) => {
+                  i.forEach((items) => {
+                    son_previews.push(items);
+                  });
+                });
+              }
+              if (res.data.data.sub_host && res.data.data.sub_host.length > 0) {
+                res.data.data.sub_host.forEach((i) => {
+                  i.preview.forEach((items) => {
+                    son_previews.push(items);
+                  });
+                });
+              }
+              item.preview = res.data.data.preview.concat(son_previews);
+              item.price = res.data.data.price * 1;
+              item.calcItemPrice = res.data.data.price_total * 1;
+              item.level_discount =
+                res.data.data.price_client_level_discount * 1 || 0;
+              item.code_discount =
+                res.data.data.price_promo_code_discount * 1 || 0;
+              item.eventDiscount =
+                res.data.data.price_event_promotion_discount * 1 || 0;
+            })
+            .catch((err) => {
+              item.preview = [];
+            })
+            .finally(() => {
+              item.priceLoading = false;
+              item.isLoading = false;
+              this.showGoodsList = [...this.initArr];
+              this.$forceUpdate();
+            });
+        },
+
+        goPay() {
+          if (!this.checked) {
+            this.$message.warning(lang.shoppingCar_tip_text6);
+            return;
+          }
+          if (
+            Boolean(
+              (JSON.parse(localStorage.getItem("common_set_before")) || {})
+                .custom_fields?.before_settle === 1
+            )
+          ) {
+            window.open("/account.htm");
+            return;
+          }
+          this.subBtnLoading = true;
+          const settleApi = this.isFormShoppingCart
+            ? cart_settle
+            : product_settle;
+          const params = this.isFormShoppingCart
+            ? {
+                positions: this.selectGoodsList,
+              }
+            : {
+                product_id: this.productObj.product_id,
+                config_options: this.productObj.config_options,
+                customfield: this.productObj.customfield,
+                self_defined_field: this.productObj.self_defined_field,
+                qty: this.productObj.qty,
+              };
+          settleApi(params)
+            .then((res) => {
+              this.$refs.payDialog.showPayDialog(
+                res.data.data.order_id,
+                res.data.data.amount,
+                this.payType
+              );
+            })
+            .catch((err) => {
+              if (err.data?.data?.certification === 0) {
+                this.$message.error({
+                  duration: 0,
+                  showClose: true,
+                  dangerouslyUseHTMLString: true,
+                  message: `${err.data.msg} 
+                   <a style="margin-left:5px;" target="_blank" href="/plugin/${getPluginId(
+                     "IdcsmartCertification"
+                   )}/authentication_select.htm">${lang.wx_tip7}</a>
+                  `,
+                  type: "error",
+                });
+              } else {
+                this.$message.error(err.data.msg);
+              }
+            })
+            .finally(() => {
+              this.subBtnLoading = false;
+            });
+        },
+
+        // 支付成功回调
+        paySuccess(e) {
+          location.href = "/finance.htm";
+        },
+        // 取消支付回调
+        payCancel(e) {
+          location.href = "/finance.htm";
+        },
+        getPayLisy() {
+          payLisy().then((res) => {
+            this.payTypeList = res.data.data.list;
+            this.payType = res.data.data.list[0].name;
+          });
+        },
+        // 解析url
+        getQuery(url) {
+          const str = url.substr(url.indexOf("?") + 1);
+          const arr = str.split("&");
+          const res = {};
+          for (let i = 0; i < arr.length; i++) {
+            const item = arr[i].split("=");
+            res[item[0]] = item[1];
+          }
+          return res;
+        },
+        goTermsServiceUrl() {
+          window.open(this.commonData.terms_service_url);
+        },
+        goTermsPrivacUrl() {
+          window.open(this.commonData.terms_privacy_url);
+        },
+        goHelpUrl(url) {
+          window.open(this.commonData[url]);
+        },
+
+        // 获取通用配置
+        getCommonData() {
+          this.commonData = JSON.parse(
+            localStorage.getItem("common_set_before")
+          );
+          document.title =
+            this.commonData.website_name + "-" + lang.shoppingCar_tip_text7;
+        },
+      },
+    }).$mount(template);
+    typeof old_onload == "function" && old_onload();
+  };
+})(window);
diff --git a/clientarea/cart/hgcart/js/shoppingCar.js b/clientarea/cart/hgcart/js/shoppingCar.js
new file mode 100644
index 0000000..f546b7d
--- /dev/null
+++ b/clientarea/cart/hgcart/js/shoppingCar.js
@@ -0,0 +1,510 @@
+(function (window, undefined) {
+  var old_onload = window.onload;
+  window.onload = function () {
+    const template = document.getElementsByClassName("template")[0];
+    Vue.prototype.lang = window.lang;
+    new Vue({
+      components: {
+        asideMenu,
+        topMenu,
+        discountCode,
+        eventCode,
+      },
+      created() {
+        localStorage.frontMenusActiveId = "";
+        this.getCommonData();
+      },
+      mounted() {
+        this.addons_js_arr = JSON.parse(
+          document.querySelector("#addons_js").getAttribute("addons_js")
+        ); // 插件列表
+        const arr = this.addons_js_arr.map((item) => {
+          return item.name;
+        });
+        if (arr.includes("PromoCode")) {
+          // 开启了优惠码插件
+          this.isShowPromo = true;
+        }
+        if (arr.includes("IdcsmartClientLevel")) {
+          // 开启了等级优惠
+          this.isShowLevel = true;
+        }
+        if (arr.includes("EventPromotion")) {
+          // 开启活动满减
+          this.isShowFull = true;
+        }
+        this.getCartList();
+      },
+      updated() {
+        // 关闭loading
+        document.getElementById("mainLoading").style.display = "none";
+        document.getElementsByClassName("template")[0].style.display = "block";
+      },
+      destroyed() { },
+      data() {
+        return {
+          timer1: null,
+          listLoding: false,
+          commonData: {},
+          searchVal: "",
+          checkedCities: [],
+          checkAll: false, // 是否全选
+          visible: false,
+          showList: [],
+          addons_js_arr: [], // 插件列表
+          shoppingList: [],
+          isShowPromo: false, // 是否开启优惠码
+          isShowLevel: false, // 是否开启等级优惠
+          isShowFull: false, // 是否开启满减优惠
+          settleLoading: false,
+        };
+      },
+
+      filters: {
+        formateTime(time) {
+          if (time && time !== 0) {
+            return formateDate(time * 1000);
+          } else {
+            return "--";
+          }
+        },
+        filterMoney(money) {
+          if (isNaN(money) || money * 1 < 0) {
+            return "0.00";
+          } else {
+            return formatNuberFiexd(money);
+          }
+        },
+      },
+      computed: {
+        totalPrice() {
+          return this.showList
+            .filter((item) => {
+              return this.checkedCities.includes(item.position);
+            })
+            .reduce((pre, cur) => {
+              return pre + cur.calcItemPrice * 1;
+            }, 0);
+        },
+        nowList() {
+          if (this.searchVal !== "") {
+            return this.showList.filter((item) =>
+              item.name.includes(this.searchVal)
+            );
+          } else {
+            return this.showList;
+          }
+        },
+      },
+      methods: {
+        // 获取购物车列表
+        getCartList() {
+          this.listLoding = true;
+          cartList()
+            .then((res) => {
+              this.shoppingList = res.data.data.list.map((item, index) => {
+                item.price = 0; // 商品单价
+                item.calcItemPrice = 0;
+                item.code_discount = 0; // 商品优惠码抵扣金额
+                item.level_discount = 0; // 商品等级优惠折扣金额
+                item.eventDiscount = 0; // 商品活动优惠金额
+                item.isUseDiscountCode = false; // 商品是否使用优惠码
+                item.position = index; // 商品所在购物车位置
+                item.isShowTips = false; // 是否提示商品库存不足
+                item.priceLoading = true; // 商品价格loading
+                if (item.stock_control === 1 && item.qty > item.stock_qty) {
+                  item.isShowTips = true;
+                  item.qty = item.stock_qty;
+                }
+                item.isLoading = true; // 商品loading
+                return item;
+              });
+              const arr = this.shoppingList.filter((arritem) => {
+                return arritem.customfield?.is_domain !== 1;
+              });
+              this.listLoding = false;
+              this.showList = [...arr];
+              this.showList.forEach((item) => {
+                this.getConfigOption(item);
+              });
+            })
+            .catch((err) => {
+              console.log(err);
+              this.listLoding = false;
+            });
+        },
+        // 获取商品配置项价格
+        getConfigOption(item) {
+          const params = {
+            config_options: {
+              ...item.config_options,
+              promo_code: item.customfield.promo_code,
+              event_promotion: item.customfield.event_promotion,
+            },
+            qty: item.qty,
+          };
+          item.priceLoading = true;
+          configOption(item.product_id, params)
+            .then(async (res) => {
+              item.info = res.data.data;
+              const son_previews = [];
+              if (res.data.data.other && res.data.data.other.son_previews) {
+                res.data.data.other.son_previews.forEach((i) => {
+                  i.forEach((items) => {
+                    son_previews.push(items);
+                  });
+                });
+              }
+              if (res.data.data.sub_host && res.data.data.sub_host.length > 0) {
+                res.data.data.sub_host.forEach((i) => {
+                  i.preview.forEach((items) => {
+                    son_previews.push(items);
+                  });
+                });
+              }
+              item.preview = res.data.data.preview.concat(son_previews);
+              item.price = res.data.data.price * 1;
+              item.base_price = res.data.data.base_price * 1;
+              item.calcItemPrice = res.data.data.price_total * 1;
+              item.level_discount =
+                res.data.data.price_client_level_discount * 1 || 0;
+              item.code_discount =
+                res.data.data.price_promo_code_discount * 1 || 0;
+              item.eventDiscount =
+                res.data.data.price_event_promotion_discount * 1 || 0;
+            })
+            .catch((err) => {
+              item.preview = [];
+            })
+            .finally(() => {
+              item.priceLoading = false;
+              item.isLoading = false;
+              this.showList = [...this.showList];
+              this.$forceUpdate();
+            });
+        },
+        // 更改活动
+        changeEventCode(priceObj, item) {
+          if (item.customfield.event_promotion == priceObj.id) {
+            return;
+          }
+          item.customfield.event_promotion = priceObj.id;
+          const params = {
+            position: item.position,
+            product_id: item.product_id,
+            config_options: item.config_options, // 配置信息
+            qty: item.qty, // 商品数量
+            customfield: item.customfield,
+            self_defined_field: item.self_defined_field,
+          };
+          updateCart(params).then((res) => {
+            this.getConfigOption(item);
+          });
+        },
+        // 使用优惠码
+        getDiscount(data) {
+          this.showList.forEach((item) => {
+            if (item.position === data[2]) {
+              item.customfield.promo_code = data[1];
+              item.isUseDiscountCode = true;
+              const params = {
+                position: data[2],
+                product_id: item.product_id,
+                config_options: item.config_options, // 配置信息
+                qty: item.qty, // 商品数量
+                customfield: item.customfield,
+                self_defined_field: item.self_defined_field,
+              };
+              updateCart(params).then((res) => {
+                this.getConfigOption(item);
+              });
+            }
+          });
+        },
+        // 删除优惠码
+        removeDiscountCode(item) {
+          item.customfield.promo_code = "";
+          item.isUseDiscountCode = false;
+          let i;
+          this.showList.forEach((items, index) => {
+            if (items.position === item.position) {
+              i = index;
+            }
+          });
+          const params = {
+            position: i,
+            product_id: item.product_id,
+            config_options: item.config_options, // 配置信息
+            qty: item.qty, // 商品数量
+            customfield: item.customfield,
+            self_defined_field: item.self_defined_field,
+          };
+          updateCart(params).then((res) => {
+            this.getConfigOption(item);
+          });
+        },
+        // 搜索
+        searchValChange(value) {
+          this.checkedCities = [];
+          this.checkAll = false;
+        },
+        // 点击全选按钮
+        handleCheckAllChange(val) {
+          const arr = this.showList.filter((item) => {
+            return item.info;
+          });
+          const arrr = arr.map((item) => {
+            return item.position;
+          });
+          this.checkedCities = val ? arrr : [];
+        },
+        // 编辑商品数量
+        handelEditGoodsNum(index, num) {
+          return editGoodsNum(index, num);
+        },
+        // 编辑商品
+        goGoods(item) {
+          if (item.info) {
+            const obj = {
+              config_options: item.config_options, // 配置信息
+              position: item.position, // 修改接口要用的位置信息
+              qty: item.qty, // 商品数量
+              customfield: item.customfield,
+              self_defined_field: item.self_defined_field,
+            };
+            sessionStorage.setItem("product_information", JSON.stringify(obj));
+          }
+          location.href = `goods.htm?id=${item.product_id}&change=true&name=${item.name}`;
+        },
+        // 监听购物车选择数量变化
+        handleCheckedCitiesChange(value) {
+          this.checkAll = value.length === this.showList.length;
+        },
+        // 删除商品函数
+        deleteGoodsList(arr) {
+          deleteGoods(arr)
+            .then((res) => {
+              if (res.data.status === 200) {
+                this.$message.success(res.data.msg);
+                this.getCartList();
+                this.$refs.topMenu.getCartList();
+              }
+            })
+            .catch((err) => {
+              err.data.msg && this.$message.error(err.data.msg);
+            })
+            .finally(() => { });
+        },
+        // 点击删除按钮
+        handelDeleteGoods(item) {
+          // 调用删除接口
+          const p = item.position;
+          let shoppingList_index = 0;
+          let checkedCities_index = 0;
+          let show_index = 0;
+          // 删除列表中对应的商品
+          this.shoppingList.forEach((listItem, index) => {
+            if (listItem.position === p) {
+              shoppingList_index = index;
+            }
+          });
+          this.checkedCities.forEach((listItem, index) => {
+            if (listItem === p) {
+              checkedCities_index = index;
+            }
+          });
+          this.showList.forEach((listItem, index) => {
+            if (listItem === p) {
+              show_index = index;
+            }
+          });
+          this.showList.splice(show_index, 1);
+          this.checkedCities.splice(checkedCities_index, 1);
+          this.deleteGoodsList([item.position]);
+        },
+        // 删除选中的商品
+        deleteCheckGoods() {
+          if (this.checkedCities.length === 0) {
+            this.$message.warning(lang.referral_status9);
+            return;
+          } else {
+            this.deleteGoodsList(this.checkedCities);
+            this.checkedCities = [];
+          }
+        },
+        // 商品数量增加减少
+        handleChange(n, o, item) {
+          if (item.stock_control === 1 && n >= item.stock_qty) {
+            this.$message.error(lang.referral_status10);
+            return;
+          }
+          // 节个流
+          if (this.timer1) {
+            clearTimeout(this.timer1);
+            this.timer1 = null;
+          }
+          item.priceLoading = true;
+
+          this.timer1 = setTimeout(() => {
+            this.handelEditGoodsNum(item.position, n)
+              .then(async () => {
+                this.getConfigOption(item);
+              })
+              .catch((err) => {
+                err.data.msg && this.$message.error(err.data.msg);
+              })
+              .finally(() => {
+                item.priceLoading = false;
+                clearTimeout(this.timer1);
+                this.timer1 = null;
+              });
+            this.syncBindTool(item);
+          }, 500);
+        },
+        // 同步绑定工具函数
+        syncBindTool(item) {
+          if (
+            item.customfield.product_related_limit &&
+            item.customfield.product_related_limit?.related.length > 0
+          ) {
+            const arr = item.customfield.product_related_limit.related || [];
+            //  循环判断是否有关联商品
+            // 过滤出关联商品
+            const relatedList = this.showList.filter((items) => {
+              return (
+                arr.includes(items.product_id * 1) ||
+                arr.includes(String(items.product_id))
+              );
+            });
+            // 过滤出和当前商品ID一样的列表
+            const someList = this.showList.filter((items) => {
+              return items.product_id == item.product_id;
+            });
+            // 对比关联商品和当前商品的数量
+            const relatedNum = relatedList.reduce((pre, cur) => {
+              return pre + cur.qty;
+            }, 0);
+            const someNum = someList.reduce((pre, cur) => {
+              return pre + cur.qty;
+            }, 0);
+            if (relatedNum != someNum && relatedNum !== 0) {
+              if (someNum > relatedNum) {
+                // 如果关联商品数量小于当前商品数量 给筛选出来的关联商品加1
+                this.handelEditGoodsNum(
+                  relatedList[0].position,
+                  relatedList[0].qty + (someNum - relatedNum)
+                ).then(async () => {
+                  this.showList.forEach((items) => {
+                    if (items.position == relatedList[0].position) {
+                      items.qty = relatedList[0].qty + (someNum - relatedNum);
+                      this.getConfigOption(items);
+                      this.$forceUpdate();
+                    }
+                  });
+                });
+              } else {
+                // 如果关联商品数量大于当前商品数量 给当前商品加1
+                this.handelEditGoodsNum(
+                  relatedList[0].position,
+                  relatedList[0].qty > relatedNum - someNum
+                    ? relatedList[0].qty - (relatedNum - someNum)
+                    : 1
+                ).then(async () => {
+                  this.showList.forEach((items) => {
+                    if (items.position == relatedList[0].position) {
+                      items.qty =
+                        relatedList[0].qty > relatedNum - someNum
+                          ? relatedList[0].qty - (relatedNum - someNum)
+                          : 1;
+                      this.getConfigOption(items);
+                      this.$forceUpdate();
+                    }
+                  });
+                });
+              }
+            }
+          }
+        },
+        checkBindFun(selctedArr) {
+          let flag = true;
+          selctedArr.forEach((item) => {
+            if (
+              item.customfield.product_related_limit &&
+              item.customfield.product_related_limit?.related.length > 0
+            ) {
+              const arr = item.customfield.product_related_limit.related || [];
+              //  循环判断是否有关联商品
+              // 过滤出关联商品
+              const relatedList = selctedArr.filter((items) => {
+                return (
+                  arr.includes(items.product_id * 1) ||
+                  arr.includes(String(items.product_id))
+                );
+              });
+              // 过滤出和当前商品ID一样的列表
+              const someList = selctedArr.filter((items) => {
+                return items.product_id == item.product_id;
+              });
+              // 对比关联商品和当前商品的数量
+              const relatedNum = relatedList.reduce((pre, cur) => {
+                return pre + cur.qty;
+              }, 0);
+              const someNum = someList.reduce((pre, cur) => {
+                return pre + cur.qty;
+              }, 0);
+              if (relatedNum != someNum) {
+                flag = false;
+              }
+            }
+          });
+          return flag;
+        },
+        // 结算
+        goSettle() {
+          // 判断是否需要先设置账户，如果需要则跳转到设置账户页面
+          if (
+            Boolean(
+              (JSON.parse(localStorage.getItem("common_set_before")) || {})
+                .custom_fields?.before_settle === 1
+            )
+          ) {
+            window.open("/account.htm");
+            return;
+          }
+          if (this.checkedCities.length === 0) {
+            this.$message.warning(lang.referral_status11);
+            return;
+          }
+          const arr = []; // 装的是被选中的商品在购物位置的索引
+          this.showList.forEach((item) => {
+            this.checkedCities.forEach((items) => {
+              if (items == item.position) {
+                arr.push(item);
+              }
+            });
+          });
+          if (!this.checkBindFun(arr)) {
+            this.$message.warning(lang.cart_tip_text14);
+            return;
+          }
+          this.settleLoading = true;
+          sessionStorage.shoppingCartList = JSON.stringify(this.checkedCities);
+          setTimeout(() => {
+            location.href = `/cart/settlement.htm?cart=1`;
+            this.settleLoading = false;
+          }, 500);
+        },
+
+        // 获取通用配置
+        getCommonData() {
+          this.commonData = JSON.parse(
+            localStorage.getItem("common_set_before")
+          );
+          document.title =
+            this.commonData.website_name + "-" + lang.shoppingCar_title;
+        },
+      },
+    }).$mount(template);
+    typeof old_onload == "function" && old_onload();
+  };
+})(window);
diff --git a/clientarea/cart/hgcart/settlement.php b/clientarea/cart/hgcart/settlement.php
new file mode 100644
index 0000000..03842ae
--- /dev/null
+++ b/clientarea/cart/hgcart/settlement.php
@@ -0,0 +1,182 @@
+<link rel="stylesheet" href="/{$template_catalog_cart}/template/{$themes_cart}/css/settlement.css">
+</head>
+
+<body>
+  <!-- mounted之前显示 -->
+  <div id="mainLoading">
+    <div class="ddr ddr1"></div>
+    <div class="ddr ddr2"></div>
+    <div class="ddr ddr3"></div>
+    <div class="ddr ddr4"></div>
+    <div class="ddr ddr5"></div>
+  </div>
+  <div class="template">
+    <el-container>
+      <aside-menu @getruleslist="getRule"></aside-menu>
+      <el-container>
+        <top-menu></top-menu>
+        <el-main>
+          <!-- 自己的东西 -->
+          <div class="main-card">
+            <div class="main-title">
+              {{lang.settlement_title}}
+              <p class="dont-save-password" v-if="commonData.donot_save_client_product_password === 1">
+                {{lang.dont_save_password_tip}}
+              </p>
+            </div>
+            <div class="goods-box">
+              <div class="goods-item" v-loading="listLoading">
+                <div v-for="(item,index) in showGoodsList" :key="index" class="shopping-goods"
+                  v-loading="item.isLoading">
+                  <div class="table-name">
+                    <span class="goods-name">{{item.name}}</span>
+                  </div>
+                  <div class="table-content">
+                    <table class="goods-table">
+                      <thead>
+                        <th class="description-box">{{lang.settlement_goodsInfo}}</th>
+                        <th class="price-box">{{lang.settlement_goodsPrice}}</th>
+                        <th class="num-box">{{lang.settlement_goodsNums}}</th>
+                        <th class="total-box">{{lang.settlement_goodsTotalPrice}}</th>
+                      </thead>
+                      <tbody>
+                        <tr>
+                          <td>
+                            <div class="info-box" v-if="item.info">
+                              <div class="goods-info" v-if="false">
+                                <span class="goodsInfo-type">
+                                  <span class="goodsInfo-name">{{item.name}}</span>
+                                  <span class="goodsInfo-val"></span>
+                                </span>
+                                <span
+                                  class="goodsInfo-price">{{commonData.currency_prefix}}{{item.info.base_price}}</span>
+                              </div>
+                              <div v-for="(infoItem,value,index) in item.preview" :key="index" class="goods-info">
+                                <span class="goodsInfo-type">
+                                  <span class="goodsInfo-name">{{infoItem.name}}</span>
+                                  <span class="goodsInfo-val">：{{infoItem.value}}</span>
+                                </span>
+                                <span class="goodsInfo-price">{{commonData.currency_prefix}}{{infoItem.price}}</span>
+                              </div>
+                            </div>
+                            <div v-else></div>
+                          </td>
+                          <td class="item-price">
+                            <template v-if="item.info?.host_billing_cycle === 'on_demand'">
+                              {{commonData.currency_prefix}}<span
+                                class="price">{{(item.info.base_price * 1).toFixed(2)}}</span>&nbsp;<span
+                                class="default-color">{{lang.demand_text1}}</span><br>
+                              {{commonData.currency_prefix}}<span
+                                class="price">{{(item.info.base_renew_price * 1).toFixed(4)}}</span>&nbsp;<span
+                                class="default-color">/{{lang.demand_text2}}</span><br>
+                              <template v-if="item.info.base_on_demand_flow_price * 1">
+                                {{commonData.currency_prefix}}<span
+                                  class="price">{{(item.info.base_on_demand_flow_price * 1).toFixed(4)}}</span>&nbsp;<span
+                                  class="default-color">/GB</span>
+                              </template>
+                            </template>
+                            <template v-else>
+                              {{commonData.currency_prefix}}{{Number(item.price * 1 / item.qty).toFixed(2)}}
+                              <span v-if="item.info && item.info.billing_cycle">/
+                                {{item.info.customfield?.multi_language?.billing_cycle || item.info.billing_cycle}}</span>
+                            </template>
+                          </td>
+                          <td>
+                            {{item.qty}}
+                          </td>
+                          <td class="item-total">
+                            <span>{{commonData.currency_prefix}} {{item.calcItemPrice | filterMoney}}</span>
+                            <el-popover placement="top-start" width="200" trigger="hover"
+                              v-if="item.price != item.calcItemPrice">
+                              <div class="show-config-list">
+                                <p v-if="item.level_discount">
+                                  {{lang.shoppingCar_tip_text2}}：{{commonData.currency_prefix}} {{
+                                  item.level_discount | filterMoney }}
+                                </p>
+                                <p v-if="item.code_discount">
+                                  {{lang.shoppingCar_tip_text4}}：{{commonData.currency_prefix}} {{ item.code_discount |
+                                  filterMoney }}
+                                </p>
+                                <p v-if="item.eventDiscount">{{lang.goods_text4}}：{{commonData.currency_prefix}} {{
+                                  item.eventDiscount | filterMoney }}</p>
+                              </div>
+                              <i class="el-icon-warning-outline total-icon" slot="reference"></i>
+                            </el-popover>
+                            <event-code v-if="item.info && item.info.duration !=='' && item.eventDiscount"
+                              :id="item.customfield.event_promotion" :product_id="item.product_id" :qty="item.qty"
+                              :amount="item.price" :billing_cycle_time="item.info.duration" disabled>
+                            </event-code>
+                            <p class="original-price" v-if="item.price != item.calcItemPrice">
+                              {{commonData.currency_prefix}} {{item.price | filterMoney}}
+                            </p>
+                            <div v-show="item.customfield.promo_code" class="discount-codeNumber">
+                              {{ item.customfield.promo_code }}
+                            </div>
+                          </td>
+                        </tr>
+                      </tbody>
+                    </table>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </el-main>
+        <el-footer v-if="!isNaN(Number(totalPrice).toFixed(2))" style="min-height: 1.6rem; height:auto;">
+          <div class="footer-box">
+            <div class="footer-left" v-if="false">
+              <span class="pay-text">{{lang.settlement_tip1}}</span>
+              <el-radio-group v-model="payType" class="radio-box" v-if="payTypeList.length!==0">
+                <el-radio :label="item.name" v-for="item in payTypeList" :key="item.id">{{item.title}}</el-radio>
+              </el-radio-group>
+            </div>
+            <div class="footer-right">
+              <div class="totalprice-box" v-loading="totalPriceLoading">
+                <div>
+                  {{lang.settlement_tip2}}：
+                  <span class="total-price">{{commonData.currency_prefix}}{{finallyPrice | filterMoney}}</span>
+                  <el-popover placement="top-start" width="200" trigger="hover"
+                    v-if="orginPrice*1 != totalPrice*1 || finallyPrice*1 != totalPrice*1">
+                    <div class="show-config-list">
+                      <p v-if="totalLevelDiscount * 1 > 0">{{lang.shoppingCar_tip_text2}}：{{commonData.currency_prefix}}
+                        {{
+                        totalLevelDiscount | filterMoney }}
+                      </p>
+                      <p v-if="totalCodelDiscount * 1 > 0">
+                        {{lang.shoppingCar_tip_text4}}：{{commonData.currency_prefix}} {{ totalCodelDiscount |
+                        filterMoney }}
+                      </p>
+                      <p v-if="totalFullDiscount * 1 > 0">{{lang.goods_text4}}：{{commonData.currency_prefix}}
+                        {{ totalFullDiscount | filterMoney }}
+                      </p>
+                    </div>
+                    <i class="el-icon-warning-outline total-icon" slot="reference"></i>
+                  </el-popover>
+
+                </div>
+
+              </div>
+              <div class="btn-box" v-if="showPayBtn">
+                <el-button type="primary" class="buy-btn" @click="goPay"
+                  :loading="subBtnLoading">{{lang.settlement_tip3}}</el-button>
+                <div class="check-box">
+                  <el-checkbox v-model="checked"></el-checkbox>
+                  {{lang.settlement_tip4}}
+                  <span class="bule-text" @click="goHelpUrl('terms_service_url')">{{lang.read_service}}</span>
+                  {{lang.settlement_tip6}}
+                  <span class="bule-text" @click="goHelpUrl('terms_privacy_url')">{{lang.read_privacy}}</span>
+                </div>
+              </div>
+            </div>
+          </div>
+        </el-footer>
+        <!-- 支付弹窗 -->
+        <pay-dialog ref="payDialog" @payok="paySuccess" @paycancel="payCancel"></pay-dialog>
+      </el-container>
+    </el-container>
+  </div>
+  <!-- =======页面独有======= -->
+  <script src="/{$template_catalog_cart}/template/{$themes_cart}/api/shopping.js"></script>
+  <script src="/{$template_catalog}/template/{$themes}/components/payDialog/payDialog.js"></script>
+  <script src="/{$template_catalog}/template/{$themes}/components/eventCode/eventCode.js"></script>
+  <script src="/{$template_catalog_cart}/template/{$themes_cart}/js/settlement.js"></script>
diff --git a/clientarea/cart/hgcart/shoppingCar.php b/clientarea/cart/hgcart/shoppingCar.php
new file mode 100644
index 0000000..8f64dc8
--- /dev/null
+++ b/clientarea/cart/hgcart/shoppingCar.php
@@ -0,0 +1,187 @@
+<!-- 页面独有样式 -->
+<link rel="stylesheet" href="/{$template_catalog_cart}/template/{$themes_cart}/css/shoppingCar.css">
+</head>
+
+<body>
+  <!-- mounted之前显示 -->
+  <div id="mainLoading">
+    <div class="ddr ddr1"></div>
+    <div class="ddr ddr2"></div>
+    <div class="ddr ddr3"></div>
+    <div class="ddr ddr4"></div>
+    <div class="ddr ddr5"></div>
+  </div>
+  <div class="template">
+    <el-container>
+      <aside-menu></aside-menu>
+      <el-container>
+        <top-menu ref="topMenu"></top-menu>
+        <el-main>
+          <!-- 自己的东西 -->
+          <div class="main-card">
+            <div class="main-title">{{lang.shoppingCar_title}}</div>
+            <div class="search-box">
+              <el-input :placeholder="lang.shoppingCar_tip_text" suffix-icon="el-icon-search" @change="searchValChange"
+                v-model="searchVal">
+              </el-input>
+            </div>
+            <div class="goods-box" v-loading="listLoding">
+              <div class="goods-item" v-if="showList.length !== 0 || listLoding">
+                <el-checkbox-group v-model="checkedCities" @change="handleCheckedCitiesChange">
+                  <div v-for="item in nowList" :key="item.position" class="shopping-goods" v-loading="item.isLoading">
+                    <div class="table-name">
+                      <el-checkbox :label="item.position" v-if="item.info">
+                        <span class="goods-name">{{item.name}}</span>
+                      </el-checkbox>
+                      <span class="goods-name mar-left-24" v-else>{{item.name}}</span>
+                      <el-link type="primary" class="edit-goods" v-if="item.info"
+                        @click="goGoods(item)">{{lang.shoppingCar_editGoods}}</el-link>
+                    </div>
+                    <div class="table-content">
+                      <table class="goods-table">
+                        <thead>
+                          <th class="description-box">{{lang.shoppingCar_goodsInfo}}</th>
+                          <th class="price-box">{{lang.shoppingCar_goodsPrice}}</th>
+                          <th class="num-box">{{lang.shoppingCar_goodsNums}}</th>
+                          <th class="total-box">{{lang.shoppingCar_goodsTotalPrice}}</th>
+                          <th class="action-box">{{lang.shoppingCar_goodsAction}}</th>
+                        </thead>
+                        <tbody>
+                          <tr v-if="item.info">
+                            <td>
+                              <div class="info-box">
+                                <div class="goods-info" v-if="false">
+                                  <span class="goodsInfo-type">
+                                    <span class="goodsInfo-name">{{item.name}}</span>
+                                    <span class="goodsInfo-val"></span>
+                                  </span>
+                                  <span
+                                    class="goodsInfo-price">{{commonData.currency_prefix}}{{item.info.base_price}}</span>
+                                </div>
+                                <div v-for="(infoItem,value,index) in item.preview" :key="index" class="goods-info">
+                                  <span class="goodsInfo-type">
+                                    <span class="goodsInfo-name">{{infoItem.name}}</span>
+                                    <span class="goodsInfo-val">：{{infoItem.value}}</span>
+                                  </span>
+                                  <span class="goodsInfo-price">{{commonData.currency_prefix}}{{infoItem.price}}</span>
+                                </div>
+                              </div>
+                            </td>
+                            <td class="item-price">
+                              <template v-if="item.info.host_billing_cycle === 'on_demand'">
+                                {{commonData.currency_prefix}}<span class="price">{{(item.info.base_price * 1).toFixed(2)}}</span>&nbsp;<span class="default-color">{{lang.demand_text1}}</span><br>
+                                {{commonData.currency_prefix}}<span class="price">{{(item.info.base_renew_price * 1).toFixed(4)}}</span>&nbsp;<span class="default-color">/{{lang.demand_text2}}</span><br>
+                                <template v-if="item.info.base_on_demand_flow_price * 1">
+                                  {{commonData.currency_prefix}}<span class="price">{{(item.info.base_on_demand_flow_price * 1).toFixed(4)}}</span>&nbsp;<span class="default-color">/GB</span>
+                                </template>
+                              </template>
+                              <template v-else>
+                                {{commonData.currency_prefix}}{{Number(item.price * 1 / item.qty).toFixed(2)}}
+                                <span v-if="item.info.billing_cycle">/ {{ item.info.customfield?.multi_language?.billing_cycle || item.info.billing_cycle}}</span>
+                              </template>
+                            </td>
+                            <td>
+                              <el-input-number v-model="item.qty" size="small"
+                                @change="(currentValue,oldValue)=>handleChange(currentValue,oldValue,item)" :min="1"
+                                :max="item.stock_control === 1 ? item.stock_qty : 99999"></el-input-number>
+                              <p v-if="item.stock_control === 1" :class="item.stock_qty === 0 ? 'red-text':''"
+                                class="qty-num">{{lang.shoppingCar_goods_tock_qty}}：{{ item.stock_qty }}</p>
+                              <p v-if="item.isShowTips" class="qty-tips">{{lang.shoppingCar_tock_qty_tip}}</p>
+                            </td>
+                            <td class="item-total" v-loading="item.priceLoading">
+                              <span>{{commonData.currency_prefix}} {{item.calcItemPrice | filterMoney}}</span>
+                              <el-popover placement="top-start" width="200" trigger="hover"
+                                v-if="item.calcItemPrice != item.price">
+                                <div class="show-config-list">
+                                  <p v-if="item.level_discount">
+                                    {{lang.shoppingCar_tip_text2}}：{{commonData.currency_prefix}} {{
+                                    item.level_discount  | filterMoney }}
+                                  </p>
+                                  <p v-if="item.code_discount">
+                                    {{lang.shoppingCar_tip_text4}}：{{commonData.currency_prefix}} {{ item.code_discount
+                                    | filterMoney }}
+                                  </p>
+                                  <p v-if="item.eventDiscount">{{lang.goods_text4}}：{{commonData.currency_prefix}} {{
+                                    item.eventDiscount | filterMoney }}</p>
+                                </div>
+                                <i class="el-icon-warning-outline total-icon" slot="reference"></i>
+                              </el-popover>
+                              <p class="original-price" v-if="item.calcItemPrice != item.price">
+                                {{commonData.currency_prefix}} {{item.price | filterMoney}}
+                              </p>
+                              <div class="discount-box">
+                                <discount-code v-if="item.customfield && !item.customfield.promo_code && isShowPromo"
+                                  @get-discount="getDiscount(arguments)" scene='new' :product_id='item.product_id'
+                                  :qty="item.qty" :amount="item.price" :billing_cycle_time="item.info.duration"
+                                  :shopping_index="item.position">
+                                </discount-code>
+                                <div v-if="item.customfield && item.customfield.promo_code" class="discount-codeNumber">
+                                  {{ item.customfield.promo_code }}
+                                  <i class="el-icon-circle-close remove-discountCode"
+                                    @click="removeDiscountCode(item)"></i>
+                                </div>
+                                <event-code v-if="item.info && item.info.duration !=='' && isShowFull"
+                                  :id="item.customfield.event_promotion" :product_id='item.product_id' :qty="item.qty"
+                                  :amount="item.price" :billing_cycle_time="item.info.duration"
+                                  @change="(price) => changeEventCode(price,item)">
+                                </event-code>
+                              </div>
+
+                            </td>
+                            <td class="delete-btn">
+                              <i class="el-icon-delete" @click="handelDeleteGoods(item)"></i>
+                            </td>
+                          </tr>
+                          <tr v-else>
+                            <td></td>
+                            <td class="no-goods-td">
+                              <span class="no-goods-tips">{{lang.shoppingCar_no_goods_tip}}</span>
+                              <el-button class="buy-again-btn"
+                                @click="goGoods(item)">{{lang.shoppingCar_buy_again}}</el-button>
+                            </td>
+                            <td></td>
+                            <td></td>
+                            <td class="delete-btn">
+                              <i class="el-icon-delete" @click="handelDeleteGoods(item)"></i>
+                            </td>
+                          </tr>
+                        </tbody>
+                      </table>
+                    </div>
+                  </div>
+                </el-checkbox-group>
+              </div>
+              <div v-else>
+                <el-empty :description="lang.shoppingCar_no_goods_text"></el-empty>
+              </div>
+            </div>
+          </div>
+        </el-main>
+        <el-footer>
+          <div class="footer-box">
+            <div class="footer-left">
+              <el-checkbox class="all-check" v-model="checkAll"
+                @change="handleCheckAllChange">{{lang.shoppingCar_select_all}}</el-checkbox>
+              <span class="delect-btn">
+                <el-link type="danger" class="delect-goods"
+                  @click="deleteCheckGoods">{{lang.shoppingCar_delete_select}}</el-link>
+              </span>
+              <span>{{lang.shoppingCar_selected}}<span
+                  class="text-red">{{checkedCities.length}}</span>{{lang.shoppingCar_goods_text}}</span>
+            </div>
+            <div class="footer-right">
+              <p>{{lang.shoppingCar_tip_text3}}：<span
+                  class="total-price">{{commonData.currency_prefix}}{{totalPrice | filterMoney}}</span></p>
+              <el-button type="primary" class="buy-btn" @click="goSettle"
+                :loading="settleLoading">{{lang.shoppingCar_buy_text}}</el-button>
+            </div>
+          </div>
+        </el-footer>
+      </el-container>
+    </el-container>
+  </div>
+  <!-- =======页面独有======= -->
+  <script src="/{$template_catalog_cart}/template/{$themes_cart}/api/shopping.js"></script>
+  <script src="/{$template_catalog}/template/{$themes}/components/discountCode/discountCode.js"></script>
+  <script src="/{$template_catalog}/template/{$themes}/components/eventCode/eventCode.js"></script>
+  <script src="/{$template_catalog_cart}/template/{$themes_cart}/js/shoppingCar.js"></script>
diff --git a/clientarea/cart/hgcart/theme.jpg b/clientarea/cart/hgcart/theme.jpg
new file mode 100644
index 0000000..37ef1ae
Binary files /dev/null and b/clientarea/cart/hgcart/theme.jpg differ