Comment utiliser PHP et Vue pour développer et mettre à jour la valeur des points d'adhésion en fonction du type de produit après paiement

Comment utiliser PHP et Vue pour développer et mettre à jour la valeur des points des membres en fonction du type de produit après le paiement

Avec la popularité du paiement mobile, de plus en plus de commerçants commencent à utiliser la technologie Internet pour transformer les transactions hors ligne en paiements en ligne. Dans ce processus, les commerçants espèrent souvent mettre à jour la valeur des points du membre en fonction du type de biens achetés par l'utilisateur. Cet article expliquera comment utiliser les technologies PHP et Vue pour implémenter cette fonction et donnera des exemples de code spécifiques.

1. Développement back-end (PHP)

1. Créer une table de base de données

Tout d'abord, nous devons créer une table de base de données pour stocker les informations sur les membres, y compris l'identifiant du membre, le nom du membre, les points des membres, les articles achetés par les membres et d'autres champs. . Créez la structure de tableau suivante :

CREATE TABLE `members` (
   `id` INT PRIMARY KEY AUTO_INCREMENT,
   `name` VARCHAR(50) NOT NULL,
   `points` INT DEFAULT 0,
   `purchased_product` VARCHAR(50) NOT NULL
);

2. Écrivez le code PHP pour mettre à jour les points des membres

Dans le code PHP, lorsque l'utilisateur paie avec succès, nous devons mettre à jour la valeur des points du membre correspondant en fonction du type de produit acheté. Écrivez le code PHP suivant :

<?php
  $productId = $_POST['product_id']; // 获取商品ID
  $memberId = $_POST['member_id']; // 获取会员ID

  // 根据商品ID查询对应的积分增加值
  $points = getPointsByProductId($productId);

  // 更新会员积分
  updateMemberPoints($memberId, $points);

  // 返回更新结果
  echo json_encode(['status' => 'success', 'message' => '积分更新成功']);

  // 根据商品ID查询积分增加值的函数
  function getPointsByProductId($productId) {
    // 根据产品ID查询对应的积分增加值
    // 这里可以根据具体业务逻辑自行实现查询逻辑
    $points = 0;
    switch ($productId) {
      case 1:
        $points = 10;
        break;
      case 2:
        $points = 20;
        break;
      case 3:
        $points = 30;
        break;
      default:
        $points = 0;
        break;
    }
    return $points;
  }

  // 更新会员积分的函数
  function updateMemberPoints($memberId, $points) {
    // 根据会员ID更新会员的积分
    // 这里可以根据具体业务逻辑自行实现更新逻辑
  }
?>

Dans le code ci-dessus, nous obtenons l'ID de produit et l'ID de membre transmis par l'utilisateur après un paiement réussi, interrogeons la valeur d'augmentation de points correspondante en fonction de l'ID de produit, puis mettons à jour les points du membre.

2. Développement front-end (Vue)

1. Créer un projet Vue

Tout d'abord, nous devons créer un projet Vue, qui peut être rapidement créé à l'aide de Vue CLI. Exécutez la commande suivante dans le terminal :

$ vue create member-points

2. Ecrire le composant Vue

Dans le projet Vue, nous devons créer un composant pour implémenter la fonction de mise à jour des points des membres après le paiement. Créez le composant MemberPoints.vue dans le répertoire src/components et écrivez le code suivant :

<template>
  <div>
    <h2>支付成功，更新会员积分</h2>
    <form @submit.prevent="updatePoints">
      <label>商品ID:</label>
      <input type="number" v-model="productId">
      <label>会员ID:</label>
      <input type="number" v-model="memberId">
      <button type="submit">更新积分</button>
    </form>
  </div>
</template>

<script>
export default {
  data() {
    return {
      productId: '',
      memberId: ''
    }
  },
  methods: {
    updatePoints() {
      // 发送请求到后端更新会员积分
      fetch('/update_points.php', {
        method: 'POST',
        body: JSON.stringify({
          product_id: this.productId,
          member_id: this.memberId
        })
      })
      .then(response => response.json())
      .then(data => {
        console.log(data);
        // 更新成功后的处理逻辑
      })
      .catch(error => {
        console.error(error);
        // 更新失败后的处理逻辑
      });
    }
  }
}
</script>

Dans le code ci-dessus, nous avons créé un formulaire pour saisir l'ID du produit et l'ID du membre, et avons envoyé une requête POST au backend update_points.php via le fichier de fonction fetch pour mettre à jour les points d'adhésion.

3. Utilisation du composant MemberPoints dans App.vue

Dans le fichier src/App.vue, nous pouvons utiliser le composant MemberPoints pour afficher la fonction de mise à jour des points membres après paiement. Modifiez le fichier App.vue comme suit :

<template>
  <div>
    <h1>支付后会员积分更新</h1>
    <MemberPoints></MemberPoints>
  </div>
</template>

<script>
import MemberPoints from './components/MemberPoints.vue'

export default {
  components: {
    MemberPoints
  }
}
</script>

À ce stade, nous avons terminé d'utiliser PHP et Vue pour développer la fonction de mise à jour de la valeur des points des membres en fonction du type de produit après paiement.

Résumé :

En utilisant les technologies PHP et Vue, cet article présente comment implémenter la fonction de mise à jour de la valeur des points des membres en fonction du type de produit après paiement. Le code PHP back-end est utilisé pour traiter la logique de mise à jour des points membres, et le code Vue front-end est utilisé pour afficher et déclencher l'opération de mise à jour des points membres. J'espère que cet article sera utile à tout le monde.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!