new_crm_front/src/layout/components/lay-switch/index.vue

<script setup lang="ts">
import { onMounted, ref } from "vue";
import {
  merchantUserInfoDetail,
  merchantUserInfoupdateAllocationStatus
} from "@/api/childAccount";
import { useUserStoreHook } from "@/store/modules/user";
import { ElMessage, ElMessageBox } from "element-plus";

const allocationStatus = ref();
const loading = ref(false);

onMounted(async () => {
  getStatus();
});

const getStatus = () => {
  loading.value = true;
  merchantUserInfoDetail(useUserStoreHook().admUserId)
    .then(res => {
      allocationStatus.value = res.data.receiveStatus;
    })
    .finally(() => {
      loading.value = false;
    });
};

const handleChangeStatus = () => {
  ElMessageBox.confirm("确定要修改接单状态吗？", "提示", {
    confirmButtonText: "确定",
    cancelButtonText: "取消",
    type: "warning"
  })
    .then(async () => {
      loading.value = true;
      let params = {
        allocationStatus: allocationStatus.value,
        ids: [useUserStoreHook().admUserId]
      };
      let res = await merchantUserInfoupdateAllocationStatus(params);
      if (res.code === 0) {
        ElMessage.success("操作成功");
      } else {
        ElMessage.error(res.msg);
        allocationStatus.value = !allocationStatus.value;
      }
      loading.value = false;
    })
    .catch(() => {
      allocationStatus.value = !allocationStatus.value;
    });
};
</script>

<template>
  <el-switch
    v-model="allocationStatus"
    :loading="loading"
    inline-prompt
    active-text="接单中"
    inactive-text="已停止接单"
    @change="handleChangeStatus"
  />
</template>

<style scoped lang="scss"></style>