123

dcc

2024-06-28 25b2ba1cf86bc3439e7ad2acf2cd4a9ea7e4b0ed

 src/page/orderList/items.vue

@@ -2,32 +2,54 @@
  <div class="item-main" @click="gotoPage">
    <div class="flex justify-between items-center buy">
      <span class="us-buy">
        <span v-if="items.direction === 'buy'" style="color: #5eba89">{{ $t('购买') }}</span>
        <span v-else style="color: #e35461">{{ $t('出售') }}</span>
        <span v-if="items.direction === 'buy'" style="color: #5eba89">{{
          $t("购买")
        }}</span>
        <span v-else style="color: #e35461">{{ $t("出售") }}</span>
        {{ items.symbol }}
      </span>
      <span v-if="items.direction === 'buy'">
        <span
          :class="{ 'blue': items.state === '0', 'yellow': items.state === '1', 'red': items.state === '2' || items.state === '5', 'green': items.state === '3' }">{{
            arr[items.state / 1] }}</span>
          :class="{
            blue: items.state === '0',
            yellow: items.state === '1',
            red: items.state === '2' || items.state === '5',
            green: items.state === '3',
          }"
          >{{ arr[items.state / 1] }}</span
        >
        <van-icon name="arrow" />
      </span>
      <span v-else>
        <span
          :class="{ 'blue': items.state === '0', 'yellow': items.state === '1', 'red': items.state === '2' || items.state === '5', 'green': items.state === '3' }">{{
            arr1[items.state / 1] }}</span>
          :class="{
            blue: items.state === '0',
            yellow: items.state === '1',
            red: items.state === '2' || items.state === '5',
            green: items.state === '3',
          }"
          >{{ arr1[items.state / 1] }}</span
        >
        <van-icon name="arrow" />
      </span>
    </div>
    <div class="flex justify-between items-center price-i">
      <span>{{ $t('单价') }} {{ items.currency || currency.currency_symbol }} {{ items.symbol_value }}</span>
      <span
        >{{ $t("单价") }} {{ items.currency || currency.currency_symbol }}
        {{ items.symbol_value }}</span
      >
      <span style="color: #b8bcc5">{{ items.time }}</span>
    </div>
    <div class="flex justify-between items-center price-i pd-32">
      <span>{{ $t('数量') }} {{ (items.coin_amount / 1).toFixed(items.symbol === 'USDT' ? 2 : 4) }} {{ items.symbol
      }}</span>
      <span class="textColor" style="font-weight: bold">{{ items.currency }}
        {{ (items.symbol_value * items.coin_amount / 1).toFixed(2) }}</span>
      <span
        >{{ $t("数量") }}
        {{ (items.coin_amount / 1).toFixed(items.symbol === "USDT" ? 2 : 4) }}
        {{ items.symbol }}</span
      >
      <span class="textColor" style="font-weight: bold"
        >{{ items.currency }}
        {{ ((items.symbol_value * items.coin_amount) / 1).toFixed(2) }}</span
      >
    </div>
    <div class="niu flex items-center">
      <van-badge v-if="items.msg" :content="items.msg">
@@ -43,50 +65,71 @@

<script>
import { mapState } from "vuex";
import { Icon, Badge } from 'vant'
import { Icon, Badge } from "vant";

export default {
  props: ['items'],
  props: ["items"],
  data() {
    return {
      arr: [this.$t('未付款'), this.$t('已付款'), this.$t('申诉中'), this.$t('已完成'), this.$t('已取消'), this.$t('已超时')],
      arr1: [this.$t('等待付款'), this.$t('待确认'), this.$t('申诉中'), this.$t('已完成'), this.$t('已取消'), this.$t('已超时')],
    }
      arr: [
        this.$t("未付款"),
        this.$t("已付款"),
        this.$t("申诉中"),
        this.$t("已完成"),
        this.$t("已取消"),
        this.$t("已超时"),
      ],
      arr1: [
        this.$t("等待付款"),
        this.$t("待确认"),
        this.$t("申诉中"),
        this.$t("已完成"),
        this.$t("已取消"),
        this.$t("已超时"),
      ],
    };
  },
  computed: {
    ...mapState('home', ['currency'])
    ...mapState("home", ["currency"]),
  },
  methods: {
    gotoPage() { // 去到相应的页面
    gotoPage() {
      // 去到相应的页面
      // console.log(this.items)
      // this.$store.commit('c2c/SET_ADV_ID',this.items.id)
      this.$store.commit('c2c/SET_ORDER_NO', this.items.order_no)
      this.$store.commit("c2c/SET_ORDER_NO", this.items.order_no);
      // return
      if (this.items.direction === 'buy') {
        if (this.items.state / 1 === 0 || this.items.state / 1 === 5) { // 未付款
          this.$router.push(`/orderGeneration`)
        } else if (this.items.state / 1 === 1) { // 已付款
          this.$router.push('/paymentDetail')
        } else { /// 111  其他
          this.$router.push('/tradeOrderDetail')
      if (this.items.direction === "buy") {
        if (this.items.state / 1 === 0 || this.items.state / 1 === 5) {
          // 未付款
          this.$router.push(`/orderGeneration`);
        } else if (this.items.state / 1 === 1) {
          // 已付款
          this.$router.push("/paymentDetail");
        } else {
          /// 111  其他
          this.$router.push("/tradeOrderDetail");
        }
      } else {
        if (this.items.state / 1 === 0 || this.items.state / 1 === 5) { // 未付款
          this.$router.push(`/sellGenerate`)
        } else if (this.items.state / 1 === 1) { // 已付款
          this.$router.push(`/confirmedPaid`)
        if (this.items.state / 1 === 0 || this.items.state / 1 === 5) {
          // 未付款
          this.$router.push(`/sellGenerate`);
        } else if (this.items.state / 1 === 1) {
          // 已付款
          this.$router.push(`/confirmedPaid`);
          // this.$router.push('/paymentDetail?order_no=' + this.items.order_no)
        } else { /// 111  其他
          this.$router.push('/tradeOrderDetail')
        } else {
          /// 111  其他
          this.$router.push("/tradeOrderDetail");
        }
      }
    }
    },
  },
  components: {
    [Icon.name]: Icon,
    [Badge.name]: Badge,
  },
}
};
</script>

<style lang="scss" scoped>
@@ -145,18 +188,18 @@
}

.blue {
  color: #1D91FF;
  color: #1d91ff;
}

.green {
  color: #2EBD85;
  color: #2ebd85;
}

.red {
  color: #E35461
  color: #e35461;
}

.yellow {
  color: #E2AE27;
  color: #e2ae27;
}
</style>