asan-service/pages/admin/customers/_customer.vue

<template>
  <div>
    <CustomSubHeader>
      <CBreadcrumb class="border-0 mb-0">{{ title }}</CBreadcrumb>
      <CButton size="sm" color="primary" class="mr-auto" @click="$router.go(-1)">برگشت به صفحه قبل</CButton>
    </CustomSubHeader>

    <CRow>
      <!-- verity info -->
      <CCol sm="12">
        <CCard>
          <CCardBody>
            <CRow>
              <CCol>
                <h6>اطلاعات مشتری در سیستم وریتی</h6>
                <el-divider></el-divider>
                <CForm>
                  <CInput
                    :label="user.old_verity_businessCode ? 'شناسه وریتی قبلی مشتری' : 'شناسه وریتی مشتری'"
                    horizontal
                    disabled
                    :value="user.old_verity_businessCode || user.verity_businessCode"
                  />

                  <CInput
                    :label="user.old_verity_businessID ? 'آیدی قبلی وریتی مشتری' : 'آیدی وریتی مشتری'"
                    horizontal
                    disabled
                    :value="user.old_verity_businessID || user.verity_businessID"
                  />

                  <template v-if="user.old_verity_businessID && user.old_verity_businessCode">
                    <CInput label="شناسه وریتی جدید مشتری" horizontal disabled :value="user.verity_businessCode" />

                    <CInput label="آیدی وریتی جدید مشتری" horizontal disabled :value="user.verity_businessID" />
                  </template>
                </CForm>
              </CCol>
              <CCol>
                <h6>تغییر اطلاعات مشتری در سیستم وریتی</h6>
                <el-divider></el-divider>
                <CForm @submit.prevent="updateVerityInfo">
                  <CInput
                    v-model="newVerityInfo.verity_businessCode"
                    label="شناسه وریتی جدید مشتری"
                    :class="validation.verity_businessCode && 'err'"
                    horizontal
                    :description="validation.verity_businessCode && validation.verity_businessCode.msg"
                  />

                  <CInput
                    v-model="newVerityInfo.verity_businessID"
                    label="آیدی وریتی جدید مشتری"
                    :class="validation.verity_businessID && 'err'"
                    horizontal
                    :description="validation.verity_businessID && validation.verity_businessID.msg"
                  />
                  <CButton color="success" type="submit">بروزرسانی</CButton>
                </CForm>
              </CCol>
            </CRow>
          </CCardBody>
        </CCard>
      </CCol>

      <!-- panatech info -->
      <CCol sm="12">
        <CCard>
          <CCardBody>
            <CRow>
              <CCol>
                <h6>اطلاعات مشتری در سیستم پاناتک</h6>
                <el-divider></el-divider>
                <CForm>
                  <CInput
                    :label="user.old_panatech_businessCode ? 'شناسه پاناتک قبلی مشتری' : 'شناسه پاناتک مشتری'"
                    horizontal
                    disabled
                    :value="user.old_panatech_businessCode || user.panatech_businessCode"
                  />

                  <CInput
                    :label="user.old_panatech_businessID ? 'آیدی قبلی پاناتک مشتری' : 'آیدی پاناتک مشتری'"
                    horizontal
                    disabled
                    :value="user.old_panatech_businessID || user.panatech_businessID"
                  />

                  <template v-if="user.old_panatech_businessID && user.old_panatech_businessCode">
                    <CInput label="شناسه پاناتک جدید مشتری" horizontal disabled :value="user.panatech_businessCode" />

                    <CInput label="آیدی پاناتک جدید مشتری" horizontal disabled :value="user.panatech_businessID" />
                  </template>
                </CForm>
              </CCol>
              <CCol>
                <h6>تغییر اطلاعات مشتری در سیستم پاناتک</h6>
                <el-divider></el-divider>
                <CForm @submit.prevent="updatePanatechInfo">
                  <CInput
                    v-model="newPanatechInfo.panatech_businessCode"
                    label="شناسه پاناتک جدید مشتری"
                    :class="validation.panatech_businessCode && 'err'"
                    horizontal
                    :description="validation.panatech_businessCode && validation.panatech_businessCode.msg"
                  />

                  <CInput
                    v-model="newPanatechInfo.panatech_businessID"
                    label="آیدی پاناتک جدید مشتری"
                    :class="validation.panatech_businessID && 'err'"
                    horizontal
                    :description="validation.panatech_businessID && validation.panatech_businessID.msg"
                  />
                  <CButton color="success" type="submit">بروزرسانی</CButton>
                </CForm>
              </CCol>
            </CRow>
          </CCardBody>
        </CCard>
      </CCol>

      <CCol lg="6">
        <CCard>
          <CCardBody>
            <h6>اطلاعات مشتری:</h6>
            <el-divider></el-divider>
            <CForm>
              <CInput label="نام مشتری" horizontal disabled :value="user.first_name + ' ' + user.last_name" />
              <CInput label="کد ملی" horizontal disabled :value="user.national_code" />
              <CInput label="شماره تلفن" horizontal disabled :value="user.tel_number" />
              <CInput label="شماره موبایل" horizontal disabled :value="user.mobile_number" />
              <CInput label="ایمیل" horizontal disabled :value="user.email" />
              <CInput label="نام فروشگاه" horizontal disabled :value="user.store_name" />
            </CForm>
          </CCardBody>
        </CCard>
      </CCol>

      <CCol lg="6">
        <CCard>
          <CCardBody>
            <h6>آدرس مشتری</h6>
            <el-divider></el-divider>
            <CForm>
              <CInput label="استان" horizontal disabled :value="user.province_name" />
              <CInput label="شهر" horizontal disabled :value="user.city_name" />
              <CTextarea label="آدرس" horizontal disabled rows="5" :value="user.address" />
              <CInput label="کد پستی" horizontal disabled :value="user.postal_code" />
            </CForm>
          </CCardBody>
        </CCard>
      </CCol>
    </CRow>
  </div>
</template>

<script>
export default {
  name: 'AdminCustomerDatailsPage',
  layout: 'admin',
  async asyncData({ $axios, params, error }) {
    try {
      const user = await $axios.get(`/api/admin/user/${params.customer}`)
      return {
        user: user.data
      }
    } catch (e) {
      error({ status: 404, message: 'Page not found' })
    }
  },
  data() {
    return {
      title: 'مشاهده پروفایل مشتری',
      user: null,
      newVerityInfo: {
        verity_businessID: '',
        verity_businessCode: ''
      },
      newPanatechInfo: {
        panatech_businessID: '',
        panatech_businessCode: ''
      },
      validation: {}
    }
  },
  head() {
    return {
      title: this.title
    }
  },
  methods: {
    updateVerityInfo() {
      this.validation = {}
      this.$confirm(
        'با تغییر کد مشتری و آیدی مشتری تمامی اطلاعات مشتری در سمت پنل کاربری مشتری تغییر خواهد کرد',
        'هشدار',
        {
          confirmButtonText: 'ادامه',
          cancelButtonText: 'لغو',
          type: 'warning'
        }
      )
        .then(() => {
          this.$axios
            .put(`/api/admin/user/changeVerityInfo/${this.user._id}`, this.newVerityInfo)
            .then(response => {
              this.$message({
                type: 'success',
                message: 'اطالاعات جدید در سیستم ثبت شد'
              })
              this.newVerityInfo = {
                verity_businessID: '',
                verity_businessCode: ''
              }
              this.$nuxt.refresh()
            })
            .catch(err => {
              if (err.response.status === 422) this.validation = err.response.data.validation
              else console.log(err)
            })
        })
        .catch(() => {
          this.$message({
            type: 'warning',
            message: 'عملیات لغو شد'
          })
        })
    },
    updatePanatechInfo() {
      this.validation = {}
      this.$confirm(
        'با تغییر کد مشتری و آیدی مشتری تمامی اطلاعات مشتری در سمت پنل کاربری مشتری تغییر خواهد کرد',
        'هشدار',
        {
          confirmButtonText: 'ادامه',
          cancelButtonText: 'لغو',
          type: 'warning'
        }
      )
        .then(() => {
          this.$axios
            .put(`/api/admin/user/changePanatechInfo/${this.user._id}`, this.newPanatechInfo)
            .then(response => {
              this.$message({
                type: 'success',
                message: 'اطالاعات جدید در سیستم ثبت شد'
              })
              this.newPanatechInfo = {
                panatech_businessID: '',
                panatech_businessCode: ''
              }
              this.$nuxt.refresh()
            })
            .catch(err => {
              if (err.response.status === 422) this.validation = err.response.data.validation
              else console.log(err)
            })
        })
        .catch(() => {
          this.$message({
            type: 'warning',
            message: 'عملیات لغو شد'
          })
        })
    }
  }
}
</script>