<template>
  <view class="status_bar"></view>
  <view>
    <shopping-search
      class="shopping-cel"
      :isFilter="isFilter"
      @serachShopping="serachShopping"
      @clearInpu="clearInpu"
      @createGoods="createGoods"
    />
  </view>

  <view class="main-center-root">
    <view class="left-bar-root">
      <scroll-view
        scroll-y
        :style="{ height: `calc(100vh - 92rpx - ${statusBarHeight})` }"
      >
        <left-bar
          ref="leftBarRef"
          :dafauleData="dafauleData"
          @oneMenuClick="oneMenuClick"
        />
      </scroll-view>
    </view>
    <view class="right-center">
      <shopping-filter
        @updateIsSale="updateIsSale"
        @updateTowFilter="updateTowFilter"
        :isCheckoutFilter="isCheckoutFilter"
        :updateStateOk="updateStateOk"
      />

      <scroll-view
        scroll-y
        :style="{ height: `calc(100vh - 182rpx - ${statusBarHeight})` }"
        refresher-enabled
        :refresher-triggered="triggered"
        @scrolltolower="scrolltolower"
        @refresherrefresh="refresherrefresh"
      >
        <right-main
          v-for="item in skuNames"
          :key="item.id"
          :skuName="item"
          :isAudit="isAudit"
          :isHot="isHot"
          :showMountTab="showMountTab"
          @handleSale="handleSale"
          @openPriceDialog="openPriceDialog"
          @openDialog="openDialog"
          @toExamine="toExamine"
        />
        <jx-load-more
          v-show="totalCount >= 4"
          :isLoad="isLoad"
          tip="没有更多商品了"
        />
        <jx-empty
          class="jx-empty"
          v-show="totalCount == 0"
          title="该分类暂无商品"
        >
          <view class="createGoods" @tap="createGoods">去创建商品</view>
        </jx-empty>
      </scroll-view>
    </view>
  </view>

  <view v-if="showMountTab" class="MountWrap">
    <view class="btn onActive" @tap="handleChangeSale(1)">可售</view>
    <view class="btn onActive" @tap="handleChangeSale(-1)">不可售</view>
  </view>

  <!-- 修改价格 -->
  <uni-popup ref="popup" type="top">
    <view class="status_bar"></view>
    <view class="jx-popup-update">
      <text class="text">{{ isPointStore ? '改价' : '提交改价审核' }}</text>
      <view class="tip">
        当前价格每<text style="color: #f60d58">{{
          skuName.unit === '份' ? '斤' : skuName.unit
        }}</text
        >:
        <jx-price :price="skuName.unitPrice" color="#4eb331" />
      </view>
      <view class="tip audit" v-if="auditUnitPrice > 0">
        正在审核：¥<text>{{ auditUnitPrice }}</text>
      </view>
      <input
        class="ipt"
        type="digit"
        v-model="currentValue"
        placeholder="请输入修改价格"
      />

      <view class="btn-root">
        <view class="btn-esc" @tap="popup.close()">取消</view>
        <view class="btn-ok" @tap="handleConfirm">确定修改</view>
      </view>

      <view class="delete">
        <view class="delete-text" @tap="handleDelete"
          >删除《{{ skuName.name }}》</view
        >
      </view>
    </view>
  </uni-popup>

  <!-- 审核商品 -->
  <uni-popup ref="toExaminePopup" type="top">
    <view class="status_bar"></view>
    <view class="jx-popup-update">
      <text class="text">{{
        toExamineData.status == 1 ? '同意申请' : '拒绝申请'
      }}</text>
      <view class="tip audit"
        >商户申请价格：¥{{ toExamineData.auditPrice / 100 }}</view
      >
      <input
        class="ipt"
        type="digit"
        v-model="toExamineValue"
        :placeholder="
          toExamineData.status == 1 ? '请输入审核价格' : '请输入拒绝原因'
        "
      />
      <view class="btn-root">
        <view class="btn-esc" @tap="toExaminePopup.close()">取消</view>
        <view class="btn-ok" @tap="toExamineConfirm">确定</view>
      </view>
    </view>
  </uni-popup>

  
  <!-- 修改库存以及商品 -->
  <uni-popup ref="popupDialog" type="top">
    <view class="jx-popup-update" >
      <view class="text">
        {{ skuNameItem.type === 'stock' ? '修改库存' : '修改货架码' }}
      </view>
      <view class="tip-new">{{ skuNameItem.name }}</view>
      <view class="ipt-box">
        <input
          class="ipt"
          :type="skuNameItem.type === 'stock' ? 'number' : 'text'"
          v-model="stockOrCode"
          :placeholder="
            skuNameItem.type === 'stock' ? '请输入商品库存' : '请输入商品货架码'
          "
        />
      </view>
      <view class="btn-root">
        <view class="btn-esc" @tap="popupDialog.close()">取消</view>
        <view class="btn-ok" @tap="sureStockOrCode">确定</view>
      </view>
    </view>
  </uni-popup>

  <!-- 公共组件 -->
  <jx-loading />
  <jx-login-empty title="马上登录，管理商品" />
</template>

<script lang="ts" setup>
import shoppingSearch from './childPages/shopping-search/shopping-search.vue'
import leftBar from './component/left-bar/left-bar.vue'
import rightMain from './childPages/right-main/right-main.vue'
import shoppingFilter from './childPages/shopping-filter/shopping-filter.vue'
import shoppingMangerFn from './main'
const {
  dafauleData,            // 左侧tablit数据
  totalCount,             // 商品总条数
  skuNames,               // 商品列表数据
  skuNameItem,            // 商品数据2
  isAudit,                // 商品列表判断条件
  isHot,                  // 商品列表判断条件
  showMountTab,           // 批量操作判断
  scrolltolower,          // 页面触底
  isLoad,                 // 加载动画
  updateIsSale,           // 过滤筛选
  updateTowFilter,        // 过滤筛选
  serachShopping,         // 搜索框确定
  clearInpu,              // 清空搜索框
  oneMenuClick,           // 一级菜单点击事件
  isCheckoutFilter,       // 切换过滤选项
  isFilter,               // 判断条件
  handleSale,             // 批量可售与不可售
  handleChangeSale,       // 批量可售与不可售
  updateStateOk,          // 批量操作成功
  createGoods,            // 去创建商品
  isPointStore,           // 判断扣点还是折扣
  skuName,                // 当前修改的价格
  auditUnitPrice,         // 正在审核的价格
  currentValue,           // 当前修改价格
  popup,                  // 弹窗实例
  stockOrCode,            // stock locationCode
  popupDialog,            // 弹窗 stock locationCode
  handleConfirm,          // 确定修改价格
  openPriceDialog,        // 获取修改数据
  openDialog,             // 获取修改数据2
  sureStockOrCode,        // 确认框 stock locationCode
  handleDelete,           // 删除商品
  refresherrefresh,       // 下拉刷新
  triggered,              // 下拉刷新标识
  leftBarRef,             // 右侧导航栏实例
  statusBarHeight,        // 状态栏高度
  toExamine,              // 审核商品
  toExamineData,          // 审核商品数据
  toExaminePopup,         // 改价审核实例
  toExamineConfirm,       // 确定操作审核
  toExamineValue,         // 审核输入内容
} = shoppingMangerFn()
</script>

<style lang="scss">
page {
  background-color: #fff;
}
</style>

<style lang="scss" scoped>
@import './main.scss';

.shopping-cel {
  :deep(.uni-searchbar) {
    padding: 0 !important;
    width: 610rpx !important;
    height: 70rpx;

    .uni-searchbar__box {
      border-radius: 7rpx !important;
      height: auto !important;
    }
  }
}

.main-center-root {
  box-sizing: border-box;
  display: flex;
  justify-content: space-between;

  .left-bar-root {
    width: 200rpx;
    box-shadow: 0rpx 10rpx 10rpx rgb(207, 207, 207);
  }

  .right-center {
    width: calc(100vw - 200rpx);
  }
}
</style>