Selaa lähdekoodia

广告主授权修改

zhuxinbo 5 vuotta sitten
vanhempi
commit
95c67b3abe
1 muutettua tiedostoa jossa 233 lisäystä ja 235 poistoa
  1. 233 235
      src/views/modules/advertiser/AdvertiserList.vue

+ 233 - 235
src/views/modules/advertiser/AdvertiserList.vue

@@ -1,9 +1,12 @@
 <template>
   <a-card :bordered="false">
+
     <!-- 查询区域 -->
     <div class="table-page-search-wrapper">
-      <a-form layout="inline">
+      <a-form
+        layout="inline">
         <a-row :gutter="24">
+
           <a-col :md="6" :sm="8">
             <a-form-item label="广告主名称">
               <a-input placeholder="请输入广告主名称" v-model="queryParam.name"></a-input>
@@ -17,8 +20,7 @@
                 placeholder="请选择行业"
                 dict="sys_category,name,id"
                 pidField="pid"
-                pidValue="f5cb2d2d28417b3b65a6dd744bcb9a76"
-              >
+                pidValue="f5cb2d2d28417b3b65a6dd744bcb9a76">
               </j-tree-select>
             </a-form-item>
           </a-col>
@@ -28,6 +30,7 @@
               <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
             </span>
           </a-col>
+
         </a-row>
       </a-form>
     </div>
@@ -43,13 +46,12 @@
       <a-dropdown v-if="selectedRowKeys.length > 0">
         <a-menu slot="overlay">
           <a-menu-item key="1" @click="batchDel">
-            <a-icon type="delete" />
+            <a-icon type="delete"/>
             删除
           </a-menu-item>
         </a-menu>
-        <a-button style="margin-left: 8px">
-          批量操作
-          <a-icon type="down" />
+        <a-button style="margin-left: 8px"> 批量操作
+          <a-icon type="down"/>
         </a-button>
       </a-dropdown>
     </div>
@@ -57,9 +59,8 @@
     <!-- table区域-begin -->
     <div>
       <div class="ant-alert ant-alert-info" style="margin-bottom: 16px;">
-        <i class="anticon anticon-info-circle ant-alert-icon"></i> 已选择
-        <a style="font-weight: 600">{{ selectedRowKeys.length }}</a
-        >项
+        <i class="anticon anticon-info-circle ant-alert-icon"></i> 已选择 <a style="font-weight: 600">{{
+        selectedRowKeys.length }}</a>项
         <a style="margin-left: 24px" @click="onClearSelected">清空</a>
       </div>
 
@@ -72,120 +73,107 @@
         :dataSource="dataSource"
         :pagination="ipagination"
         :loading="loading"
-        :rowSelection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
-        @change="handleTableChange"
-      >
+        :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
+        @change="handleTableChange">
         <span slot="action" slot-scope="text, record">
           <a @click="handleEdit(record)">编辑</a>
 
-          <a-divider type="vertical" />
+          <a-divider type="vertical"/>
           <a @click="handleDelete(record)">删除</a>
         </span>
+
       </a-table>
       <a-modal
         title="账号绑定"
         v-model="visible"
         @ok="handleSubmit"
         :width="800"
-        :okButtonProps="{ props: { disabled: false } }"
-        :cancelButtonProps="{ props: { disabled: false } }"
+        :okButtonProps="{ props: {disabled: false} }"
+        :cancelButtonProps="{ props: {disabled: false} }"
       >
+
         <a-form>
           <a-form-item
             label="选择方式"
-            :labelCol="{ xs: { span: 24 }, sm: { span: 5 } }"
-            :wrapperCol="{ xs: { span: 24 }, sm: { span: 16 } }"
-          >
+            :labelCol="{xs: {span: 24},sm: {span: 5}}"
+            :wrapperCol="{xs: {span: 24},sm: {span: 16}}">
             <a-radio-group buttonStyle="solid" @change="onChageLogin" v-model="mode">
               <a-radio-button value="login">登录</a-radio-button>
               <a-radio-button value="authorization">授权</a-radio-button>
             </a-radio-group>
           </a-form-item>
 
-          <a-form-item v-if="showLogin">
-            <a-form :form="form">
+          <a-form-item
+            v-if="showLogin"
+          >
+            <a-form
+              :form="form">
               <!-- @submit="loginForm">-->
               <a-form-item
                 label="账号:"
-                :label-col="{ xs: { span: 24 }, sm: { span: 5 } }"
-                :wrapper-col="{ xs: { span: 24 }, sm: { span: 16 } }"
-              >
-                <a-input v-model="accountName" placeholder="请输入账户名" />
+                :label-col="{xs: {span: 24},sm: {span: 5}}"
+                :wrapper-col="{xs: {span: 24},sm: {span: 16}}">
+                <a-input v-model="accountName" placeholder="请输入账户名"/>
               </a-form-item>
               <a-form-item
                 label="密码:"
-                :label-col="{ xs: { span: 24 }, sm: { span: 5 } }"
-                :wrapper-col="{ xs: { span: 24 }, sm: { span: 16 } }"
-              >
-                <a-input type="password" v-model="password" placeholder="请输入密码" />
+                :label-col="{xs: {span: 24},sm: {span: 5}}"
+                :wrapper-col="{xs: {span: 24},sm: {span: 16}}">
+                <a-input type="password" v-model="password" placeholder="请输入密码"/>
               </a-form-item>
               <a-form-item
                 label="媒体:"
-                :label-col="{ xs: { span: 24 }, sm: { span: 5 } }"
-                :wrapper-col="{ xs: { span: 24 }, sm: { span: 16 } }"
-              >
+                :label-col="{xs: {span: 24},sm: {span: 5}}"
+                :wrapper-col="{xs: {span: 24},sm: {span: 16}}">
                 <a-radio-group buttonStyle="outline" v-model="loginType">
                   <a-radio-button value="kuaishou">快手</a-radio-button>
                   <a-radio-button value="bytedance">头条</a-radio-button>
                 </a-radio-group>
               </a-form-item>
 
-              <a-form-item
-                label="部门分配"
-                :labelCol="{ xs: { span: 24 }, sm: { span: 5 } }"
-                :wrapperCol="{ xs: { span: 24 }, sm: { span: 16 } }"
-                v-show="!departDisabled"
-              >
+              <a-form-item label="部门分配" :labelCol="{xs: {span: 24},sm: {span: 5}}"
+                           :wrapperCol="{xs: {span: 24},sm: {span: 16}}" v-show="!departDisabled">
                 <j-select-depart v-model="departmentId" :multi="false"></j-select-depart>
               </a-form-item>
 
-              <a-form-item
-                label="用户选择"
-                :labelCol="{ xs: { span: 24 }, sm: { span: 5 } }"
-                :wrapperCol="{ xs: { span: 24 }, sm: { span: 16 } }"
-              >
+              <a-form-item label="用户选择" :labelCol="{xs: {span: 24},sm: {span: 5}}"
+                           :wrapperCol="{xs: {span: 24},sm: {span: 16}}">
                 <j-select-user-by-dep v-model="users"></j-select-user-by-dep>
               </a-form-item>
+
             </a-form>
           </a-form-item>
 
           <a-form-item
             v-if="showAuthorization"
-            :labelCol="{ xs: { span: 24 }, sm: { span: 5 } }"
-            :wrapperCol="{ xs: { span: 24 }, sm: { span: 16 } }"
-          >
-            <a-form :form="form">
+            :labelCol="{xs: {span: 24},sm: {span: 5}}"
+            :wrapperCol="{xs: {span: 24},sm: {span: 16}}">
+            <a-form
+              :form="form">
               <!--@submit="authorizationForm"-->
 
-              <a-form-item
-                label="媒体:"
-                :labelCol="{ xs: { span: 24 }, sm: { span: 5 } }"
-                :wrapperCol="{ xs: { span: 24 }, sm: { span: 16 } }"
-              >
+              <a-form-item label="媒体:" :labelCol="{xs: {span: 24},sm: {span: 5}}"
+                           :wrapperCol="{xs: {span: 24},sm: {span: 16}}">
                 <a-radio-group buttonStyle="outline" v-model="authorizationType">
                   <a-radio-button value="kuaishou">快手</a-radio-button>
                   <a-radio-button value="bytedance">头条</a-radio-button>
                 </a-radio-group>
               </a-form-item>
 
-              <a-form-item
-                label="部门分配"
-                :labelCol="{ xs: { span: 24 }, sm: { span: 5 } }"
-                :wrapperCol="{ xs: { span: 24 }, sm: { span: 16 } }"
-                v-show="!departDisabled"
-              >
+              <a-form-item label="部门分配" :labelCol="{xs: {span: 24},sm: {span: 5}}"
+                           :wrapperCol="{xs: {span: 24},sm: {span: 16}}" v-show="!departDisabled">
                 <j-select-depart v-model="departmentId" :multi="false"></j-select-depart>
+
               </a-form-item>
 
-              <a-form-item
-                label="用户选择"
-                :labelCol="{ xs: { span: 24 }, sm: { span: 5 } }"
-                :wrapperCol="{ xs: { span: 24 }, sm: { span: 16 } }"
-              >
+              <a-form-item label="用户选择" :labelCol="{xs: {span: 24},sm: {span: 5}}"
+                           :wrapperCol="{xs: {span: 24},sm: {span: 16}}">
                 <j-select-user-by-dep v-model="users"></j-select-user-by-dep>
               </a-form-item>
+
             </a-form>
           </a-form-item>
+
         </a-form>
       </a-modal>
     </div>
@@ -198,110 +186,114 @@
 </template>
 
 <script>
-import AdvertiserModal from './modules/AdvertiserModal'
-import { JeecgListMixin } from '@/mixins/JeecgListMixin'
-import JTreeSelect from '@/components/jeecg/JTreeSelect'
-import AFormItem from 'ant-design-vue/es/form/FormItem'
-import JSelectDepart from '@/components/jeecgbiz/JSelectDepart'
-import JSelectUserByDep from '@/components/jeecgbiz/JSelectUserByDep'
-import JSelectUser from '@/components/jeecgbiz/JSelectUser'
-import { postAction } from '../../../api/manage'
-import { mapActions, mapGetters } from 'vuex'
-
-export default {
-  name: 'AdvertiserList',
-  mixins: [JeecgListMixin],
-  components: {
-    AFormItem,
-    AdvertiserModal,
-    JTreeSelect,
-    JSelectUserByDep,
-    JSelectDepart,
-    JSelectUser
-  },
-  data() {
-    return {
-      departDisabled: false, //是否是我的部门调用该页面
-      users: this.userInfo().realname, //用户名称
-      departmentId: this.userInfo().departId, //部门id
-      description: '广告主信息表管理页面',
-      visible: false,
-      accountName: '',
-      password: '',
-      mode: 'login',
-      showLogin: true,
-      showAuthorization: false,
-      authorizationType: 'kuaishou',
-      loginType: 'kuaishou',
-      form: this.$form.createForm(this),
-      // 表头
-      columns: [
-        {
-          title: '#',
-          dataIndex: '',
-          key: 'rowIndex',
-          width: 60,
-          align: 'center',
-          customRender: function(t, r, index) {
-            return parseInt(index) + 1
+  import AdvertiserModal from './modules/AdvertiserModal'
+  import {JeecgListMixin} from '@/mixins/JeecgListMixin'
+  import JTreeSelect from '@/components/jeecg/JTreeSelect'
+  import AFormItem from "ant-design-vue/es/form/FormItem";
+  import JSelectDepart from '@/components/jeecgbiz/JSelectDepart'
+  import JSelectUserByDep from '@/components/jeecgbiz/JSelectUserByDep'
+  import JSelectUser from '@/components/jeecgbiz/JSelectUser'
+  import {postAction} from "../../../api/manage";
+  import {mapActions, mapGetters} from 'vuex'
+
+
+  export default {
+    name: 'AdvertiserList',
+    mixins: [JeecgListMixin],
+    components: {
+      AFormItem,
+      AdvertiserModal,
+      JTreeSelect,
+      JSelectUserByDep,
+      JSelectDepart,
+      JSelectUser
+    },
+    data() {
+      return {
+        departDisabled: false, //是否是我的部门调用该页面
+        users: this.userInfo().realname,//用户名称
+        departmentId: this.userInfo().departId, //部门id
+        description: '广告主信息表管理页面',
+        visible: false,
+        accountName: '',
+        password: '',
+        mode: 'login',
+        showLogin: true,
+        showAuthorization: false,
+        authorizationType: 'kuaishou',
+        loginType: 'kuaishou',
+        form: this.$form.createForm(this),
+        // 表头
+        columns: [
+          {
+            title: '#',
+            dataIndex: '',
+            key: 'rowIndex',
+            width: 60,
+            align: 'center',
+            customRender: function (t, r, index) {
+              return parseInt(index) + 1;
+            }
+          },
+          {
+            title: '广告主名称',
+            align: 'center',
+            dataIndex: 'name'
+          },
+          {
+            title: '行业',
+            align: 'center',
+            dataIndex: 'industryId'
+          },
+          {
+            title: '联系人姓名',
+            align: 'center',
+            dataIndex: 'contact'
+          },
+          {
+            title: '联系人手机',
+            align: 'center',
+            dataIndex: 'mobile'
+          },
+          {
+            title: '联系人邮箱',
+            align: 'center',
+            dataIndex: 'email'
+          },
+          {
+            title: '操作',
+            dataIndex: 'action',
+            align: 'center',
+            scopedSlots: {customRender: 'action'},
           }
+        ],
+        url: {
+          list: '/ctop/advertiser/list',
+          delete: '/ctop/advertiser/delete',
+          deleteBatch: '/ctop/advertiser/deleteBatch',
+          exportXlsUrl: 'ctop/advertiser/exportXls',
+          importExcelUrl: 'ctop/advertiser/importExcel',
+          bindAccountLoginUrl: '/ctop/bindAccountLogin/login',
+          bindAuthorizationUrl: '/ctop/bindAccountAuth/authorization',
+          getLoginInfo: '/ctop/bindAccount/getLoginInfo',
+          userId: "/sys/user/generateUserId", // 引入生成添加用户情况下的url
+          userWithDepart: "/sys/user/userDepartList", // 引入为指定用户查看部门信息需要的url
+
         },
-        {
-          title: '广告主名称',
-          align: 'center',
-          dataIndex: 'name'
-        },
-        {
-          title: '行业',
-          align: 'center',
-          dataIndex: 'industryId'
-        },
-        {
-          title: '联系人姓名',
-          align: 'center',
-          dataIndex: 'contact'
-        },
-        {
-          title: '联系人手机',
-          align: 'center',
-          dataIndex: 'mobile'
-        },
-        {
-          title: '联系人邮箱',
-          align: 'center',
-          dataIndex: 'email'
-        },
-        {
-          title: '操作',
-          dataIndex: 'action',
-          align: 'center',
-          scopedSlots: { customRender: 'action' }
-        }
-      ],
-      url: {
-        list: '/ctop/advertiser/list',
-        delete: '/ctop/advertiser/delete',
-        deleteBatch: '/ctop/advertiser/deleteBatch',
-        exportXlsUrl: 'ctop/advertiser/exportXls',
-        importExcelUrl: 'ctop/advertiser/importExcel',
-        bindAccountLoginUrl: '/ctop/bindAccountLogin/login',
-        bindAuthorizationUrl: '/ctop/bindAccountAuth/authorization',
-        getLoginInfo: '/ctop/bindAccount/getLoginInfo',
-        userId: '/sys/user/generateUserId', // 引入生成添加用户情况下的url
-        userWithDepart: '/sys/user/userDepartList' // 引入为指定用户查看部门信息需要的url
       }
-    }
-  },
-  computed: {
-    importExcelUrl: function() {
-      return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`
-    }
-  },
-  methods: {
-    ...mapGetters(['nickname', 'avatar', 'userInfo']),
+    },
+    computed: {
+      importExcelUrl: function () {
+        return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`;
+      }
+    },
+    methods: {
+      ...mapGetters(["nickname", "avatar", "userInfo"]),
+
 
-    handleSubmit() {
-      /*postAction(this.url.getLoginInfo).then((res) => {
+
+      handleSubmit() {
+        /*postAction(this.url.getLoginInfo).then((res) => {
           if (res.success) {
             alert("绑定成功");
             this.accountName = '';
@@ -311,87 +303,93 @@ export default {
             alert("绑定失败");
           }
         });*/
-      let params = {}
-      params.advertiserId = this.record.id
-      params.advertiser_name = this.record.name
-      params.userId = this.userInfo().id
-      params.userName = this.userInfo().username
-      params.projectId = this.record.projectId
-      params.projectName = this.record.projectName
-
-      // 触发表单验证
-      this.form.validateFields(err => {
-        if (!err) {
-          if (this.mode == 'login') {
-            params.accountName = this.accountName
-            params.password = this.password
-            params.loginType = this.loginType
-            if (this.loginType == 'kuaishou') {
-              params.mediaId = 2
-            } else if (this.loginType == 'bytedance') {
-              params.mediaId = 1
-            }
-            postAction(this.url.bindAccountLoginUrl, params).then(res => {
-              if (res.success) {
-                alert('绑定成功')
-                this.accountName = ''
-                this.password = ''
-                this.loginType = ''
-              } else {
-                alert(res.message)
+        let params = {};
+        params.advertiserId = this.record.id;
+        params.advertiser_name = this.record.name;
+        params.userId = this.userInfo().id;
+        params.userName = this.userInfo().username
+        params.projectId = this.record.projectId
+        params.projectName = this.record.projectName
+
+        // 触发表单验证
+        this.form.validateFields((err) => {
+          if (!err) {
+            if (this.mode == 'login') {
+              params.accountName = this.accountName;
+              params.password = this.password;
+              params.loginType = this.loginType;
+              if (this.loginType == 'kuaishou') {
+                params.mediaId = 2;
+              } else if (this.loginType == 'bytedance') {
+                params.mediaId = 1;
               }
-            })
-          }
-          // 授权登录
-          if (this.mode == 'authorization') {
-            params.authorizationType = this.authorizationType
-            if (this.authorizationType == 'kuaishou') {
-              params.mediaId = 2
-            } else if (this.authorizationType == 'bytedance') {
-              params.mediaId = 1
+              postAction(this.url.bindAccountLoginUrl, params).then((res) => {
+                if (res.success) {
+                  alert("绑定成功");
+                  this.accountName = '';
+                  this.password = '';
+                  this.loginType = '';
+                } else {
+                  alert(res.message);
+                }
+              });
             }
-            postAction(this.url.bindAuthorizationUrl, params).then(res => {
-              if (res.success) {
-                window.open(res.message, '_blank')
-              } else {
-                alert('绑定失败')
+            // 授权登录
+            if (this.mode == 'authorization') {
+              params.authorizationType = this.authorizationType;
+              if (this.authorizationType == 'kuaishou') {
+                params.mediaId = 2;
+              } else if (this.authorizationType == 'bytedance') {
+                params.mediaId = 1;
               }
-            })
+              postAction(this.url.bindAuthorizationUrl, params).then((res) => {
+                if (res.success) {
+                  window.open(res.message, '_blank');
+                } else {
+                  alert("绑定失败");
+                }
+              });
+            }
+
           }
+        })
+
+      },
+
+      onChageLogin() {
+        console.log(this.mode)
+        if (this.mode == 'login') {
+          this.showLogin = true;
+          this.showAuthorization = false;
+        } else {
+          this.showLogin = false;
+          this.showAuthorization = true;
+
+
         }
-      })
-    },
+      },
+      showModal(record) {
+        this.record = record
+        this.visible = true
+      },
 
-    onChageLogin() {
-      console.log(this.mode)
-      if (this.mode == 'login') {
-        this.showLogin = true
-        this.showAuthorization = false
-      } else {
-        this.showLogin = false
-        this.showAuthorization = true
-      }
-    },
-    showModal(record) {
-      this.record = record
-      this.visible = true
+      handleCancel() {
+        this.close()
+      },
     },
 
-    handleCancel() {
-      this.close()
+    handleOk(e) {
+      console.log(e);
+      this.visible = false
+    },
+    handleCancel(e) {
+      console.log(e);
+      this.visible = false
     }
-  },
-
-  handleOk(e) {
-    console.log(e)
-    this.visible = false
-  },
-  handleCancel(e) {
-    console.log(e)
-    this.visible = false
+
+
   }
-}
 </script>
 <style scoped>
-@import '~@assets/less/common.less';
-</style>
+  @import '~@assets/less/common.less'
+</style>