guhongwei 4 tahun lalu
induk
melakukan
18ce6ac017
3 mengubah file dengan 90 tambahan dan 5 penghapusan
  1. 0 0
      src/components/frame/upload.vue
  2. 85 1
      src/views/company/index.vue
  3. 5 4
      vue.config.js

src/components/frame/uploadone.vue → src/components/frame/upload.vue


+ 85 - 1
src/views/company/index.vue

@@ -14,7 +14,44 @@
       </el-col>
     </el-row>
     <el-dialog :visible.sync="dialog" title="增加企业信息" @close="toClose" :destroy-on-close="true" width="50%">
-      <data-form :data="form" :fields="formFields" :rules="rules" @save="turnSave"> </data-form>
+      <data-form :data="form" :fields="formFields" :rules="rules" @save="turnSave">
+        <!-- 单选 -->
+        <!-- <template #radios="{item}">
+          <template v-if="item.model === 'type'">
+            <el-radio label="0">技术</el-radio>
+            <el-radio label="1">产品</el-radio>
+            <el-radio label="1">服务</el-radio>
+          </template>
+        </template> -->
+        <!-- 下拉单选 -->
+        <template #options="{item}">
+          <template v-if="item.model == 'type'">
+            <template v-for="(i, index) in typeList">
+              <el-option :key="index" :label="`${i.name}`" :value="i.id"></el-option>
+            </template>
+          </template>
+        </template>
+        <template #custom="{item}">
+          <template v-if="item.model === 'file'">
+            <upload :limit="1" :data="form.file" type="file" :url="'/files/file/upload'" @upload="uploadSuccess" @delete="uploadDelete"></upload>
+          </template>
+          <template v-else-if="item.model === 'video'">
+            <upload
+              :limit="1"
+              :data="form.video"
+              type="video"
+              :uploadBtn="true"
+              listType=""
+              :url="'/files/video/upload'"
+              @upload="uploadSuccess"
+              @delete="uploadDelete"
+            ></upload>
+          </template>
+          <template v-else-if="item.model === 'image'">
+            <upload :limit="3" :data="form.image" type="image" :url="'/files/image/upload'" @upload="uploadSuccess" @delete="uploadDelete"></upload>
+          </template>
+        </template>
+      </data-form>
     </el-dialog>
   </div>
 </template>
@@ -23,6 +60,7 @@
 import breadcrumb from '@c/common/breadcrumb.vue';
 import dataTable from '@/components/frame/filter-page-table.vue';
 import dataForm from '@/components/frame/form.vue';
+import upload from '@/components/frame/upload.vue';
 import { mapState, createNamespacedHelpers } from 'vuex';
 const { mapActions: company } = createNamespacedHelpers('company');
 export default {
@@ -35,6 +73,7 @@ export default {
     breadcrumb,
     dataTable,
     dataForm,
+    upload,
   },
   data: function() {
     return {
@@ -53,6 +92,13 @@ export default {
       fields: [
         { label: '企业名称', prop: 'company', filter: 'input' },
         { label: '电话', prop: 'mobile' },
+        {
+          label: '企业信息类型',
+          prop: 'type',
+          format: i => {
+            return i == '0' ? '技术' : i == '1' ? '产品' : '服务';
+          },
+        },
       ],
       list: [],
       total: 0,
@@ -61,12 +107,32 @@ export default {
       formFields: [
         { label: '企业名称', required: true, model: 'company' },
         { label: '电话', required: true, model: 'mobile', options: { minlength: 11, maxlength: 11 } },
+        { label: '类型', required: true, model: 'type', type: 'select' },
+        { label: '图片(单张)', required: false, model: 'file', custom: true },
+        { label: '视频(视频)', required: false, model: 'video', custom: true },
+        { label: '图片数组(数组)', required: false, model: 'image', custom: true },
       ],
       form: {},
       rules: {
         company: [{ required: true, message: '请输入企业名称', trigger: 'blur' }],
         mobile: [{ required: true, message: '请输入电话', trigger: 'blur' }],
+        type: [{ required: true, message: '请输入电话', trigger: 'change' }],
       },
+      // 类型
+      typeList: [
+        {
+          id: '0',
+          name: '技术',
+        },
+        {
+          id: '1',
+          name: '产品',
+        },
+        {
+          id: '2',
+          name: '服务',
+        },
+      ],
     };
   },
   created() {
@@ -140,6 +206,24 @@ export default {
       this.dialog = false;
       this.search();
     },
+    uploadSuccess({ type, data }) {
+      if (type == 'image') {
+        let arr = _.get(this.form, type);
+        if (_.isArray(arr)) {
+          let datas = { name: data.name, url: data.uri };
+          this.form[type].push({ name: data.name, url: data.uri });
+        } else {
+          let newArr = [{ name: data.name, url: data.uri }];
+          this.$set(this.form, `${type}`, newArr);
+        }
+      } else {
+        this.$set(this.form, `${type}`, data.uri);
+      }
+    },
+    // 删除图片
+    uploadDelete(index) {
+      // this.form.image.splice(index, 1);
+    },
   },
   computed: {
     ...mapState(['user']),

+ 5 - 4
vue.config.js

@@ -21,15 +21,16 @@ module.exports = {
     proxy: {
       '/files': {
         target: 'http://free.liaoningdoupo.com',
-        pathRewrite: {
-          '^/files': '',
-        },
       },
       '/api': {
-        target: 'http://192.168.1.43:8081',
+        target: 'http://192.168.31.194:8081',
         changeOrigin: true,
         ws: true,
       },
+      '/ws': {
+        target: 'http://free.liaoningdoupo.com',
+        ws: true,
+      },
     },
   },
 };