Функция Crud для файла (PDF) с использованием Laravel, ax ios в VueJS API - PullRequest
0 голосов
/ 26 января 2020

Раньше у меня была проблема с вставкой в ​​базу данных pdf-адреса с его именем, но я решил ее, и теперь я столкнулся с проблемой, заключающейся в том, что я не знаю, как выполнить функцию обновления. Я пробовал много способов. но я не мог найти решение. Я обновил code.sorry для моего Engli sh, написав, что я неделя реле в этом. Есть ли способ сделать это так. Любая помощь будет высоко оценена

Код контроллера:

public function store(Request $request)
 { $DocumentType = new DocumentType();
        $upload_path = public_path('uploads');
    $file_name = $request->file->getClientOriginalName();
    $generated_new_name = time() . '.' . $request->file->getClientOriginalExtension();
    $request->file->move($upload_path, $generated_new_name);
    //  $DocumentType->name = $request->documentname;
     $DocumentType->name = $request->name;
        $DocumentType->file =  $file_name;
        $DocumentType->save();

        return response()->json($DocumentType);

 }

Vuejs код

<template>
  <div class="container">
    <div class="vld-parent">
      <loading
        :active.sync="isLoading"
        :can-cancel="true"
        :on-cancel="onCancel"
        :is-full-page="fullPage"
        color="#3cb371"
      ></loading>
    </div>
    <div class="col-md-12 col-sm-12 col-xs-12">
      <div class="x_panel">
        <div class="x_title">
          <h2>جدول‌ اسناد ها</h2>
          <ul class="nav navbar-right panel_toolbox">
            <li>
              <a class="collapse-link">
                <i class="fa fa-chevron-up"></i>
              </a>
            </li>

            <li>
              <a class="close-link">
                <i class="fa fa-close"></i>
              </a>
            </li>
          </ul>
          <div class="clearfix"></div>
        </div>
        <div class="x_content">
          <div
            id="datatable-buttons_wrapper"
            class="dataTables_wrapper form-inline dt-bootstrap no-footer"
          >
            <div class="dt-buttons btn-group">
              <button
                class="btn btn-default buttons-copy buttons-html5 btn-sm"
                tabindex="0"
                aria-controls="datatable-buttons"
                @click="newModal"
              >ثبت اسناد جدید</button>
              <button
                class="btn btn-default buttons-copy buttons-html5 btn-sm"
                tabindex="0"
                aria-controls="datatable-buttons"
                @click="delt"
              >حذف چندگانه</button>
              <a
                class="btn btn-default buttons-excel buttons-html5 btn-sm"
                tabindex="0"
                aria-controls="datatable-buttons"
                href="#"
              >
                <span>اکسل</span>
              </a>
              <a
                class="btn btn-default buttons-pdf buttons-html5 btn-sm"
                tabindex="0"
                aria-controls="datatable-buttons"
                href="#"
              >
                <span>فایل PDF</span>
              </a>
              <a
                class="btn btn-default buttons-print btn-sm"
                tabindex="0"
                aria-controls="datatable-buttons"
                href="#"
              >
                <span>چاپ</span>
              </a>
            </div>
            <div id="datatable-buttons_filter" class="dataTables_filter">
              <label>
                <!-- <button type="submit" class="btn btn-default" @click="searchit">
                  <i class="fas fa-search"></i>
                </button>-->
                <input
                  type="search"
                  name="table_search"
                  class="form-control input-sm"
                  placeholder="تلاش"
                  aria-controls="datatable-buttons"
                  @keyup="searchit"
                  v-model="search"
                />
              </label>
            </div>
            <table
              id="datatable-buttons"
              class="table table-striped table-bordered dataTable no-footer dtr-inline"
              role="grid"
              aria-describedby="datatable-buttons_info"
            >
              <thead>
                <tr role="row">
                  <!-- <th> -->
                  <!-- <input type="checkbox" id="check-all" class="flat" @click="selectAll" v-model="allSelected"> -->
                  <!-- </th> -->
                  <th style="width:1%">
                    <input type="checkbox" @click="selectAll" v-model="allSelected" />
                  </th>
                  <th
                    class="sorting"
                    tabindex="0"
                    aria-controls="datatable-buttons"
                    rowspan="1"
                    colspan="1"
                    aria-label="کود: activate to sort column ascending"
                  >کود</th>
                  <th
                    class="sorting_asc"
                    tabindex="0"
                    aria-controls="datatable-buttons"
                    rowspan="1"
                    colspan="1"
                    aria-sort="ascending"
                    aria-label="نام: activate to sort column descending"
                  >نام</th>
                  <th
                    class="sorting_asc"
                    tabindex="0"
                    aria-controls="datatable-buttons"
                    rowspan="1"
                    colspan="1"
                    aria-sort="ascending"
                    aria-label="فایل: activate to sort column descending"
                  >فایل</th>
                  <th
                    class="sorting_asc"
                    tabindex="0"
                    aria-controls="datatable-buttons"
                    rowspan="1"
                    colspan="1"
                    aria-sort="ascending"
                    aria-label="تنظیم: activate to sort column descending"
                  >تنظیم</th>
                </tr>
              </thead>

              <tbody>
                <tr
                  role="row"
                  class="odd"
                  v-if="DocumentTypes.data!=undefined && DocumentTypes.data.length == 0 || DocumentTypes.data!=undefined && DocumentTypes.data.length=='' "
                >
                  <td colspan="6" align="center" :v-show="hidebutton=false">
                    <p class="text-center alert alert-danger">هیچ معلومات در جدول وجود ندارد</p>
                  </td>
                </tr>
                <tr
                  role="row"
                  class="even"
                  v-else
                  v-show="hidebutton=true"
                  v-for="DocumentType in DocumentTypes.data"
                  v-bind:key="DocumentType.id"
                >
                  <td>
                    <div class="custom-control custom-checkbox">
                      <input
                        class="form-check-input"
                        type="checkbox"
                        :value="DocumentType.id"
                        v-model="checkedRows"
                        id="chekboxs"
                      />

                      <label class="form-check-label"></label>
                    </div>
                  </td>
                  <td>{{DocumentType.id}}</td>

                  <td>{{DocumentType.name}}</td>
                  <td>{{DocumentType.file}}</td>
                  <!-- <td>{{DocumentType.firstname |UppCaseFirstLetter}}</td> -->
                  <td>
                    <a href="#" class="btn btn-info btn-xs" @click="editModal(DocumentType)">
                      <i class="fa fa-pencil"></i> ویرایش
                    </a>
                    <a
                      href="#"
                      class="btn btn-danger btn-xs"
                      @click="deleteDocumentType(DocumentType.id)"
                    >
                      <i class="fa fa-trash-o"></i> حذف
                    </a>
                  </td>
                  <!-- <td class="sorting_1" tabindex="0">Angelica Ramos</td> -->
                </tr>
              </tbody>
            </table>

            <div class="card-footer">
              <pagination :data="DocumentTypes" @pagination-change-page="getResults"></pagination>
            </div>
          </div>
        </div>
      </div>
    </div>
    <!-- insert modal -->
    <div
      class="modal fade"
      id="addNew"
      tabindex="-1"
      role="dialog"
      aria-labelledby="addNewLabel"
      aria-hidden="true"
    >
      <div class="modal-dialog modal-dialog-centered" role="document">
        <div class="modal-content">
          <div class="modal-header">
            <h5 class="modal-title" v-show="!editMode" id="addNewLabel">ثبت اسناد جدید</h5>
            <h5 class="modal-title" v-show="editMode" id="addNewLabel">تمدید اسناد</h5>

            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
              <span aria-hidden="true" style="margin-right: 317px;">&times;</span>
            </button>
          </div>
          <!-- <div v-if="success !== ''" class="alert alert-success" role="alert">{{success}}</div> -->

          <form
            enctype="multipart/form-data"
            @submit.prevent="editMode ? updateDocumentType() : createDocumentType()"
          >
            <div class="modal-body">
              <div class="form-group">
                <input
                  v-model="form.name"
                  placeholder="نام"
                  type="text"
                  name="name"
                  class="form-control"
                  :class="{ 'is-invalid': form.errors.has('name') }"
                />
                <has-error :form="form" field="name"></has-error>
              </div>
              <div class="form-group">
                <label for="file" class="col-sm-4 control-label">File</label>

                <div class="input-group">
                  <input type="file" name="file" @change="selectFile" />
                </div>
                <div class="input-group-append">
                  <input type="submit" class="btn btn-primary" value="Upload" />
                </div>
              </div>
            </div>

            <div class="modal-footer">
              <button type="button" class="btn btn-danger" data-dismiss="modal">لغو</button>

              <button
                v-show="editMode"
                :disabled="form.busy"
                type="submit"
                class="btn btn-success"
              >تمدید</button>
              <button
                v-show="!editMode"
                :disabled="form.busy"
                type="submit"
                class="btn btn-primary"
              >ثبت</button>
            </div>
          </form>
        </div>
      </div>
    </div>

    <!-- </div> -->
    <!-- end of Insert modal -->
  </div>
</template>


<script>
export default {
  mounted() {
    console.log("Component successfully mounted.");
  },
  data() {
    return {
        form: new Form({
    id: "",
    name: "",
    file: ""
  })
    };
  },
  methods: {
    selectFile(e) {
  // if (file == "") return false;
  const file = e.target.files[0];
  this.form.file = file;
},
    createDocumentType() {
  this.$Progress.start();

  this.form
    .submit("post", "api/store_file", {
      // Transform form data to FormData
      transformRequest: [
        function(data, headers) {
          return objectToFormData(data);
        }
      ]
    })
    .then(data => {
      $("#addNew").modal("hide");

      this.$Progress.finish();
    })
    .catch(() => {});
},
};
</script>

Маршрут API

Route::apiResources(['store_file'=>'API\FileUploadController']);
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...