Merge remote-tracking branch 'origin/gzb' into wzl

src/api/appgroup.js

@@ -72,6 +72,15 @@ export const app_list_app = (data) => setRequest("app/list_app", data);
  */
 export const app_detail_app = (data) => setRequest("app/detail_app", data);
 
+/**
+ * 5.2.10 应用-启用
+ */
+export const app_edit_enable = (data) => setRequest("app/edit_enable", data);
+
+/**
+ * 5.2.11 应用-禁用
+ */
+export const app_edit_unenable = (data) => setRequest("app/edit_unenable", data);
 /**
  * 5.3 设备-列表(分组下设备)
  */

src/components/Checkbox/CheckboxDevice.vue

@@ -90,7 +90,7 @@ export default {
       }
     },
     //设置默认选中
-    getCheckedRole(val) {
+    getCheckedDevices(val) {
       this.checkAllSingleGroup = [];
       this.module.devices.forEach((item) => {
         val.map((value) => {

src/views/regionSection/networkManage/whitelist.vue

@@ -1,14 +1,707 @@
 <template>
-  <div class="main_root">白名单</div>
+  <div class="main_root">
+    <div class="search_header">
+      <div class="search_left">
+        <Input
+          v-model="searchForm.whiteName"
+          placeholder="请输入名称"
+          search
+          @on-search="searchList()"
+          style="width: 150px"
+        />
+      </div>
+      <Button type="primary" class="primary_btn" @click="toAdd()">新建</Button>
+    </div>
+    <div class="table_wrap">
+      <Table :columns="columns" :data="searchForm.list">
+        <template slot-scope="{ row }" slot="whiteName">
+          <div class="name_slot">
+            <div class="name_content" :title="row.whiteName">
+              {{ row.whiteName }}
+            </div>
+            <div v-if="row.whiteType === 2" class="app_tag">公用</div>
+          </div>
+        </template>
+        <template slot-scope="{ row }" slot="actionSlot">
+          <div class="action_list">
+            <div @click="toView(row)">查看</div>
+            <div @click="toEdit(row)">编辑</div>
+            <div class="action_del" @click="toDel(row)">删除</div>
+          </div>
+        </template>
+      </Table>
+    </div>
+    <div class="page_wrap">
+      <Page
+        :transfer="true"
+        :total="searchForm.total"
+        :current="searchForm.page"
+        :page-size="searchForm.size"
+        :page-size-opts="[10, 20, 40, 60]"
+        @on-change="pageChange"
+        @on-page-size-change="pageSizeChange"
+        show-total
+        show-sizer
+      ></Page>
+    </div>
+    <!-- 新建/编辑 -->
+    <Modal
+      class="modal1 white"
+      :mask-closable="false"
+      v-model="whiteLibraryInfo.show"
+      :title="whiteLibraryInfo.whiteid ? '编辑' : '新建'"
+    >
+      <Form
+        v-if="whiteLibraryInfo.show"
+        ref="addForm"
+        :model="whiteLibraryInfo"
+        :rules="rules"
+        :label-width="90"
+        inline
+      >
+        <FormItem label="名称" prop="whiteName" style="width: 100%">
+          <Input
+            v-model="whiteLibraryInfo.whiteName"
+            placeholder="请输入名称"
+          ></Input>
+        </FormItem>
+        <FormItem label="简介" style="width: 100%">
+          <Input
+            v-model="whiteLibraryInfo.comm"
+            type="textarea"
+            :rows="4"
+            :maxlength="255"
+            placeholder="请输入简介"
+          ></Input>
+          <div class="appcomm">
+            应用简介不能超过255个字符<span class="red">{{
+              whiteLibraryInfo.comm.length
+            }}</span
+            >/255
+          </div>
+        </FormItem>
+        <FormItem label="网址" prop="website" style="width: 100%">
+          <Input
+            type="textarea"
+            :rows="4"
+            v-model="whiteLibraryInfo.website"
+            placeholder="请填写正确的IP地址或者域名，多个IP或域名之间用英文分号隔开"
+          ></Input>
+          <div style="color: #7c8db5">
+            说明：IP例如：192.168.1.200或者192.168.1.200/24，域名例如：new.iflytek.com
+          </div>
+        </FormItem>
+        <FormItem label="选择学校" style="width: 100%" class="require">
+          <RadioGroup v-model="whiteLibraryInfo.targetSchool">
+            <Radio :label="1">所有学校</Radio>
+            <Radio :label="2">自定义学校</Radio>
+          </RadioGroup>
+          <div class="targetSchool" v-if="whiteLibraryInfo.targetSchool === 2">
+            <div class="allSchool">
+              <Input
+                v-model="whiteLibraryInfo.schoolname"
+                placeholder="请输入关键字"
+                search
+                @on-search="getSchool"
+              ></Input>
+              <div class="school_list">
+                <Tree
+                  @on-check-change="getSelectedNodes"
+                  :data="school_list"
+                  show-checkbox
+                ></Tree>
+              </div>
+            </div>
+            <div class="selectSchool">
+              <div class="school_num">
+                已选<span class="num">{{ select_schools.length }}</span
+                >所学校
+              </div>
+              <div class="school_list">
+                <span
+                  class="school_item"
+                  v-for="(item, index) in this.select_schools"
+                  :key="item.schoolid"
+                >
+                  <span class="title" :title="item.title">{{
+                    item.title
+                  }}</span>
+                  <img
+                    @click="delSchool(item)"
+                    class="del"
+                    src="../../../assets/img/guanbi_red.png"
+                  />
+                </span>
+              </div>
+            </div>
+          </div>
+        </FormItem>
+      </Form>
+      <div slot="footer">
+        <Button @click="whiteLibraryInfo.show = false">取消</Button>
+        <Button @click="saveAddInfo()" type="primary">保存</Button>
+      </div>
+    </Modal>
+    <!-- 查看 -->
+    <Modal
+      class="modal1"
+      :mask-closable="false"
+      v-model="viewInfo.show"
+      title="查看"
+    >
+      <div class="view_title">
+        <div>{{ viewInfo.whiteName }}</div>
+        <div v-if="viewInfo.whiteType === 2" class="wltype_1">公共</div>
+      </div>
+      <Form :label-width="80" inline>
+        <FormItem label="简介" style="margin-bottom: 0; width: 100%">{{
+          viewInfo.comm
+        }}</FormItem>
+        <FormItem label="网址" style="margin-bottom: 0; width: 100%">{{
+          viewInfo.website
+        }}</FormItem>
+        <FormItem label="授权" style="margin-bottom: 0; width: 100%">
+          <Table border :columns="columns1" :data="viewInfo.schools"> </Table>
+        </FormItem>
+      </Form>
+      <div slot="footer" style="text-align: center">
+        <Button @click="viewInfo.show = false">关闭</Button>
+      </div>
+    </Modal>
+  </div>
 </template>
 
 <script>
+import {
+  white_list,
+  white_edit,
+  white_add,
+  white_detail,
+  white_delete
+} from "@/api/whiteLibrary";
+import { region_list_rs } from "@/api/region";
 export default {
   data() {
-    return {};
+    return {
+      searchForm: {
+        whiteName: "",
+        regionid: "",
+        page: 1,
+        size: 10,
+        list: [],
+        total: 0
+      },
+      rules: {
+        whiteName: [
+          {
+            required: true,
+            message: "请输入名称",
+            trigger: "change"
+          }
+        ],
+        website: [
+          {
+            required: true,
+            message: "请输入网址",
+            trigger: "change"
+          }
+        ],
+        versionname: [
+          {
+            required: true,
+            message: "请输入版本名称",
+            trigger: "change"
+          }
+        ]
+      },
+      // 新建/编辑
+      whiteLibraryInfo: {
+        show: false,
+        whiteid: null,
+        rversion: null,
+        whiteName: "",
+        targetSchool: 1,
+        website: "",
+        regionid: "",
+        comm: "",
+        schoolids: []
+      },
+      // 查看
+      viewInfo: {
+        show: false,
+        whiteName: "",
+        // 1app 2网页
+        wltype: 1,
+        website: "",
+        versionname: "",
+        comm: "",
+        whiteAddress: ""
+      },
+      userInfo: {},
+      curRegion: [],
+      school_list: [],
+      select_schools: [],
+      columns: [
+        {
+          title: "序号",
+          align: "center",
+          width: 70,
+          render: (h, params) => {
+            return h(
+              "span",
+              params.index +
+                (this.searchForm.page - 1) * this.searchForm.size +
+                1
+            );
+          }
+        },
+        {
+          title: "名称",
+          slot: "whiteName",
+          align: "center"
+        },
+        {
+          title: "网址",
+          key: "website",
+          align: "center"
+        },
+        {
+          title: "操作人",
+          key: "updatename",
+          width: 140,
+          align: "center"
+        },
+        {
+          title: "操作时间",
+          key: "updatetime",
+          width: 190,
+          align: "center"
+        },
+        {
+          title: "操作",
+          slot: "actionSlot",
+          width: 180,
+          align: "center"
+        }
+      ],
+      columns1: [
+        {
+          title: "序号",
+          align: "center",
+          width: 70,
+          type: "index"
+        },
+        {
+          title: "学校名称",
+          key: "schoolName",
+          align: "center"
+        },
+        {
+          title: "所属区域",
+          key: "regionName",
+          align: "center"
+        },
+        {
+          title: "操作时间",
+          key: "createtime",
+          align: "center"
+        }
+      ]
+    };
   },
-  methods: {}
+  created() {
+    this.userInfo = JSON.parse(
+      localStorage.getItem("xh_control_userInfo")
+    ).content;
+    this.init();
+    this.searchList();
+  },
+  methods: {
+    init() {
+      //获取区域学校
+      region_list_rs({ regionid: this.userInfo.regionid }).then((res) => {
+        if (res.code === 0) {
+          this.getHandleData(res.obj[0]);
+          this.curRegion = res.obj;
+        } else {
+          this.$Message.error(res.msg);
+        }
+      });
+    },
+    delSchool(item) {
+      this.select_schools = this.select_schools.filter(
+        (v) => v.schoolid != item.schoolid
+      );
+      //取消选择
+      this.getSelectSchool(this.school_list[0], item.schoolid, 0);
+    },
+    //选中区域学校
+    getSelectedNodes(data) {
+      this.select_schools = data.filter((v) => v.schoolid);
+    },
+    getSelectSchool(node, schoolid, type) {
+      if (schoolid) {
+        //删除
+        if (node.schoolid && node.schoolid === schoolid) {
+          let checked = type ? true : false;
+          this.$set(node, "checked", checked);
+        }
+      } else {
+        //保存
+        if (node.schoolid) {
+          this.whiteLibraryInfo.schoolids.push(node.schoolid);
+        }
+      }
+      if (node.children && node.children.length > 0) {
+        for (let child of node.children) {
+          this.getSelectSchool(child, schoolid, type);
+        }
+      }
+    },
+    getSchool() {
+      //获取区域学校
+      region_list_rs({
+        regionid: this.userInfo.regionid,
+        regionName: this.whiteLibraryInfo.schoolname
+      }).then((res) => {
+        if (res.code === 0) {
+          this.getHandleData(res.obj[0]);
+          this.school_list = res.obj;
+        } else {
+          this.$Message.error(res.msg);
+        }
+      });
+    },
+    getHandleData(node) {
+      node.title = node.regionName;
+      node.expand = true;
+      if (node.children && node.children.length > 0) {
+        for (let child of node.children) {
+          this.getHandleData(child);
+        }
+      }
+    },
+    // 搜索
+    searchList() {
+      this.searchForm.page = 1;
+      this.getList();
+    },
+    // 页码改变
+    pageChange(page) {
+      this.searchForm.page = page;
+      this.getList();
+    },
+    // 每页显示数量改变
+    pageSizeChange(size) {
+      this.searchForm.size = size;
+      this.searchForm.page = 1;
+      this.getList();
+    },
+    // 获取列表
+    getList() {
+      white_list({
+        page: this.searchForm.page,
+        size: this.searchForm.size,
+        whiteName: this.searchForm.whiteName,
+        regionid: this.userInfo.regionid
+      }).then((data) => {
+        if (data.code === 0) {
+          this.searchForm.list = data.obj.data;
+          this.searchForm.total = data.obj.total;
+        } else {
+          this.$Message.error(data.msg);
+        }
+      });
+    },
+    // 新建
+    toAdd() {
+      this.school_list = JSON.parse(JSON.stringify(this.curRegion));
+      this.whiteLibraryInfo = {
+        show: true,
+        whiteid: null,
+        rversion: null,
+        whiteName: "",
+        targetSchool: 1,
+        website: "",
+        regionid: "",
+        comm: "",
+        schoolids: []
+      };
+    },
+    // 保存新建
+    saveAddInfo() {
+      this.$refs.addForm.validate((valid) => {
+        if (valid) {
+          if (this.whiteLibraryInfo.targetSchool === 1) {
+            //获取全部学校
+            this.getSelectSchool(this.curRegion[0], null);
+          } else {
+            //获取选中学校
+            for (let school of this.select_schools) {
+              this.whiteLibraryInfo.schoolids.push(school.schoolid);
+            }
+          }
+          if (this.whiteLibraryInfo.schoolids.length === 0) {
+            this.$Message.error("请选择学校!");
+            return;
+          }
+          let api = this.whiteLibraryInfo.whiteid ? white_edit : white_add;
+          let form = {
+            whiteName: this.whiteLibraryInfo.whiteName,
+            targetSchool: this.whiteLibraryInfo.targetSchool,
+            regionid: this.userInfo.regionid,
+            website: this.whiteLibraryInfo.website,
+            comm: this.whiteLibraryInfo.comm,
+            schoolids: this.whiteLibraryInfo.schoolids
+          };
+          //编辑
+          if (this.whiteLibraryInfo.whiteid && this.whiteLibraryInfo.rversion) {
+            form.whiteid = this.whiteLibraryInfo.whiteid;
+            form.rversion = this.whiteLibraryInfo.rversion;
+          }
+          api(form).then((data) => {
+            if (data.code === 0) {
+              this.whiteLibraryInfo.show = false;
+              this.searchList();
+              this.$Message.success(data.msg);
+            } else {
+              this.$Message.error(data.msg);
+            }
+          });
+        }
+      });
+    },
+    // 查看
+    toView(row) {
+      white_detail({ whiteid: row.whiteid }).then((res) => {
+        if (res.code === 0) {
+          this.viewInfo = {
+            show: true,
+            whiteid: res.obj.whiteid,
+            rversion: res.obj.rversion,
+            whiteName: res.obj.whiteName,
+            targetSchool: res.obj.targetSchool,
+            website: res.obj.website,
+            regionid: res.obj.regionid,
+            comm: res.obj.comm,
+            schools: res.obj.schools
+          };
+        } else {
+          this.$Message.error(res.msg);
+        }
+      });
+    },
+    // 编辑
+    toEdit(row) {
+      this.school_list = JSON.parse(JSON.stringify(this.curRegion));
+      white_detail({ whiteid: row.whiteid }).then((res) => {
+        if (res.code === 0) {
+          this.whiteLibraryInfo = {
+            show: true,
+            whiteid: res.obj.whiteid,
+            rversion: res.obj.rversion,
+            whiteName: res.obj.whiteName,
+            targetSchool: res.obj.targetSchool,
+            website: res.obj.website,
+            regionid: res.obj.regionid,
+            comm: res.obj.comm,
+            schoolids: []
+          };
+          if (this.whiteLibraryInfo.targetSchool === 2) {
+            //回显学校
+            this.select_schools = res.obj.schools.map((v) => {
+              //默认选择学校
+              this.getSelectSchool(this.school_list[0], v.schoolid, 1);
+              v.title = v.schoolName;
+              return v;
+            });
+          }
+        } else {
+          this.$Message.error(res.msg);
+        }
+      });
+    },
+    // 删除
+    toDel(row) {
+      this.$Modal.confirm({
+        title: "提示",
+        content: "您确定删除选中数据吗？",
+        onOk: () => {
+          white_delete({
+            whiteid: row.whiteid,
+            rversion: row.rversion
+          }).then((data) => {
+            if (data.code === 0) {
+              this.searchList();
+              this.$Message.success(data.msg);
+            } else {
+              this.$Message.error(data.msg);
+            }
+          });
+        },
+        onCancel: () => {}
+      });
+    }
+  }
 };
 </script>
 
-<style lang="less" scoped></style>
+<style lang="less" scoped>
+.search_header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin: 16px 16px;
+  .search_left {
+    display: flex;
+    justify-content: flex-start;
+    align-items: center;
+  }
+}
+.white {
+  .appcomm {
+    height: 20px;
+    line-height: 20px;
+    text-align: right;
+    color: #b8c2d9;
+    font-size: 14px;
+    .red {
+      display: inline-block;
+      margin: 0 4px;
+      color: #f0153f;
+    }
+  }
+  .targetSchool {
+    width: 100%;
+    height: 400px;
+    border: 1px solid #ced9f2;
+    border-radius: 8px;
+    margin-top: 10px;
+    display: flex;
+    .allSchool {
+      border-right: 1px solid #ced9f2;
+      width: 50%;
+      padding: 10px;
+      .school_list {
+        margin-top: 10px;
+        height: calc(100% - 42px);
+        overflow-y: auto;
+      }
+    }
+    .selectSchool {
+      width: 50%;
+      padding: 10px;
+      .school_num {
+        height: 32px;
+        display: flex;
+        align-items: center;
+        .num {
+          color: #339cff;
+          font-weight: bold;
+          margin: 0 2px;
+        }
+      }
+      .school_list {
+        margin-top: 10px;
+        height: calc(100% - 42px);
+        overflow-y: auto;
+        .school_item {
+          display: inline-block;
+          width: calc(50% - 10px);
+          height: 28px;
+          line-height: 28px;
+          border-radius: 6px;
+          font-size: 14px;
+          padding: 0 30px 0 10px;
+          margin-right: 10px;
+          margin-bottom: 10px;
+          background: #f3f4fc;
+          position: relative;
+          .title {
+            display: inline-block;
+            width: calc(100% - 10px);
+            white-space: nowrap;
+            text-overflow: ellipsis;
+            overflow: hidden;
+          }
+          .del {
+            width: 20px;
+            height: 20px;
+            object-fit: cover;
+            position: absolute;
+            right: 10px;
+            top: 4px;
+            cursor: pointer;
+          }
+        }
+      }
+    }
+  }
+}
+.view_title {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  margin-bottom: 16px;
+  font-size: 18px;
+  font-weight: bold;
+  text-align: center;
+  .wltype_1 {
+    margin-left: 10px;
+    padding: 0 10px;
+    line-height: 20px;
+    color: #fff;
+    font-weight: normal;
+    font-size: 12px;
+    border-radius: 4px;
+    background: #7854f6;
+  }
+  .wltype_2 {
+    margin-left: 10px;
+    padding: 0 10px;
+    line-height: 20px;
+    color: #fff;
+    font-weight: normal;
+    font-size: 12px;
+    border-radius: 4px;
+    background: #52c41a;
+  }
+}
+.name_slot {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  .name_content {
+    max-width: calc(100% - 38px);
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+  .app_tag {
+    margin-left: 4px;
+    width: 32px;
+    text-align: center;
+    color: #fff;
+    line-height: 1.6;
+    font-size: 12px;
+    border-radius: 5px;
+    background-color: #7854f6;
+  }
+  .web_tag {
+    margin-left: 4px;
+    width: 32px;
+    text-align: center;
+    color: #fff;
+    line-height: 1.6;
+    font-size: 12px;
+    border-radius: 5px;
+    background-color: #52c41a;
+  }
+}
+.white_address {
+  max-width: 100%;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+</style>

src/views/regionSection/networkManage/whitelistLibrary.vue

@@ -1,14 +1,421 @@
 <template>
-  <div class="main_root">白名单库</div>
+  <div class="main_root">
+    <div class="search_header">
+      <div class="search_left">
+        <Input
+          v-model="searchForm.aname"
+          placeholder="请输入名称"
+          search
+          @on-search="searchList()"
+          style="width: 150px"
+        />
+      </div>
+      <Button type="primary" class="primary_btn" @click="toAdd()">新建</Button>
+    </div>
+    <div class="table_wrap">
+      <Table :columns="columns" :data="searchForm.list">
+        <template slot-scope="{ row }" slot="nameSlot">
+          <div class="name_slot">
+            <div class="name_content" :title="row.name">{{ row.name }}</div>
+            <div v-if="row.wltype === 1" class="app_tag">APP</div>
+            <div v-else-if="row.wltype === 2" class="web_tag">网址</div>
+          </div>
+        </template>
+        <template slot-scope="{ row }" slot="whiteAddressSlot">
+          <div class="white_address" :title="row.whiteAddress">
+            {{ row.whiteAddress }}
+          </div>
+        </template>
+        <template slot-scope="{ row }" slot="actionSlot">
+          <div class="action_list">
+            <div @click="addwhite(row)">添加到白名单</div>
+          </div>
+        </template>
+      </Table>
+    </div>
+    <div class="page_wrap">
+      <Page
+        :transfer="true"
+        :total="searchForm.total"
+        :current="searchForm.page"
+        :page-size="searchForm.size"
+        :page-size-opts="[10, 20, 40, 60]"
+        @on-change="pageChange"
+        @on-page-size-change="pageSizeChange"
+        show-total
+        show-sizer
+      ></Page>
+    </div>
+    <!-- 新建/编辑 -->
+    <Modal
+      class="modal1"
+      :mask-closable="false"
+      v-model="whiteLibraryInfo.show"
+      :title="whiteLibraryInfo.whiteid ? '编辑' : '新建'"
+    >
+      <Form
+        v-if="whiteLibraryInfo.show"
+        ref="addForm"
+        :model="whiteLibraryInfo"
+        :rules="rules"
+        :label-width="90"
+        inline
+      >
+        <FormItem label="名称" prop="name" style="width: 100%">
+          <Input
+            v-model="whiteLibraryInfo.name"
+            placeholder="请输入名称"
+          ></Input>
+        </FormItem>
+        <FormItem label="类型" prop="wltype" style="width: 100%">
+          <RadioGroup v-model="whiteLibraryInfo.wltype">
+            <Radio :label="1">APP</Radio>
+            <Radio :label="2">网址</Radio>
+          </RadioGroup>
+        </FormItem>
+        <template v-if="whiteLibraryInfo.wltype === 1">
+          <FormItem
+            label="版本名称"
+            prop="versionname"
+            style="width: calc(50% - 10px)"
+          >
+            <Input
+              v-model="whiteLibraryInfo.versionname"
+              placeholder="请输入版本名称"
+            ></Input>
+          </FormItem>
+          <FormItem label="包名" prop="website" style="width: calc(50% - 10px)">
+            <Input
+              v-model="whiteLibraryInfo.website"
+              placeholder="请输入包名"
+            ></Input>
+          </FormItem>
+        </template>
+        <FormItem label="简介" prop="comm" style="width: 100%">
+          <Input
+            v-model="whiteLibraryInfo.comm"
+            placeholder="请输入简介"
+          ></Input>
+        </FormItem>
+        <FormItem label="网址" prop="whiteAddress" style="width: 100%">
+          <Input
+            type="textarea"
+            v-model="whiteLibraryInfo.whiteAddress"
+            placeholder="请填写正确的IP地址或者域名，多个IP或域名之间用英文分号隔开"
+          ></Input>
+          <div style="color: #7c8db5">
+            说明：IP例如：192.168.1.200或者192.168.1.200/24，域名例如：new.iflytek.com
+          </div>
+        </FormItem>
+      </Form>
+      <div slot="footer">
+        <Button @click="whiteLibraryInfo.show = false">取消</Button>
+        <Button @click="saveAddInfo()" type="primary">保存</Button>
+      </div>
+    </Modal>
+    <!-- 查看 -->
+    <Modal
+      class="modal1"
+      :mask-closable="false"
+      v-model="viewInfo.show"
+      title="查看"
+    >
+      <div class="view_title">
+        <div>{{ viewInfo.name }}</div>
+        <div v-if="viewInfo.wltype === 1" class="wltype_1">APP</div>
+        <div v-if="viewInfo.wltype === 2" class="wltype_2">网址</div>
+      </div>
+      <Form :label-width="80" inline>
+        <template v-if="viewInfo.wltype === 1">
+          <FormItem
+            label="版本名称"
+            style="margin-bottom: 0; width: calc(50% - 10px)"
+            >{{ viewInfo.versionname }}</FormItem
+          >
+          <FormItem
+            label="包名"
+            style="margin-bottom: 0; width: calc(50% - 10px)"
+            >{{ viewInfo.website }}</FormItem
+          >
+        </template>
+        <FormItem label="简介" style="margin-bottom: 0; width: 100%">{{
+          viewInfo.comm
+        }}</FormItem>
+        <FormItem label="网址" style="margin-bottom: 0; width: 100%">{{
+          viewInfo.whiteAddress
+        }}</FormItem>
+      </Form>
+      <div slot="footer" style="text-align: center">
+        <Button @click="viewInfo.show = false">关闭</Button>
+      </div>
+    </Modal>
+  </div>
 </template>
 
 <script>
+import {
+  whiteLibrary_list,
+  whiteLibrary_add,
+  whiteLibrary_edit,
+  whiteLibrary_delete, whiteLibrary_add_white
+} from "@/api/whiteLibrary";
 export default {
   data() {
-    return {};
+    return {
+      searchForm: {
+        name: "",
+        page: 1,
+        size: 10,
+        list: [],
+        total: 0
+      },
+      rules: {
+        name: [
+          {
+            required: true,
+            message: "请输入名称",
+            trigger: "change"
+          }
+        ],
+        wltype: [
+          {
+            required: true,
+            type: "number",
+            message: "请选择状态",
+            trigger: "change"
+          }
+        ],
+        versionname: [
+          {
+            required: true,
+            message: "请输入版本名称",
+            trigger: "change"
+          }
+        ]
+      },
+      // 新建/编辑
+      whiteLibraryInfo: {
+        show: false,
+        whiteid: null,
+        rversion: null,
+        name: "",
+        // 1app 2网页
+        wltype: 1,
+        website: "",
+        versionname: "",
+        comm: "",
+        whiteAddress: ""
+      },
+      // 查看
+      viewInfo: {
+        show: false,
+        name: "",
+        // 1app 2网页
+        wltype: 1,
+        website: "",
+        versionname: "",
+        comm: "",
+        whiteAddress: ""
+      },
+      userInfo: {},
+      columns: [
+        {
+          title: "序号",
+          align: "center",
+          width: 70,
+          render: (h, params) => {
+            return h(
+              "span",
+              params.index +
+                (this.searchForm.page - 1) * this.searchForm.size +
+                1
+            );
+          }
+        },
+        {
+          title: "应用名称",
+          slot: "nameSlot",
+          align: "center"
+        },
+        {
+          title: "版本名称",
+          key: "versionName",
+          align: "center"
+        },
+        {
+          title: "版本号",
+          key: "rversion",
+          align: "center"
+        },
+        {
+          title: "包名",
+          key: "website",
+          align: "center"
+        },
+        {
+          title: "操作人",
+          key: "updatename",
+          width: 140,
+          align: "center"
+        },
+        {
+          title: "操作时间",
+          key: "updatetime",
+          width: 190,
+          align: "center"
+        },
+        {
+          title: "操作",
+          slot: "actionSlot",
+          width: 180,
+          align: "center"
+        }
+      ]
+    };
   },
-  methods: {}
+  created() {
+    this.userInfo = JSON.parse(
+      localStorage.getItem("xh_control_userInfo")
+    ).content;
+    this.searchList();
+  },
+  methods: {
+    // 搜索
+    searchList() {
+      this.searchForm.page = 1;
+      this.getList();
+    },
+    // 页码改变
+    pageChange(page) {
+      this.searchForm.page = page;
+      this.getList();
+    },
+    // 每页显示数量改变
+    pageSizeChange(size) {
+      this.searchForm.size = size;
+      this.searchForm.page = 1;
+      this.getList();
+    },
+    // 获取列表
+    getList() {
+      whiteLibrary_list({
+        page: this.searchForm.page,
+        size: this.searchForm.size,
+        name: this.searchForm.name
+      }).then((data) => {
+        if (data.code === 0) {
+          this.searchForm.list = data.obj.data;
+          console.log(this.searchForm.list);
+          this.searchForm.total = data.obj.total;
+        } else {
+          this.$Message.error(data.msg);
+        }
+      });
+    },
+    // 添加到白名单
+    addwhite(row) {
+      this.$Modal.confirm({
+        title: "提示",
+        content:
+          '确定要将 "<span style="color: #339dff">' +
+          row.name +
+          '</span>" 加到白名单？',
+        onOk: () => {
+          whiteLibrary_add_white({
+            wlid: row.wlid,
+            regionid: this.userInfo.regionid
+          }).then((data) => {
+            if (data.code === 0) {
+              this.searchList();
+              this.$Message.success(data.msg);
+            } else {
+              this.$Message.error(data.msg);
+            }
+          });
+        },
+        onCancel: () => {}
+      });
+    }
+  }
 };
 </script>
 
-<style lang="less" scoped></style>
+<style lang="less" scoped>
+.search_header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin: 16px 16px;
+  .search_left {
+    display: flex;
+    justify-content: flex-start;
+    align-items: center;
+  }
+}
+.view_title {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  margin-bottom: 16px;
+  font-size: 18px;
+  font-weight: bold;
+  text-align: center;
+  .wltype_1 {
+    margin-left: 10px;
+    padding: 0 10px;
+    line-height: 20px;
+    color: #fff;
+    font-weight: normal;
+    font-size: 12px;
+    border-radius: 4px;
+    background: #7854f6;
+  }
+  .wltype_2 {
+    margin-left: 10px;
+    padding: 0 10px;
+    line-height: 20px;
+    color: #fff;
+    font-weight: normal;
+    font-size: 12px;
+    border-radius: 4px;
+    background: #52c41a;
+  }
+}
+.name_slot {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  .name_content {
+    max-width: calc(100% - 38px);
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+  .app_tag {
+    margin-left: 4px;
+    width: 32px;
+    text-align: center;
+    color: #fff;
+    line-height: 1.6;
+    font-size: 12px;
+    border-radius: 5px;
+    background-color: #7854f6;
+  }
+  .web_tag {
+    margin-left: 4px;
+    width: 32px;
+    text-align: center;
+    color: #fff;
+    line-height: 1.6;
+    font-size: 12px;
+    border-radius: 5px;
+    background-color: #52c41a;
+  }
+}
+.white_address {
+  max-width: 100%;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+</style>