fix: sku问题修改 (#2057)

* fix: 4.0测试期间发现的问题3.0同步修改

* feat: sku组件问题修改

src/packages/__VUE/sku/components/SkuHeader.vue

@@ -1,8 +1,6 @@
 <template>
   <view class="nut-sku-header">
-    <!-- <img :src="goods.imagePath" /> -->
-    <image class="nut-sku-header-img" :src="goods.imagePath" v-if="ENV != ENV_TYPE.WEB" />
-    <img class="nut-sku-header-img" :src="goods.imagePath" v-else />
+    <img :src="goods.imagePath" />
 
     <view class="nut-sku-header-right">
       <template v-if="getSlots('sku-header-price')">
@@ -23,7 +21,6 @@
 import { reactive, toRefs, onMounted } from 'vue';
 import { createComponent } from '@/packages/utils/create';
 const { componentName, create, translate } = createComponent('sku-header');
-import Taro from '@tarojs/taro';
 
 export default create({
   props: {
@@ -37,15 +34,9 @@ export default create({
   setup(props: any, { emit, slots }) {
     const getSlots = (name: string) => slots[name];
 
-    const state = reactive({
-      ENV: Taro.getEnv(),
-      ENV_TYPE: Taro.ENV_TYPE
-    });
-
     return {
       getSlots,
-      translate,
-      ...toRefs(state)
+      translate
     };
   }
 });

src/packages/__VUE/sku/components/SkuHeaderTaro.vue

@@ -0,0 +1,52 @@
+<template>
+  <view class="nut-sku-header">
+    <!-- <img :src="goods.imagePath" /> -->
+    <image class="nut-sku-header-img" :src="goods.imagePath" v-if="ENV != ENV_TYPE.WEB" />
+    <img class="nut-sku-header-img" :src="goods.imagePath" v-else />
+
+    <view class="nut-sku-header-right">
+      <template v-if="getSlots('sku-header-price')">
+        <slot name="sku-header-price"></slot>
+      </template>
+      <nut-price v-else :price="goods.price" :needSymbol="true" :thousands="false"> </nut-price>
+
+      <template v-if="getSlots('sku-header-extra')">
+        <slot name="sku-header-extra"></slot>
+      </template>
+      <view class="nut-sku-header-right-extra" v-if="goods.skuId && !getSlots('sku-header-extra')"
+        >{{ translate('skuId') }}&nbsp;:&nbsp;{{ goods.skuId }}</view
+      >
+    </view>
+  </view>
+</template>
+<script lang="ts">
+import { reactive, toRefs, onMounted } from 'vue';
+import { createComponent } from '@/packages/utils/create';
+const { componentName, create, translate } = createComponent('sku-header');
+import Taro from '@tarojs/taro';
+
+export default create({
+  props: {
+    goods: {
+      type: Object,
+      default: {}
+    }
+  },
+  emits: [],
+
+  setup(props: any, { emit, slots }) {
+    const getSlots = (name: string) => slots[name];
+
+    const state = reactive({
+      ENV: Taro.getEnv(),
+      ENV_TYPE: Taro.ENV_TYPE
+    });
+
+    return {
+      getSlots,
+      translate,
+      ...toRefs(state)
+    };
+  }
+});
+</script>

src/packages/__VUE/sku/index.taro.vue

@@ -63,7 +63,7 @@
 </template>
 <script lang="ts">
 import { ref, watch, onMounted } from 'vue';
-import SkuHeader from './components/SkuHeader.vue';
+import SkuHeader from './components/SkuHeaderTaro.vue';
 import SkuSelect from './components/SkuSelect.vue';
 import SkuStepper from './components/SkuStepper.vue';
 import SkuOperate from './components/SkuOperate.vue';