From 18688e9d36b2d75efa79a9b0a7a8b1b44fdee6bd Mon Sep 17 00:00:00 2001
From: wl <173@qq.com>
Date: 星期二, 01 十一月 2022 16:08:43 +0800
Subject: [PATCH] Merge branch 'master' of http://42.193.1.25:9521/r/sccg_ui into master

---
 src/views/systemSetting/device/loudspeaker/components/dialogForm.vue            |  256 ++++
 src/views/operate/rectification/surveyList/components/createInterface/index.vue |  550 +++++----
 src/views/operate/rectification/surveyList/components/viewInterface/index.vue   |  488 ++++----
 src/store/index.js                                                              |   23 
 src/views/systemSetting/device/loudspeaker/index.vue                            |  358 ++++++
 src/views/operate/rectification/surveyList/index.vue                            |  608 ++++++-----
 src/store/system/handheldTerminal/index.js                                      |   18 
 src/views/systemSetting/device/handheldTerminal/index.vue                       |  368 +++++++
 src/router/index.js                                                             |   11 
 src/views/layout/components/Menu/index.vue                                      |    1 
 src/store/system/loudspeaker/index.js                                           |   18 
 src/api/system/handheldTerminal.js                                              |   37 
 src/api/system/loudspeaker.js                                                   |   37 
 src/views/systemSetting/device/handheldTerminal/components/dialogForm.vue       |  331 ++++++
 14 files changed, 2,355 insertions(+), 749 deletions(-)

diff --git a/src/api/system/handheldTerminal.js b/src/api/system/handheldTerminal.js
new file mode 100644
index 0000000..d9f0e8c
--- /dev/null
+++ b/src/api/system/handheldTerminal.js
@@ -0,0 +1,37 @@
+import axios from "axios";
+import {
+    getToken
+} from '@/utils/helper'
+const baseUrl = '/sccg/equipment_handheld_terminal'
+const token = {
+    'Authorization': getToken()
+}
+export default {
+    // 鑾峰彇鍒楄〃
+    getHandheldTerminalList: (data) => axios({
+        method: 'get',
+        url: baseUrl + '/query',
+        headers: {
+            ...token
+        },
+        params: data
+    }),
+    // 鏂板
+    saveHandheldTerminal: (data) => axios({
+        method: 'post',
+        url: baseUrl + '/add',
+        headers: {
+            ...token
+        },
+        data: data
+    }),
+    // 鏂板
+    updateHandheldTerminal: (data) => axios({
+        method: 'put',
+        url: baseUrl + '/update',
+        headers: {
+            ...token
+        },
+        data: data
+    })
+};
\ No newline at end of file
diff --git a/src/api/system/loudspeaker.js b/src/api/system/loudspeaker.js
new file mode 100644
index 0000000..11c5e47
--- /dev/null
+++ b/src/api/system/loudspeaker.js
@@ -0,0 +1,37 @@
+import axios from "axios";
+import {
+    getToken
+} from '@/utils/helper'
+const baseUrl = '/sccg/equipment_loudspeaker'
+const token = {
+    'Authorization': getToken()
+}
+export default {
+    // 鑾峰彇鍒楄〃
+    getLoudspeakerList: (data) => axios({
+        method: 'get',
+        url: baseUrl + '/query',
+        headers: {
+            ...token
+        },
+        params: data
+    }),
+    // 鏂板
+    saveLoudspeaker: (data) => axios({
+        method: 'post',
+        url: baseUrl + '/add',
+        headers: {
+            ...token
+        },
+        data: data
+    }),
+    // 鏂板
+    updateLoudspeaker: (data) => axios({
+        method: 'put',
+        url: baseUrl + '/update',
+        headers: {
+            ...token
+        },
+        data: data
+    })
+};
\ No newline at end of file
diff --git a/src/router/index.js b/src/router/index.js
index 5bddef6..1987346 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -84,6 +84,17 @@
                 path: 'point',
                 name: 'point',
                 component: () => import('@/views/systemSetting/device/point'),
+              },
+              {
+                path: 'handheldTerminal',
+                name: 'handheldTerminal',
+                component: () => import('@/views/systemSetting/device/handheldTerminal'),
+              }
+              ,
+              {
+                path: 'loudspeaker',
+                name: 'loudspeaker',
+                component: () => import('@/views/systemSetting/device/loudspeaker'),
               }
             ]
           }
diff --git a/src/store/index.js b/src/store/index.js
index 6a2d4a6..c271a66 100644
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -3,19 +3,22 @@
 import users from "./users"
 import logs from "./logs"
 import bayonet from './system/bayonet'
+import loudspeaker from './system/loudspeaker'
+import handheldTerminal from './system/handheldTerminal'
 import shortMessage from './operate/managenment/shortMessage'
 Vue.use(Vuex)
 
 export default new Vuex.Store({
-  state: {
-  },
-  getters: {
-  },
-  mutations: {
-  },
-  actions: {
-  },
+  state: {},
+  getters: {},
+  mutations: {},
+  actions: {},
   modules: {
-    users,logs,bayonet,shortMessage
+    users,
+    logs,
+    bayonet,
+    shortMessage,
+    loudspeaker,
+    handheldTerminal
   }
-})
+})
\ No newline at end of file
diff --git a/src/store/system/handheldTerminal/index.js b/src/store/system/handheldTerminal/index.js
new file mode 100644
index 0000000..2f447bb
--- /dev/null
+++ b/src/store/system/handheldTerminal/index.js
@@ -0,0 +1,18 @@
+import handheldTerminalApi from "@/api/system/handheldTerminal";
+export default {
+    namespaced: true,
+    state: {
+        userInfo: {},
+    },
+    actions: {
+        getHandheldTerminalList(context, params) {
+            return handheldTerminalApi.getHandheldTerminalList(params);
+        },
+        saveHandheldTerminal(context, params) {
+            return handheldTerminalApi.saveHandheldTerminal(params);
+        },
+        updateHandheldTerminal(context, params) {
+            return handheldTerminalApi.updateHandheldTerminal(params);
+        },
+    },
+};
\ No newline at end of file
diff --git a/src/store/system/loudspeaker/index.js b/src/store/system/loudspeaker/index.js
new file mode 100644
index 0000000..3dc7ab2
--- /dev/null
+++ b/src/store/system/loudspeaker/index.js
@@ -0,0 +1,18 @@
+import loudspeakerApi from "@/api/system/loudspeaker";
+export default {
+    namespaced: true,
+    state: {
+        userInfo: {},
+    },
+    actions: {
+        getLoudspeakerList(context, params) {
+            return loudspeakerApi.getLoudspeakerList(params);
+        },
+        saveLoudspeaker(context, params) {
+            return loudspeakerApi.saveLoudspeaker(params);
+        },
+        updateLoudspeaker(context, params) {
+            return loudspeakerApi.updateLoudspeaker(params);
+        },
+    },
+};
\ No newline at end of file
diff --git a/src/views/layout/components/Menu/index.vue b/src/views/layout/components/Menu/index.vue
index 6c339eb..3599b9d 100644
--- a/src/views/layout/components/Menu/index.vue
+++ b/src/views/layout/components/Menu/index.vue
@@ -82,7 +82,6 @@
       if (info && info.menus) {
         clearTimeout(timer);
         this.menuList = info.menus;
-        console.log(info.menus);
       } else {
         timer = setInterval(() => {
           this.loadMenu();
diff --git a/src/views/operate/rectification/surveyList/components/createInterface/index.vue b/src/views/operate/rectification/surveyList/components/createInterface/index.vue
index 1be774b..57dd333 100644
--- a/src/views/operate/rectification/surveyList/components/createInterface/index.vue
+++ b/src/views/operate/rectification/surveyList/components/createInterface/index.vue
@@ -1,260 +1,322 @@
 <template>
-    <div class="createmyInterface">
-        <main>
-            <div class="mainContent">
-                <el-form ref="user" label-width="140px" autoComplete="on" :model="myInterface"
-                    :rules="createmyInterfaceRules" label-position="right">
-                    <!-- 搴旂敤鍚嶇О -->
-                    <el-form-item label="搴旂敤鍚嶇О:" prop="applicationName">
-                        <el-input v-model="myInterface.applicationName" placeholder="濉啓搴旂敤鍚嶇О"></el-input>
-                    </el-form-item>
-                    <!-- 搴旂敤鍥炬爣 -->
-                    <el-form-item label="搴旂敤鍥炬爣:" prop="applicationIconUrl">
-                        <div class="iconBox">
-                            <div class="upload">
-                                <img src="@/assets/imgs/user/default-avatar.jpg" alt="">
-                            </div>
-                            <div class="iconView">
-                                <span>绀烘剰鍥�</span>
-                                <img src="@/assets/imgs/user/default-avatar.jpg" alt="">
-                            </div>
-                            <div class="tip">
-                                <span>鍙厑璁镐笂浼爅pg,jpeg,png,svg鏍煎紡鐨勫浘鐗囷紝寤鸿灏哄涓�105px*105px</span>
-                            </div>
-                        </div>
-                    </el-form-item>
-                    <!-- 搴旂敤绫诲瀷 -->
-                    <el-form-item label="搴旂敤绫诲瀷:" prop="applicationType">
-                        <div class="optionItem">
-                            <el-radio-group v-model="myInterface.applicationType">
-                                <el-radio :label="1">缃戦〉搴旂敤</el-radio>
-                            </el-radio-group>
-                        </div>
-                    </el-form-item>
-                    <!--缃戠珯url  -->
-                    <el-form-item label="缃戠珯url:" prop="websiteUrl">
-                        <el-input v-model="myInterface.websiteUrl"></el-input>
-                    </el-form-item>
-                    <!-- 搴旂敤鎻忚堪 -->
-                    <el-form-item label="搴旂敤鎻忚堪:" prop="description">
-                        <el-input v-model="myInterface.description" placeholder="璇峰～鍐欐弿杩�"></el-input>
-                    </el-form-item>
-                    <!-- 鎸夐挳 -->
-                    <el-form-item>
-                        <div class="optionBtn">
-                            <el-button type="primary" class="btn submit" @click.native.prevent="handleUser">鎻愪氦
-                            </el-button>
-                            <el-button class="btn reset">閲嶇疆</el-button>
-                        </div>
-                    </el-form-item>
-                </el-form>
+  <div class="createmyInterface">
+    <main>
+      <div class="mainContent">
+        <el-form
+          ref="survey"
+          label-width="140px"
+          autoComplete="on"
+          :model="myInterface"
+          :rules="createSurvey"
+          label-position="right"
+        >
+          <el-form-item class="optionItem" label="闂绫诲瀷:" prop="type">
+            <el-select v-model="myInterface.type" placeholder="璇烽�夋嫨闂绫诲瀷">
+              <el-option label="闂绫诲瀷涓�" value="shanghai"></el-option>
+              <el-option label="闂绫诲瀷浜�" value="beijing"></el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item class="optionItem" label="澶х被:" prop="bigclass">
+            <el-select v-model="myInterface.bigclass" placeholder="璇烽�夋嫨澶х被">
+              <el-option label="澶х被涓�" value="shanghai"></el-option>
+              <el-option label="澶х被浜�" value="beijing"></el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item class="optionItem" label="灏忕被:" prop="subclass">
+            <el-select v-model="myInterface.subclass" placeholder="璇烽�夋嫨灏忕被">
+              <el-option label="灏忕被涓�" value="shanghai"></el-option>
+              <el-option label="灏忕被浜�" value="beijing"></el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item class="optionItem" label="琛楅亾:" prop="street">
+            <el-input
+              v-model="myInterface.street"
+              placeholder="璇峰～鍐欒閬�"
+            ></el-input>
+          </el-form-item>
+          <el-form-item class="optionItem" label="绀惧尯:" prop="community">
+            <el-input
+              v-model="myInterface.community"
+              placeholder="璇峰～鍐欑ぞ鍖�"
+            ></el-input>
+          </el-form-item>
+          <el-form-item class="optionItem" label="浠诲姟鎻忚堪:" prop="task">
+            <el-input
+              v-model="myInterface.task"
+              placeholder="璇峰～鍐欎换鍔℃弿杩�"
+            ></el-input>
+          </el-form-item>
+          <el-form-item class="optionItem" label="涓婃姤鏃堕棿:" prop="reportTime">
+            <div class="block">
+              <el-date-picker
+                v-model="myInterface.reportTime"
+                type="datetime"
+                placeholder="閫夋嫨鏃ユ湡鏃堕棿"
+              >
+              </el-date-picker>
             </div>
-        </main>
-    </div>
+          </el-form-item>
+          <el-form-item>
+            <div class="optionBtn">
+              <el-button class="btn cancel" @click.native.prevent="handleCancel"
+                >鍙栨秷</el-button
+              >
+              <el-button
+                type="primary"
+                class="btn submit"
+                @click.native.prevent="handleSave"
+                >淇濆瓨
+              </el-button>
+            </div>
+          </el-form-item>
+        </el-form>
+      </div>
+    </main>
+  </div>
 </template>
 <script>
 export default {
-    data() {
-        const validateApplicationName = (rule, value, callback) => {
-            if (!value) {
-                callback(new Error("璇峰～鍐欑敤鎴峰悕绉�"));
-            }
-        };
-        const validateApplicationIconUrl = (rule, value, callback) => {
-            if (!value) {
-                callback(new Error("璇峰～鍐欑櫥褰曞瘑鐮�"));
-            } else {
-                const rep = /^\w+$/;
-                if (!rep.test(value)) {
-                    callback(new Error("瀵嗙爜鍙兘鏄互鏁板瓧銆�26涓嫳鏂囧瓧姣嶆垨鑰呬笅鍒掔嚎缁勬垚鐨勫瓧绗︿覆"));
-                }
-            }
-        };
-        const validateApplicationType = (rule, value, callback) => {
-            if (!value) {
-                callback(new Error("璇峰～鍐欑敤鎴峰鍚�"));
-            } else {
-                const rep = /^[\u4E00-\u9FA5]{2,4}$/;
-                if (!rep.test(value)) {
-                    callback("璇疯緭鍏ユ纭殑鐢ㄦ埛濮撳悕");
-                }
-            }
-        };
-        const validatePhone = (rule, value, callback) => {
-            if (!value) {
-                callback(new Error("璇峰～鍐欐墜鏈哄彿鐮�"));
-            } else {
-                const rep = /(^1[3|4|5|7|8|9]\d{9}$)|(^09\d{8}$)/
-                if (!rep.test(value)) {
-                    callback("璇疯緭鍏ユ纭殑鎵嬫満鍙风爜");
-                }
-            }
-        };
-        return {
-            myInterface: {
-            },
-            createmyInterfaceRules: {
-                applicationName: [
-                    { required: true, trigger: "blur", validator: validateApplicationName},
-                ],
-                applicationIconUrl: [
-                    { required: true, trigger: "blur", validator: validateApplicationIconUrl },
-                ],
-                applicationType: [
-                    { required: true, trigger: "blur", validator: validateApplicationType },
-                ],
-                websiteUrl: [
-                    { required: true, trigger: "blur" },
-                ],
-                description: [
-                    { required: false, trigger: "blur" },
-                ],
-            },
-        }
+  data() {
+    const validateType = (rule, value, callback) => {
+      if (!value) {
+        callback(new Error("璇烽�夋嫨闂绫诲瀷"));
+      }
+    };
+    const validateBigClass = (rule, value, callback) => {
+      if (!value) {
+        callback(new Error("璇烽�夋嫨澶х被"));
+      }
+    };
+    const validateSubClass = (rule, value, callback) => {
+      if (!value) {
+        callback(new Error("璇烽�夋嫨灏忕被"));
+      }
+    };
+    const validateStreet = (rule, value, callback) => {
+      if (!value) {
+        callback(new Error("璇峰～鍐欒閬�"));
+      }
+    };
+    const validateCommunity = (rule, value, callback) => {
+      if (!value) {
+        callback(new Error("璇峰～鍐欑ぞ鍖�"));
+      }
+    };
+    const validateTask = (rule, value, callback) => {
+      if (!value) {
+        callback(new Error("璇峰～鍐欎换鍔℃弿杩�"));
+      }
+    };
+    const validateReportTime = (rule, value, callback) => {
+      if (!value) {
+        callback(new Error("璇烽�夋嫨浠诲姟涓婃姤鏃堕棿"));
+      }
+    };
+
+    return {
+      myInterface: {
+        num: "",
+        type: "",
+        bigclass: "",
+        subclass: "",
+        street: "",
+        community: "",
+        task: "",
+        reportTime: "",
+      },
+      createSurvey: {
+        type: [
+          {
+            required: true,
+            trigger: "blur",
+            validator: validateType,
+          },
+        ],
+        bigclass: [
+          {
+            required: true,
+            trigger: "blur",
+            validator: validateBigClass,
+          },
+        ],
+        subclass: [
+          {
+            required: true,
+            trigger: "blur",
+            validator: validateSubClass,
+          },
+        ],
+        street: [
+          { required: true, trigger: "blur", validator: validateStreet },
+        ],
+        community: [
+          { required: true, trigger: "blur", validator: validateCommunity },
+        ],
+        task: [{ required: true, trigger: "blur", validator: validateTask }],
+        reportTime: [
+          { required: true, trigger: "blur", validator: validateReportTime },
+        ],
+      },
+    };
+  },
+  created() {
+    const that = this;
+  },
+  methods: {
+    // 鍏抽棴寮圭獥
+    handleCancel() {
+        console.log(1);
+      this.$emit("closeDialog", { flag: false, index: 0 });
     },
-    created() {
-        const that = this;
+    //淇濆瓨
+    handleSave() {
+      const { myInterface } = this;
+        this.$refs.survey.validate((flag)=>{
+            console.log(flag)
+            if(flag){
+
+            }else{
+                return false
+            }
+        })
+    //   this.$axios
+    //     .post("sccg/system/portal/thirdApp/add", {
+    //       websiteUrl: myInterface.websiteUrl,
+    //       applicationIconUrl: myInterface.applicationIconUrl,
+    //       applicationType: 0,
+    //       description: myInterface.description,
+    //       applicationName: myInterface.applicationName,
+    //     })
+    //     .then((res) => {
+    //       console.log(res);
+    //       // if (res.code === 200) {
+    //       //     this.refresh();
+    //       // }
+    //     });
     },
-    methods: {
-        handleUser() {
-            const { myInterface } = this;
-            this.$axios.post('sccg/system/portal/thirdApp/add', {
-                websiteUrl:myInterface.websiteUrl,
-                applicationIconUrl:myInterface.applicationIconUrl,
-                applicationType:0,
-                description:myInterface.description,
-                applicationName:myInterface.applicationName
-            }).then(res => {
-                console.log(res);
-                // if (res.code === 200) {
-                //     this.refresh();
-                // }
-            })
-        },
-    },
-    props: ['refresh']
-}
+  },
+  props: ['refresh','closeDialog'],
+};
 </script>
 <style lang="scss" scoped>
 .createmyInterface {
-    border-radius: 1px;
+  border-radius: 1px;
+  background-color: #09152f;
+
+  main {
+    text-align: left;
+    padding: 0 55px;
     background-color: #09152f;
+    padding-bottom: 50px;
+    .mainContent {
+      display: flex;
+      justify-content: center;
+      padding-top: 50px;
 
-    main {
-        text-align: left;
-        padding: 0 55px;
-        background-color: #09152f;
-        padding-bottom: 50px;
-        .mainContent {
-            display: flex;
-            justify-content: center;
-            padding-top: 50px;
-
-            .iconBox {
-                display: flex;
-
-                .upload {
-                    display: flex;
-                    align-items: flex-end;
-
-                    img {
-                        width: 120px;
-                        height: 120px;
-                        border-radius: 4px;
-                    }
-                }
-
-                .iconView {
-                    display: flex;
-                    flex-direction: column;
-                    margin-left: 30px;
-                    justify-content: flex-end;
-
-                    img {
-                        width: 70px;
-                        height: 70px;
-                        border-radius: 4px;
-                    }
-                }
-
-                .tip {
-                    display: flex;
-                    align-items: flex-end;
-                    margin-left: 30px;
-                    font-size: 12px;
-
-                    span {
-                        line-height: 20px;
-                    }
-                }
-            }
-            .optionBtn{
-                margin-top: 30px;
-                &::v-deep .el-button{
-                    padding: 12px 40px;
-                }
-                .reset{
-                    border: 1px solid #0079fe;
-                    color: #0079fe;
-                }
-            }
-            &::v-deep .el-form-item__label {
-                color: #4b9bb7;
-            }
-
-            &::v-deep .el-input__inner {
-                background-color: #09152f;
-                border: 1px solid #17324c;
-            }
-
-            .addPerson {
-                display: flex;
-                list-style: none;
-                padding: 0;
-
-                li {
-                    background-color: #cccccc;
-                    width: 36px;
-                    height: 36px;
-                    border-radius: 50%;
-                    color: #fff;
-                    text-align: center;
-                    font-size: 30px;
-                    margin-left: 10px;
-                }
-            }
-
-            .el-form-item__content {
-                width: 400px;
-
-                .el-select {
-                    width: 100%;
-                }
-            }
-
-            .optionHandleSp {
-                display: flex;
-
-                .areaNumber,
-                .moreNumber {
-                    flex: 1;
-                }
-
-                .telNumber {
-                    flex: 2;
-                }
-            }
-
-        }
-    }
-
-    footer {
-        border-top: 1px solid #fff;
-        height: 80px;
+      .iconBox {
         display: flex;
-        align-items: center;
-        justify-content: flex-end;
-        padding-right: 20px;
+
+        .upload {
+          display: flex;
+          align-items: flex-end;
+
+          img {
+            width: 120px;
+            height: 120px;
+            border-radius: 4px;
+          }
+        }
+
+        .iconView {
+          display: flex;
+          flex-direction: column;
+          margin-left: 30px;
+          justify-content: flex-end;
+
+          img {
+            width: 70px;
+            height: 70px;
+            border-radius: 4px;
+          }
+        }
+
+        .tip {
+          display: flex;
+          align-items: flex-end;
+          margin-left: 30px;
+          font-size: 12px;
+
+          span {
+            line-height: 20px;
+          }
+        }
+      }
+      .optionBtn {
+        margin-top: 30px;
+        &::v-deep .el-button {
+          padding: 12px 40px;
+        }
+        .reset {
+          border: 1px solid #0079fe;
+          color: #0079fe;
+        }
+      }
+      &::v-deep .el-form-item__label {
+        color: #4b9bb7;
+      }
+
+      &::v-deep .el-input__inner {
+        background-color: #09152f;
+        border: 1px solid #17324c;
+      }
+
+      .addPerson {
+        display: flex;
+        list-style: none;
+        padding: 0;
+
+        li {
+          background-color: #cccccc;
+          width: 36px;
+          height: 36px;
+          border-radius: 50%;
+          color: #fff;
+          text-align: center;
+          font-size: 30px;
+          margin-left: 10px;
+        }
+      }
+
+      .el-form-item__content {
+        width: 400px;
+
+        .el-select {
+          width: 100%;
+        }
+      }
+
+      .optionHandleSp {
+        display: flex;
+
+        .areaNumber,
+        .moreNumber {
+          flex: 1;
+        }
+
+        .telNumber {
+          flex: 2;
+        }
+      }
     }
+  }
+
+  footer {
+    border-top: 1px solid #fff;
+    height: 80px;
+    display: flex;
+    align-items: center;
+    justify-content: flex-end;
+    padding-right: 20px;
+  }
 }
 </style>
\ No newline at end of file
diff --git a/src/views/operate/rectification/surveyList/components/viewInterface/index.vue b/src/views/operate/rectification/surveyList/components/viewInterface/index.vue
index 6b28ebb..286fcf4 100644
--- a/src/views/operate/rectification/surveyList/components/viewInterface/index.vue
+++ b/src/views/operate/rectification/surveyList/components/viewInterface/index.vue
@@ -1,246 +1,272 @@
 <template>
-    <div class="createmyInterface">
-        <main>
-            <div class="mainContent">
-                <el-form ref="user" label-width="140px" autoComplete="on" :model="myInterface"
-                    :rules="createmyInterfaceRules" label-position="right">
-                    <!-- 搴旂敤鍚嶇О -->
-                    <el-form-item label="搴旂敤鍚嶇О:" prop="applicationName">
-                        <el-input v-model="myInterface.applicationName" placeholder="濉啓搴旂敤鍚嶇О"></el-input>
-                    </el-form-item>
-                    <!-- 搴旂敤鍥炬爣 -->
-                    <el-form-item label="搴旂敤鍥炬爣:" prop="applicationIconUrl">
-                        <div class="iconBox">
-                            <div class="upload">
-                                <img src="@/assets/imgs/user/default-avatar.jpg" alt="">
-                            </div>
-                            <div class="iconView">
-                                <span>绀烘剰鍥�</span>
-                                <img src="@/assets/imgs/user/default-avatar.jpg" alt="">
-                            </div>
-                            <div class="tip">
-                                <span>鍙厑璁镐笂浼爅pg,jpeg,png,svg鏍煎紡鐨勫浘鐗囷紝寤鸿灏哄涓�105px*105px</span>
-                            </div>
-                        </div>
-                    </el-form-item>
-                    <!-- 搴旂敤绫诲瀷 -->
-                    <el-form-item label="搴旂敤绫诲瀷:" prop="applicationType">
-                        <div class="optionItem">
-                            <el-radio-group v-model="myInterface.applicationType">
-                                <el-radio :label="1">缃戦〉搴旂敤</el-radio>
-                            </el-radio-group>
-                        </div>
-                    </el-form-item>
-                    <!--缃戠珯url  -->
-                    <el-form-item label="缃戠珯url:" prop="websiteUrl">
-                        <el-input v-model="myInterface.websiteUrl"></el-input>
-                    </el-form-item>
-                    <!-- 搴旂敤鎻忚堪 -->
-                    <el-form-item label="搴旂敤鎻忚堪:" prop="description">
-                        <el-input v-model="myInterface.description" placeholder="璇峰～鍐欐弿杩�"></el-input>
-                    </el-form-item>
-                    <!-- 鎸夐挳 -->
-                    <!-- <el-form-item>
-                        <div class="optionBtn">
-                            <el-button type="primary" class="btn submit" @click.native.prevent="handleUser">鎻愪氦
-                            </el-button>
-                            <el-button class="btn reset">閲嶇疆</el-button>
-                        </div>
-                    </el-form-item> -->
-                </el-form>
-            </div>
-        </main>
-    </div>
+  <div class="createmyInterface">
+    <main>
+      <div class="mainContent">
+        <el-form
+          ref="user"
+          label-width="140px"
+          autoComplete="on"
+          :model="myInterface"
+          :rules="createUserRules"
+          label-position="right"
+        >
+          <el-form-item class="optionItem" label="浠诲姟缂栧彿:" prop="num">
+            <el-input
+              v-model="myInterface.num"
+              placeholder="璇峰～鍐欎换鍔＄紪鍙�"
+              disabled
+            ></el-input>
+          </el-form-item>
+          <el-form-item class="optionItem" label="闂绫诲瀷:" prop="type">
+            <el-input
+              v-model="myInterface.type"
+              placeholder="璇烽�夋嫨闂绫诲瀷"
+              disabled
+            ></el-input>
+          </el-form-item>
+          <el-form-item class="optionItem" label="澶х被:" prop="bigclass">
+            <el-input
+              v-model="myInterface.bigclass"
+              placeholder="璇烽�夋嫨澶х被"
+              disabled
+            ></el-input>
+          </el-form-item>
+          <el-form-item class="optionItem" label="灏忕被:" prop="subclass">
+            <el-input
+              v-model="myInterface.subclass"
+              placeholder="璇烽�夋嫨灏忕被"
+              disabled
+            ></el-input>
+          </el-form-item>
+          <el-form-item class="optionItem" label="琛楅亾:" prop="street">
+            <el-input
+              v-model="myInterface.street"
+              placeholder="璇峰～鍐欒閬�"
+              disabled
+            ></el-input>
+          </el-form-item>
+          <el-form-item class="optionItem" label="绀惧尯:" prop="community">
+            <el-input
+              v-model="myInterface.community"
+              placeholder="璇峰～鍐欑ぞ鍖�"
+              disabled
+            ></el-input>
+          </el-form-item>
+          <el-form-item class="optionItem" label="浠诲姟鎻忚堪:" prop="task">
+            <el-input
+              v-model="myInterface.task"
+              placeholder="璇峰～鍐欎换鍔℃弿杩�"
+              disabled
+            ></el-input>
+          </el-form-item>
+          <el-form-item class="optionItem" label="涓婃姤鏃堕棿:" prop="reportTime">
+            <el-input
+              v-model="myInterface.reportTime"
+              placeholder="璇烽�夋嫨涓婃姤鏃堕棿"
+              disabled
+            ></el-input>
+          </el-form-item>
+        </el-form>
+      </div>
+    </main>
+  </div>
 </template>
 <script>
 export default {
-    data() {
-        const validateApplicationName = (rule, value, callback) => {
-            if (!value) {
-                callback(new Error("璇峰～鍐欑敤鎴峰悕绉�"));
-            }
-        };
-        const validateApplicationIconUrl = (rule, value, callback) => {
-            if (!value) {
-                callback(new Error("璇峰～鍐欑櫥褰曞瘑鐮�"));
-            } else {
-                const rep = /^\w+$/;
-                if (!rep.test(value)) {
-                    callback(new Error("瀵嗙爜鍙兘鏄互鏁板瓧銆�26涓嫳鏂囧瓧姣嶆垨鑰呬笅鍒掔嚎缁勬垚鐨勫瓧绗︿覆"));
-                }
-            }
-        };
-        const validateApplicationType = (rule, value, callback) => {
-            if (!value) {
-                callback(new Error("璇峰～鍐欑敤鎴峰鍚�"));
-            } else {
-                const rep = /^[\u4E00-\u9FA5]{2,4}$/;
-                if (!rep.test(value)) {
-                    callback("璇疯緭鍏ユ纭殑鐢ㄦ埛濮撳悕");
-                }
-            }
-        };
-        const validatePhone = (rule, value, callback) => {
-            if (!value) {
-                callback(new Error("璇峰～鍐欐墜鏈哄彿鐮�"));
-            } else {
-                const rep = /(^1[3|4|5|7|8|9]\d{9}$)|(^09\d{8}$)/
-                if (!rep.test(value)) {
-                    callback("璇疯緭鍏ユ纭殑鎵嬫満鍙风爜");
-                }
-            }
-        };
-        return {
-            myInterface: {
-            },
-            createmyInterfaceRules: {
-                applicationName: [
-                    { required: true, trigger: "blur", validator: validateApplicationName},
-                ],
-                applicationIconUrl: [
-                    { required: true, trigger: "blur", validator: validateApplicationIconUrl },
-                ],
-                applicationType: [
-                    { required: true, trigger: "blur", validator: validateApplicationType },
-                ],
-                websiteUrl: [
-                    { required: true, trigger: "blur" },
-                ],
-                description: [
-                    { required: false, trigger: "blur" },
-                ],
-            },
+  data() {
+    const validateApplicationName = (rule, value, callback) => {
+      if (!value) {
+        callback(new Error("璇峰～鍐欑敤鎴峰悕绉�"));
+      }
+    };
+    const validateApplicationIconUrl = (rule, value, callback) => {
+      if (!value) {
+        callback(new Error("璇峰～鍐欑櫥褰曞瘑鐮�"));
+      } else {
+        const rep = /^\w+$/;
+        if (!rep.test(value)) {
+          callback(
+            new Error("瀵嗙爜鍙兘鏄互鏁板瓧銆�26涓嫳鏂囧瓧姣嶆垨鑰呬笅鍒掔嚎缁勬垚鐨勫瓧绗︿覆")
+          );
         }
-    },
-    created() {
-        const that = this;
-        const {userInfo} = this;
-        this.myInterface = JSON.parse(JSON.stringify(userInfo));
-    },
-    methods: {
-    },
-    props: ['updateFlag','userInfo']
-}
+      }
+    };
+    const validateApplicationType = (rule, value, callback) => {
+      if (!value) {
+        callback(new Error("璇峰～鍐欑敤鎴峰鍚�"));
+      } else {
+        const rep = /^[\u4E00-\u9FA5]{2,4}$/;
+        if (!rep.test(value)) {
+          callback("璇疯緭鍏ユ纭殑鐢ㄦ埛濮撳悕");
+        }
+      }
+    };
+    const validatePhone = (rule, value, callback) => {
+      if (!value) {
+        callback(new Error("璇峰～鍐欐墜鏈哄彿鐮�"));
+      } else {
+        const rep = /(^1[3|4|5|7|8|9]\d{9}$)|(^09\d{8}$)/;
+        if (!rep.test(value)) {
+          callback("璇疯緭鍏ユ纭殑鎵嬫満鍙风爜");
+        }
+      }
+    };
+    return {
+      myInterface: {},
+      createmyInterfaceRules: {
+        applicationName: [
+          {
+            required: true,
+            trigger: "blur",
+            validator: validateApplicationName,
+          },
+        ],
+        applicationIconUrl: [
+          {
+            required: true,
+            trigger: "blur",
+            validator: validateApplicationIconUrl,
+          },
+        ],
+        applicationType: [
+          {
+            required: true,
+            trigger: "blur",
+            validator: validateApplicationType,
+          },
+        ],
+        websiteUrl: [{ required: true, trigger: "blur" }],
+        description: [{ required: false, trigger: "blur" }],
+      },
+    };
+  },
+  created() {
+    const that = this;
+    const { userInfo } = this;
+    this.myInterface = JSON.parse(JSON.stringify(userInfo));
+  },
+  methods: {},
+  props: ["updateFlag", "userInfo"],
+};
 </script>
 <style lang="scss" scoped>
 .createmyInterface {
-    border-radius: 1px;
+  border-radius: 1px;
+  background-color: #09152f;
+
+  main {
+    text-align: left;
+    padding: 0 55px;
     background-color: #09152f;
 
-    main {
-        text-align: left;
-        padding: 0 55px;
-        background-color: #09152f;
+    .mainContent {
+      display: flex;
+      justify-content: center;
+      padding-top: 50px;
 
-        .mainContent {
-            display: flex;
-            justify-content: center;
-            padding-top: 50px;
-
-            .iconBox {
-                display: flex;
-
-                .upload {
-                    display: flex;
-                    align-items: flex-end;
-
-                    img {
-                        width: 120px;
-                        height: 120px;
-                        border-radius: 4px;
-                    }
-                }
-
-                .iconView {
-                    display: flex;
-                    flex-direction: column;
-                    margin-left: 30px;
-                    justify-content: flex-end;
-
-                    img {
-                        width: 70px;
-                        height: 70px;
-                        border-radius: 4px;
-                    }
-                }
-
-                .tip {
-                    display: flex;
-                    align-items: flex-end;
-                    margin-left: 30px;
-                    font-size: 12px;
-
-                    span {
-                        line-height: 20px;
-                    }
-                }
-            }
-            .optionBtn{
-                &::v-deep .el-button{
-                    padding: 12px 40px;
-                }
-                .reset{
-                    border: 1px solid #0079fe;
-                    color: #0079fe;
-                }
-            }
-            &::v-deep .el-form-item__label {
-                color: #4b9bb7;
-            }
-
-            &::v-deep .el-input__inner {
-                background-color: #09152f;
-                border: 1px solid #17324c;
-            }
-
-            .addPerson {
-                display: flex;
-                list-style: none;
-                padding: 0;
-
-                li {
-                    background-color: #cccccc;
-                    width: 36px;
-                    height: 36px;
-                    border-radius: 50%;
-                    color: #fff;
-                    text-align: center;
-                    font-size: 30px;
-                    margin-left: 10px;
-                }
-            }
-
-            .el-form-item__content {
-                width: 400px;
-
-                .el-select {
-                    width: 100%;
-                }
-            }
-
-            .optionHandleSp {
-                display: flex;
-
-                .areaNumber,
-                .moreNumber {
-                    flex: 1;
-                }
-
-                .telNumber {
-                    flex: 2;
-                }
-            }
-
-        }
-    }
-
-    footer {
-        border-top: 1px solid #fff;
-        height: 80px;
+      .iconBox {
         display: flex;
-        align-items: center;
-        justify-content: flex-end;
-        padding-right: 20px;
+
+        .upload {
+          display: flex;
+          align-items: flex-end;
+
+          img {
+            width: 120px;
+            height: 120px;
+            border-radius: 4px;
+          }
+        }
+
+        .iconView {
+          display: flex;
+          flex-direction: column;
+          margin-left: 30px;
+          justify-content: flex-end;
+
+          img {
+            width: 70px;
+            height: 70px;
+            border-radius: 4px;
+          }
+        }
+
+        .tip {
+          display: flex;
+          align-items: flex-end;
+          margin-left: 30px;
+          font-size: 12px;
+
+          span {
+            line-height: 20px;
+          }
+        }
+      }
+      .optionBtn {
+        &::v-deep .el-button {
+          padding: 12px 40px;
+        }
+        .reset {
+          border: 1px solid #0079fe;
+          color: #0079fe;
+        }
+      }
+      &::v-deep .el-form-item__label {
+        color: #4b9bb7;
+      }
+
+      &::v-deep .el-input__inner {
+        background-color: #09152f;
+        border: 1px solid #17324c;
+      }
+
+      .addPerson {
+        display: flex;
+        list-style: none;
+        padding: 0;
+
+        li {
+          background-color: #cccccc;
+          width: 36px;
+          height: 36px;
+          border-radius: 50%;
+          color: #fff;
+          text-align: center;
+          font-size: 30px;
+          margin-left: 10px;
+        }
+      }
+
+      .el-form-item__content {
+        width: 400px;
+
+        .el-select {
+          width: 100%;
+        }
+      }
+
+      .optionHandleSp {
+        display: flex;
+
+        .areaNumber,
+        .moreNumber {
+          flex: 1;
+        }
+
+        .telNumber {
+          flex: 2;
+        }
+      }
     }
+  }
+
+  footer {
+    border-top: 1px solid #fff;
+    height: 80px;
+    display: flex;
+    align-items: center;
+    justify-content: flex-end;
+    padding-right: 20px;
+  }
 }
 </style>
\ No newline at end of file
diff --git a/src/views/operate/rectification/surveyList/index.vue b/src/views/operate/rectification/surveyList/index.vue
index 085739f..d6c82e8 100644
--- a/src/views/operate/rectification/surveyList/index.vue
+++ b/src/views/operate/rectification/surveyList/index.vue
@@ -1,290 +1,372 @@
 <template>
-    <div class="otherInterface">
-        <header>
-            <div class="headerTitle">杩愯惀绠＄悊 >> 涓撻」鏁存不 > 鏅煡鍒楄〃</div>
-        </header>
-        <main>
-            <div class="mainHeader">
-                <div class="add">
-                    <el-button type="primary" icon="el-icon-plus">鏂板浠诲姟</el-button>
-                </div>
-                <div class="date-search">
-                    <span>鎸夊ぉ鏌ヨ:</span>
-                    <div class="mydate">
-                        <el-input placeholder="璇疯緭鍏ュ紑濮嬫椂闂�"></el-input>
-                        <div class="line">
-                            鈥斺�斺�� 鈥斺�斺��
-                        </div>
-                        <el-input placeholder="璇疯緭鍏ョ粨鏉熸椂闂�"></el-input>
-                    </div>
-                </div>
-                <div class="search">
-                    <el-input placeholder="璇疯緭鍏ユ爣棰樻垨鑰呬换鍔＄紪鍙�"></el-input>
-                </div>
-                <div class="btn">
-                    <el-button icon="el-icon-plus" type="primary">鎼滅储</el-button>
-                    <el-button icon="el-icon-delete">閲嶇疆</el-button>
-                </div>
-            </div>
-            <div class="mainContent">
-                <!-- @selection-change="handleSelectionChange" -->
-                <!-- 鏁版嵁娓叉煋 -->
-                <el-table ref="multipleTable" :data="tableData" tooltip-effect="dark" style="width: 100%"
-                    :header-cell-style="{background:'#06122c','font-size':'12px',color:'#4b9bb7','font-weight':'650','line-height':'45px'}"
-                    :row-class-name="tableRowClassName">
-                    <el-table-column type="selection" width="55">
-                    </el-table-column>
-                    <el-table-column label="浠诲姟缂栧彿" prop="applicationName" min-width="10">
-                    </el-table-column>
-                    <el-table-column prop="applicationType" label="闂绫诲瀷" min-width="10">
-                    </el-table-column>
-                    <el-table-column prop="websiteUrl" label="澶х被" min-width="10">
-                    </el-table-column>
-                    <el-table-column prop="applicationType" label="灏忕被" min-width="10">
-                    </el-table-column>
-                    <el-table-column prop="applicationType" label="琛楅亾" min-width="10">
-                    </el-table-column>
-                    <el-table-column prop="applicationType" label="绀惧尯" min-width="10">
-                    </el-table-column>
-                    <el-table-column prop="applicationType" label="浠诲姟鎻忚堪" min-width="10">
-                    </el-table-column>
-                    <el-table-column prop="applicationType" label="涓婃姤鏃堕棿" min-width="10">
-                    </el-table-column>
-                    <el-table-column label="鎿嶄綔" min-width="10">
-                        <template slot-scope="scope">
-                            <span @click="handleDelete(scope.row)">鏌ョ湅</span>
-                        </template>
-                    </el-table-column>
-                </el-table>
-                <!-- 鍒嗛〉 -->
-                <!-- <div class="pagination">
+  <div class="otherInterface">
+    <header>
+      <div class="headerTitle">杩愯惀绠＄悊 >> 涓撻」鏁存不 > 鏅煡鍒楄〃</div>
+    </header>
+    <main>
+      <div class="mainHeader">
+        <div class="add">
+          <el-button type="primary" icon="el-icon-plus" @click="handleAdd()"
+            >鏂板浠诲姟</el-button
+          >
+        </div>
+        <div class="date-search">
+          <span>鎸夊ぉ鏌ヨ:</span>
+          <div class="block">
+            <el-date-picker
+              v-model="beginTime"
+              type="date"
+              placeholder="璇烽�夋嫨寮�濮嬫棩鏈�"
+            >
+            </el-date-picker>
+          </div>
+          <span>鈥斺�斺�� 鈥斺�斺��</span>
+          <div class="block">
+            <el-date-picker
+              v-model="endTime"
+              type="date"
+              placeholder="璇烽�夋嫨缁撴潫鏃ユ湡"
+            >
+            </el-date-picker>
+          </div>
+          <!-- <div class="mydate">
+            <el-input placeholder="璇疯緭鍏ュ紑濮嬫椂闂�"></el-input>
+            <div class="line">鈥斺�斺�� 鈥斺�斺��</div>
+            <el-input placeholder="璇疯緭鍏ョ粨鏉熸椂闂�"></el-input>
+          </div> -->
+        </div>
+        <div class="search">
+          <el-input placeholder="璇疯緭鍏ユ爣棰樻垨鑰呬换鍔＄紪鍙�"></el-input>
+        </div>
+        <div class="btn">
+          <el-button icon="el-icon-plus" type="primary">鎼滅储</el-button>
+          <el-button icon="el-icon-delete">閲嶇疆</el-button>
+        </div>
+      </div>
+      <div class="mainContent">
+        <!-- @selection-change="handleSelectionChange" -->
+        <!-- 鏁版嵁娓叉煋 -->
+        <el-table
+          ref="multipleTable"
+          :data="tableData"
+          tooltip-effect="dark"
+          style="width: 100%"
+          :header-cell-style="{
+            background: '#06122c',
+            'font-size': '12px',
+            color: '#4b9bb7',
+            'font-weight': '650',
+            'line-height': '45px',
+          }"
+          :row-class-name="tableRowClassName"
+        >
+          <!-- <el-table-column type="selection" width="55">
+                    </el-table-column> -->
+          <el-table-column label="浠诲姟缂栧彿" prop="num" min-width="10">
+          </el-table-column>
+          <el-table-column prop="type" label="闂绫诲瀷" min-width="10">
+          </el-table-column>
+          <el-table-column prop="bigclass" label="澶х被" min-width="10">
+          </el-table-column>
+          <el-table-column prop="subclass" label="灏忕被" min-width="10">
+          </el-table-column>
+          <el-table-column prop="street" label="琛楅亾" min-width="10">
+          </el-table-column>
+          <el-table-column prop="community" label="绀惧尯" min-width="10">
+          </el-table-column>
+          <el-table-column prop="task" label="浠诲姟鎻忚堪" min-width="10">
+          </el-table-column>
+          <el-table-column prop="reportTime" label="涓婃姤鏃堕棿" min-width="10">
+          </el-table-column>
+          <el-table-column label="鎿嶄綔" min-width="10">
+            <template slot-scope="scope">
+              <span @click="handleView(scope.row)" style="cursor: pointer"
+                >鏌ョ湅</span
+              >
+            </template>
+          </el-table-column>
+        </el-table>
+        <!-- 鍒嗛〉 -->
+        <!-- <div class="pagination">
                     <el-pagination background :current-page="currentPage" layout="prev, pager, next" :total="totalNum"
                         :page-size="pageSize" @current-change="changeCurrentPage" @prev-click="handlePrev"
                         @next-click="handleNext">
                     </el-pagination>
                 </div> -->
-            </div>
-        </main>
-        <footer>
-            <!-- 鍒涘缓寮圭獥 -->
-            <el-dialog :visible.sync="dialogCreate" title="鏂板绗笁鏂规帴鍙�" width="45%" v-if="dialogCreate"
-                :before-close="handleClose">
-                <createInterface />
-            </el-dialog>
-            <!-- 鏌ョ湅寮圭獥 -->
-            <el-dialog :visible.sync="dialogUpdate" :title="updateFlag ?'淇敼绗笁鏂规帴鍙�':'鏌ョ湅绗笁鏂规帴鍙�'" width="45%"
-                v-if="dialogUpdate" :before-close="handleClose">
-                <viewInterface :updateFlag="updateFlag" :userInfo=userInfo />
-            </el-dialog>
-        </footer>
-    </div>
+      </div>
+    </main>
+    <footer>
+      <!-- 鍒涘缓寮圭獥 -->
+      <el-dialog
+        :visible.sync="dialogCreate"
+        title="鏂板"
+        width="45%"
+        v-if="dialogCreate"
+        :before-close="handleClose"
+      >
+        <createInterface @closeDialog="closeDialog" />
+      </el-dialog>
+      <!-- 鏌ョ湅寮圭獥 -->
+      <el-dialog
+        :visible.sync="dialogUpdate"
+        :title="updateFlag ? '缂栬緫' : '璇︽儏'"
+        width="45%"
+        v-if="dialogUpdate"
+        :before-close="handleClose"
+      >
+        <viewInterface :updateFlag="updateFlag" :userInfo="userInfo" />
+      </el-dialog>
+    </footer>
+  </div>
 </template>
 <script>
-import createInterface from './components/createInterface';
-import viewInterface from './components/viewInterface'
+import createInterface from "./components/createInterface";
+import viewInterface from "./components/viewInterface";
 export default {
-    components: {
-        createInterface, viewInterface
-    },
-    data() {
-        return {
-            tableData: [],
-            search: "",
-            dialogCreate: false,
-            dialogUpdate: false,
-            updateFlag: false,
-            userInfo: '',
-            date:'',
-            // totalNum: 200,
-            // pageSize: 10,
-            // currentPage: 1,
+  components: {
+    createInterface,
+    viewInterface,
+  },
+  data() {
+    return {
+      tableData: [
+        {
+          num: 1234,
+          type: "鍩庣绫讳簨浠�",
+          bigclass: "鍏朵粬",
+          subclass: "鍏朵粬",
+          street: "琛楅亾",
+          community: "绀惧尯",
+          task: "浠诲姟鎻忚堪",
+          reportTime: "2022-10-31 13:20",
+        },
+        {
+          num: 1234,
+          type: "鍩庣绫讳簨浠�",
+          bigclass: "鍏朵粬",
+          subclass: "鍏朵粬",
+          street: "琛楅亾",
+          community: "绀惧尯",
+          task: "浠诲姟鎻忚堪",
+          reportTime: "2022-10-31 13:20",
+        },
+        {
+          num: 1234,
+          type: "鍩庣绫讳簨浠�",
+          bigclass: "鍏朵粬",
+          subclass: "鍏朵粬",
+          street: "琛楅亾",
+          community: "绀惧尯",
+          task: "浠诲姟鎻忚堪",
+          reportTime: "2022-10-31 13:20",
+        },
+      ],
+      search: "",
+      dialogCreate: false,
+      dialogUpdate: false,
+      updateFlag: false,
+      userInfo: "",
+      date: "",
+      beginTime: "",
+      endTime: "",
+      // totalNum: 200,
+      // pageSize: 10,
+      // currentPage: 1,
+    };
+  },
+  created() {
+    this.getUserList();
+  },
+  methods: {
+    // 鑾峰彇鎺ュ彛鍒楄〃
+    getUserList() {
+      const that = this;
+      // const { currentPage, pageSize, search } = this;
+      this.dialogCreate = false;
+      this.$axios.get("sccg/system/portal/thirdApp/search").then((res) => {
+        const { code, data } = res;
+        if (code == 200) {
+          this.tableData = data;
         }
+      });
     },
-    created() {
-        this.getUserList();
+    // 璁剧疆琛ㄦ牸鏂戦┈绾�
+    tableRowClassName({ row, rowIndex }) {
+      if ((rowIndex + 1) % 2 == 0) {
+        return "warning-row";
+      } else {
+        return "success-row";
+      }
+      return "";
     },
-    methods: {
-        // 鑾峰彇鎺ュ彛鍒楄〃
-        getUserList() {
-            const that = this;
-            // const { currentPage, pageSize, search } = this;
-            this.dialogCreate = false;
-            this.$axios.get("sccg/system/portal/thirdApp/search").then(res => {
-                const { code, data } = res;
-                if (code == 200) {
-                    this.tableData = data;
-                }
-            })
-        },
-        // 璁剧疆琛ㄦ牸鏂戦┈绾�
-        tableRowClassName({ row, rowIndex }) {
-            if ((rowIndex + 1) % 2 == 0) {
-                return 'warning-row';
-            } else {
-                return 'success-row';
-            }
-            return '';
-        },
-        // 鎵撳紑鏂板鐣岄潰
-        handleAdd() {
-            this.dialogCreate = true;
-        },
-        // 鍒涘缓寮圭獥鍏抽棴
-        handleClose(done) {
-            const that = this;
-            this.$confirm('纭鍏抽棴锛�')
-                .then(_ => {
-                    that.dialogCreate = false;
-                    done();
-                })
-                .catch(_ => { });
-        },
-        // 鍒涘缓鏌ョ湅寮圭獥
-        handleView(rowData) {
-            this.userInfo = rowData;
-            this.dialogUpdate = true;
-        },
-        // 鍒犻櫎绗笁鏂规帴鍙�
-        handleDelete({ id }) {
-            console.log(id);
-            this.$axios.delete('sccg/system/portal/thirdApp/delete', {
-                params: {
-                    id
-                }
-            }).then(res => {
-                console.log(res);
-            })
-        }
-        // // 褰撳墠椤垫敼鍙樿Е鍙戜簨浠�
-        // changeCurrentPage(page) {
-        //     this.currentPage = page;
-        //     this.getUserList();
-        // },
-        // // 涓婁竴椤电偣鍑讳簨浠�
-        // handlePrev(page) {
-        //     this.currentPage = page;
-        //     this.getUserList();
-        // },
-        // // 涓嬩竴椤电偣鍑讳簨浠�
-        // handleNext(page) {
-        //     this.currentPage = page;
-        //     this.getUserList();
-        // },
-    }
-}
+    // 鎵撳紑鏂板鐣岄潰
+    handleAdd() {
+      this.dialogCreate = true;
+    },
+    // 鍒涘缓寮圭獥鍏抽棴
+    handleClose(done) {
+      const that = this;
+      this.$confirm("纭鍏抽棴锛�")
+        .then((_) => {
+          that.dialogCreate = false;
+          done();
+        })
+        .catch((_) => {});
+    },
+    closeDialog({ flag, index }) {
+      console.log(flag);
+      index === 1 ? "" : "";
+      this.dialogCreate = flag;
+    },
+    // 鍒涘缓鏌ョ湅寮圭獥
+    handleView(rowData) {
+      console.log(rowData);
+      this.userInfo = rowData;
+      this.dialogUpdate = true;
+    },
+    // 鍒犻櫎绗笁鏂规帴鍙�
+    handleDelete({ id }) {
+      console.log(id);
+      this.$axios
+        .delete("sccg/system/portal/thirdApp/delete", {
+          params: {
+            id,
+          },
+        })
+        .then((res) => {
+          console.log(res);
+        });
+    },
+    // // 褰撳墠椤垫敼鍙樿Е鍙戜簨浠�
+    // changeCurrentPage(page) {
+    //     this.currentPage = page;
+    //     this.getUserList();
+    // },
+    // // 涓婁竴椤电偣鍑讳簨浠�
+    // handlePrev(page) {
+    //     this.currentPage = page;
+    //     this.getUserList();
+    // },
+    // // 涓嬩竴椤电偣鍑讳簨浠�
+    // handleNext(page) {
+    //     this.currentPage = page;
+    //     this.getUserList();
+    // },
+  },
+};
 </script>
 <!-- sccg/system/portal/thirdApp/search -->
 <style lang="scss" scoped>
 .otherInterface {
-    header {
+  header {
+    display: flex;
+    line-height: 60px;
+    justify-content: space-between;
+    padding: 0 20px;
+    color: #4b9bb7;
+    &::v-deep .el-button {
+      background-color: #eb5d01;
+      border: none;
+      color: #fff;
+      border-radius: 20px;
+    }
+  }
+
+  main {
+    padding: 10px 20px;
+
+    .mainHeader {
+      padding-left: 20px;
+      display: flex;
+      line-height: 60px;
+      color: #4b9bb7;
+      background-color: #09152f;
+      display: flex;
+      .add,
+      .search,
+      .btn {
+        flex: 1;
+      }
+      .date-search {
+        flex: 3;
         display: flex;
-        line-height: 60px;
-        justify-content: space-between;
-        padding: 0 20px;
+        .mydate {
+          display: flex;
+          .line {
+            margin: 0 10px 0 20px;
+          }
+        }
+      }
+      .el-input {
+        width: 180px;
+        height: 35px;
+        margin-left: 10px;
+
+        &::v-deep .el-input__inner {
+          background-color: #09152f;
+          border: 1px solid #17324c;
+          font-size: 12px;
+        }
+      }
+    }
+
+    .mainContent {
+      margin-top: 20px;
+
+      .el-table {
         color: #4b9bb7;
 
-        &::v-deep .el-button {
-            background-color: #eb5d01;
-            border: none;
-            color: #fff;
-            border-radius: 20px;
+        &::v-deep .el-table__empty-block {
+          background-color: #06122c;
         }
+
+        &::v-deep .el-table__empty-text {
+          color: #4b9bb7;
+        }
+
+        &::v-deep .warning-row {
+          background-color: #06122c;
+        }
+
+        &::v-deep .success-row {
+          background-color: #071f39;
+        }
+      }
+
+      .line {
+        padding: 0 5px;
+        // margin-top: -10px;
+      }
+    }
+  }
+
+  footer {
+    &::v-deep .el-dialog__header,
+    &::v-deep .el-dialog__body {
+      background-color: #06122c;
     }
 
-    main {
-        padding: 10px 20px;
-
-        .mainHeader {
-            padding-left: 20px;
-            display: flex;
-            line-height: 60px;
-            color: #4b9bb7;
-            background-color: #09152f;
-            display: flex;
-            .add,.search,.btn{
-                flex:1;
-            }
-            .date-search{
-                flex: 3;
-                display: flex;
-                .mydate{
-                    display: flex;
-                    .line{
-                        margin:0 10px 0 20px;
-                    }
-                }
-            }
-            .el-input {
-                width: 180px;
-                height: 35px;
-                margin-left: 10px;
-
-                &::v-deep .el-input__inner {
-                    background-color: #09152f;
-                    border: 1px solid #17324c;
-                    font-size: 12px;
-                }
-            }
-        }
-
-        .mainContent {
-            margin-top: 20px;
-
-            .el-table {
-                color: #4b9bb7;
-
-                &::v-deep .el-table__empty-block {
-                    background-color: #06122c;
-                }
-
-                &::v-deep .el-table__empty-text {
-                    color: #4b9bb7;
-                }
-
-                &::v-deep .warning-row {
-                    background-color: #06122c;
-                }
-
-                &::v-deep .success-row {
-                    background-color: #071f39;
-                }
-            }
-
-            .line {
-                padding: 0 5px;
-                // margin-top: -10px;
-            }
-        }
+    &::v-deep .el-dialog__header {
+      display: flex;
+      align-items: center;
+      background-color: #fff;
+      padding: 20px;
+      line-height: 60px;
     }
 
-    footer {
-
-        &::v-deep .el-dialog__header,
-        &::v-deep .el-dialog__body {
-            background-color: #06122c;
-        }
-
-        &::v-deep .el-dialog__header {
-            display: flex;
-            align-items: center;
-            background-color: #fff;
-            padding: 20px;
-            line-height: 60px;
-        }
-
-        &::v-deep .el-dialog__title {
-            color: #4b9bb7;
-        }
-
-        &::v-deep .el-dialog__close {
-            width: 20px;
-            height: 20px;
-            // color: #fff;
-        }
-
-        &::v-deep .el-dialog__body {
-            padding: 0;
-        }
+    &::v-deep .el-dialog__title {
+      color: #4b9bb7;
     }
+
+    &::v-deep .el-dialog__close {
+      width: 20px;
+      height: 20px;
+      // color: #fff;
+    }
+
+    &::v-deep .el-dialog__body {
+      padding: 0;
+    }
+  }
 }
 </style>
\ No newline at end of file
diff --git a/src/views/systemSetting/device/handheldTerminal/components/dialogForm.vue b/src/views/systemSetting/device/handheldTerminal/components/dialogForm.vue
new file mode 100644
index 0000000..fa3c400
--- /dev/null
+++ b/src/views/systemSetting/device/handheldTerminal/components/dialogForm.vue
@@ -0,0 +1,331 @@
+<template>
+  <div class="create">
+    <main>
+      <div class="mainContent">
+        <el-form
+          ref="formRef"
+          label-width="140px"
+          :rules="createRules"
+          autoComplete="on"
+          :model="form"
+          label-position="right"
+        >
+          <!-- 鍗曞叺鍚嶇О -->
+          <el-form-item class="optionItem" label="鍗曞叺鍚嶇О:" prop="name">
+            <el-input
+              v-model="form.name"
+              placeholder="璇峰～鍐欏崟鍏靛悕绉�"
+            ></el-input>
+          </el-form-item>
+          <!-- 鍗曞叺缂栧彿 -->
+          <el-form-item class="optionItem" label="鍗曞叺缂栧彿:" prop="code">
+            <el-input
+              v-model="form.code"
+              placeholder="璇峰～鍐欏崟鍏电紪鍙�"
+            ></el-input>
+          </el-form-item>
+          <!-- 浣跨敤浜哄憳 -->
+          <el-form-item class="optionItem" label="浣跨敤浜哄憳:" prop="user">
+            <el-input
+              v-model="form.user"
+              placeholder="璇峰～鍐欎娇鐢ㄤ汉鍛�"
+            ></el-input>
+          </el-form-item>
+          <!-- 鑱旂郴鏂瑰紡 -->
+          <el-form-item class="optionItem" label="鑱旂郴鏂瑰紡:" prop="phone">
+            <el-input
+              v-model="form.phone"
+              placeholder="璇峰～鍐欒仈绯绘柟寮�"
+            ></el-input>
+          </el-form-item>
+          <!-- 閮ㄩ棬 -->
+          <el-form-item class="optionItems" label="鎵�灞為儴闂�:" prop="departId">
+            <el-select v-model="form.departName" placeholder="璇疯緭鍏ユ墍灞為儴闂�">
+              <el-option :value="mylabel">
+                <el-tree
+                  ref="tree"
+                  :check-strictly="true"
+                  :data="departList"
+                  :props="defaultProps"
+                  show-checkbox
+                  @check-change="handleCheck"
+                  default-expand-all
+                  node-key="id"
+                >
+                </el-tree>
+              </el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item>
+            <div class="optionBtn">
+              <el-button
+                type="primary"
+                class="btn submit"
+                @click.native.prevent="handleUpdateLawCar"
+                >纭
+              </el-button>
+            </div>
+          </el-form-item>
+        </el-form>
+      </div>
+    </main>
+  </div>
+</template>
+  <script>
+import { validatePhone, validateName } from "@/utils/validate";
+export default {
+  data() {
+    const checkName = (rule, value, callback) => {
+      if (value) {
+        callback();
+      } else {
+        callback(new Error("鍗曞叺鍚嶇О涓嶈兘涓虹┖"));
+      }
+    };
+    const checkCode = (rule, value, callback) => {
+      if (value) {
+        callback();
+      } else {
+        callback(new Error("鍗曞叺缂栫爜涓嶈兘涓虹┖"));
+      }
+    };
+    const checkDepartId = (rule, value, callback) => {
+      if (value) {
+        callback();
+      } else {
+        callback(new Error("鎵�灞為儴闂ㄤ笉鑳戒负绌�"));
+      }
+    };
+    const checkUser = (rule, value, callback) => {
+      if (value) {
+        callback();
+      } else {
+        callback(new Error("浣跨敤浜哄憳涓嶈兘涓虹┖"));
+      }
+    };
+    const checkPhone = (rule, value, callback) => {
+      if (value) {
+        if (validatePhone(value)) {
+          callback();
+        } else {
+          callback(new Error("璇疯緭鍏ユ纭殑鎵嬫満鍙�"));
+        }
+      } else {
+        callback(new Error("鎵嬫満鍙风爜涓嶈兘涓虹┖"));
+      }
+    };
+    return {
+      form: {
+        name: "",
+        code: "",
+        user: "",
+        phone: "",
+        departName: "",
+        departId: 0,
+      },
+      createRules: {
+        departId: [
+          {
+            required: true,
+            trigger: "blur",
+            validator: checkDepartId,
+          },
+        ],
+        name: [
+          {
+            required: true,
+            trigger: "blur",
+            validator: checkName,
+          },
+        ],
+        code: [
+          {
+            required: true,
+            trigger: "blur",
+            validator: checkCode,
+          },
+        ],
+        user: [
+          {
+            required: true,
+            trigger: "blur",
+            validator: checkUser,
+          },
+        ],
+        phone: [
+          {
+            required: true,
+            trigger: "blur",
+            validator: checkPhone,
+          },
+        ],
+        // id: 0,
+        ownerName: [
+          {
+            required: true,
+            trigger: "blur",
+            validator: checkName,
+          },
+        ],
+        // vehicleUser: [
+        //     {
+        //         required: true, trigger: 'blur', validator: checkUser
+        //     }
+        // ]
+      },
+      selectOrg: {
+        orgsid: [],
+      },
+      mylabel: "",
+      departList: [],
+      defaultProps: {
+        children: "children",
+        label: "departName",
+      },
+    };
+  },
+  created() {
+    const { getDepartTree } = this;
+    // 鍒濆鍖栭儴闂ㄦ爲
+    getDepartTree();
+    // 鍒濆鍖栨暟鎹�
+    this.form = JSON.parse(JSON.stringify(this.info));
+    if (!this.form.departName) {
+      this.form.departName = this.form.pdepartName;
+    }
+  },
+  methods: {
+    // 淇敼鎵ф硶杞�
+    handleUpdateLawCar() {
+      this.$refs.formRef.validate((valid) => {
+        if (valid) {
+          const { form } = this;
+          this.$axios({
+            method: "put",
+            url: "sccg/car_Manage/modification_enforce",
+            data: {
+              ...form,
+            },
+          }).then((res) => {
+            if (res.code === 200) {
+              this.$message({
+                type: "success",
+                message: "淇敼杞﹁締鎴愬姛",
+              });
+              this.$emit("closeDialog", { flag: false, index: 1 });
+            } else {
+              this.$message({
+                type: "error",
+                message: res.message,
+              });
+            }
+          });
+        } else {
+          return false;
+        }
+      });
+    },
+    // 閮ㄩ棬淇敼
+    handleCheck(data, checked) {
+      this.form.departId = data.id;
+      this.form.departName = data.departName;
+      // 鑾峰彇褰撳墠閫夋嫨鐨刬d鍦ㄦ暟缁勪腑鐨勭储寮�
+      const indexs = this.selectOrg.orgsid.indexOf(data.id);
+      // 濡傛灉涓嶅瓨鍦ㄦ暟缁勪腑锛屽苟涓旀暟缁勪腑宸茬粡鏈変竴涓猧d骞朵笖checked涓簍rue鐨勬椂鍊欙紝浠ｈ〃涓嶈兘鍐嶆閫夋嫨銆�
+      if (indexs < 0 && this.selectOrg.orgsid.length === 1 && checked) {
+        this.$message({
+          message: "鍙兘閫夋嫨涓�涓儴闂紒",
+          type: "warning",
+          showClose: true,
+        });
+        // 璁剧疆宸查�夋嫨鐨勮妭鐐逛负false 寰堥噸瑕�
+        this.$refs.tree.setChecked(data, false);
+      } else if (this.selectOrg.orgsid.length === 0 && checked) {
+        // 鍙戠幇鏁扮粍涓虹┖ 骞朵笖鏄凡閫夋嫨
+        // 闃叉鏁扮粍鏈夊�硷紝棣栧厛娓呯┖锛屽啀push
+        this.selectOrg.orgsid = [];
+        this.selectOrg.orgsid.push(data.id);
+      } else if (
+        indexs >= 0 &&
+        this.selectOrg.orgsid.length === 1 &&
+        !checked
+      ) {
+        // 鍐嶆鐩存帴杩涜璧嬪�间负绌烘搷浣�
+        this.selectOrg.orgsid = [];
+        this.form.departName = "";
+      }
+    },
+    // 鑾峰彇閮ㄩ棬鏍�
+    getDepartTree() {
+      this.$axios.get("/sccg/depart/tree").then((res) => {
+        this.departList = res.data;
+      });
+    },
+  },
+  props: ["info", "closeDialog"],
+};
+</script>
+  <style lang="scss" scoped>
+.create {
+  border-radius: 1px;
+  background-color: #09152f;
+
+  main {
+    // border: 1px solid #fff;
+    text-align: left;
+    padding: 0 55px;
+    background-color: #09152f;
+    padding-bottom: 50px;
+
+    .mainContent {
+      display: flex;
+      justify-content: center;
+      padding-top: 50px;
+
+      .el-form-item__content {
+        width: 400px;
+
+        .el-select {
+          width: 100%;
+        }
+      }
+
+      .optionHandleSp {
+        display: flex;
+
+        .areaNumber,
+        .moreNumber {
+          flex: 1;
+        }
+
+        .telNumber {
+          flex: 2;
+        }
+      }
+
+      .optionBtn {
+        display: flex;
+        margin-top: 20px;
+
+        .btn {
+          padding: 12px 50px;
+        }
+      }
+    }
+  }
+
+  &::v-deep .el-textarea__inner {
+    background-color: #09152f;
+    border: 1px solid #17324c;
+  }
+
+  ::v-deep .el-form-item__label {
+    color: #4b9bb7;
+  }
+
+  ::v-deep .el-input__inner {
+    background-color: #09152f;
+    border: 1px solid #17324c;
+  }
+}
+</style>
\ No newline at end of file
diff --git a/src/views/systemSetting/device/handheldTerminal/index.vue b/src/views/systemSetting/device/handheldTerminal/index.vue
new file mode 100644
index 0000000..e130306
--- /dev/null
+++ b/src/views/systemSetting/device/handheldTerminal/index.vue
@@ -0,0 +1,368 @@
+<template>
+  <div class="list">
+    <header>
+      <div class="header-content">
+        <div class="search">
+          <span style="padding-right: 20px">绛涢�夋潯浠�:</span>
+          <el-select
+            v-model="context"
+            placeholder="绛涢�夋潯浠�"
+            @change="handleStateChange"
+          >
+            <el-option
+              v-for="item in options"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value"
+            >
+            </el-option>
+          </el-select>
+        </div>
+      </div>
+    </header>
+    <main>
+      <div class="main-content">
+        <div class="main-title">
+          <el-button
+            class="el-icon-plus"
+            type="primary"
+            @click="dialogCreate = true"
+            >娣诲姞</el-button
+          >
+        </div>
+        <!-- 鏁版嵁灞曠ず -->
+        <el-table
+          ref="multipleTable"
+          :header-cell-style="{
+            background: '#06122c',
+            'font-size': '12px',
+            color: '#4b9bb7',
+            'font-weight': '650',
+            'line-height': '45px',
+          }"
+          :row-class-name="tableRowClassName"
+          :data="list"
+          style="width: 100%"
+        >
+          <el-table-column type="selection" min-width="5"> </el-table-column>
+          <el-table-column prop="name" label="鍗曞叺鍚嶇О" min-width="10">
+          </el-table-column>
+          <el-table-column prop="code" label="鍗曞叺缂栧彿" min-width="10">
+          </el-table-column>
+          <el-table-column prop="user" label="浣跨敤浜哄憳" min-width="10">
+          </el-table-column>
+          <el-table-column prop="phone" label="鑱旂郴鏂瑰紡" min-width="10">
+          </el-table-column>
+          <el-table-column prop="pDepartName" label="鎵�灞為儴闂�" min-width="10">
+          </el-table-column>
+          <el-table-column prop="departName" label="鎵�灞炲ぇ闃�" min-width="10">
+          </el-table-column>
+
+          <el-table-column
+            prop="state"
+            :formatter="formatSate"
+            label="鐘舵��"
+            min-width="5"
+          >
+          </el-table-column>
+
+          <el-table-column prop="operation" label="鎿嶄綔" min-width="20">
+            <template slot-scope="scope">
+              <div class="btn">
+                <span @click="handleEdit(scope.row)">缂栬緫</span>
+                <span class="line">|</span>
+                <span @click="handleDelete(scope.row)">鍒犻櫎</span>
+              </div>
+            </template>
+          </el-table-column>
+        </el-table>
+      </div>
+
+      <!-- tools -->
+      <div class="tools">
+        <div class="funs"></div>
+        <div class="pagination">
+          <el-pagination
+            background
+            :current-page="currentPage"
+            layout="prev, pager, next"
+            :total="totalNum"
+            :page-size="pageSize"
+            @current-change="changeCurrentPage"
+            @prev-click="handlePrev"
+            @next-click="handleNext"
+          >
+          </el-pagination>
+        </div>
+      </div>
+    </main>
+    <footer>
+      <!-- 娣诲姞闊虫煴 -->
+      <el-dialog
+        title="娣诲姞闊虫煴"
+        :visible.sync="dialogCreate"
+        v-if="dialogCreate"
+        width="60%"
+        :before-close="handleClose"
+      >
+        <MyForm :info="handheldTerminal" :closeDialog="setTableData"></MyForm>
+      </el-dialog>
+    </footer>
+  </div>
+</template>
+  <script>
+import { createNamespacedHelpers } from "vuex";
+const { mapActions } = createNamespacedHelpers("handheldTerminal");
+import MyForm from "./components/dialogForm.vue";
+
+export default {
+  components: {
+    MyForm,
+  },
+  data() {
+    return {
+      dialogCreate: false,
+      context: null,
+      options: [
+        {
+          value: null,
+          label: "鍏ㄩ儴",
+        },
+        {
+          value: 1,
+          label: "鍦ㄧ嚎",
+        },
+        {
+          value: 0,
+          label: "绂荤嚎",
+        },
+      ],
+      list: [],
+      totalNum: 0,
+      pageSize: 10,
+      currentPage: 1,
+      renderFlag: false,
+      handheldTerminal: {
+        id: 0,
+        name: "",
+        code: "",
+        user: "",
+        phone: "",
+        departId: 0,
+      },
+    };
+  },
+  created() {
+    this.setTableData();
+  },
+  methods: {
+    ...mapActions([
+      "getHandheldTerminalList",
+      "saveHandheldTerminal",
+      "updateHandheldTerminal",
+    ]),
+    handleEdit(row) {
+      
+      this.handheldTerminal = row;
+      this.dialogCreate = true;
+    },
+    handleDelete(row) {},
+    formatSate(row, column) {
+      return row.state == 1 ? "鍦ㄧ嚎" : "绂荤嚎";
+    },
+
+    // 璁剧疆琛ㄦ牸鏂戦┈绾�
+    tableRowClassName({ row, rowIndex }) {
+      if ((rowIndex + 1) % 2 == 0) {
+        return "warning-row";
+      } else {
+        return "success-row";
+      }
+      return "";
+    },
+    // 寮圭獥鍏抽棴
+    handleClose(done) {
+      this.$confirm("纭鍏抽棴?").then((_) => {
+        done();
+      });
+    },
+    // 璁剧疆tableData
+    setTableData() {
+      const { currentPage, pageSize, context } = this;
+      this.getHandheldTerminalList({
+        currentPage,
+        pageSize,
+        state: context,
+      }).then((res) => {
+        if (res.data.code == 200) {
+          this.list = res.data.data.records;
+          this.totalNum = res.data.data.total;
+        }
+      });
+    },
+    handleStateChange(e) {
+      this.setTableData();
+    },
+    // 褰撳墠椤垫敼鍙樿Е鍙戜簨浠�
+    changeCurrentPage(page) {
+      this.currentPage = page;
+      this.setTableData();
+    },
+    // 涓婁竴椤电偣鍑讳簨浠�
+    handlePrev(page) {
+      this.currentPage = page;
+      this.setTableData();
+    },
+    // 涓嬩竴椤电偣鍑讳簨浠�
+    handleNext(page) {
+      this.currentPage = page;
+      this.setTableData();
+    },
+  },
+};
+</script>
+  <style lang="scss" scoped>
+.list {
+  text-align: left;
+  margin: 10px 20px;
+  color: #4b9bb7;
+
+  header {
+    background-color: #09152f;
+    border: 1pox solid #fff;
+
+    .header-content {
+      padding: 0 40px;
+      display: flex;
+      line-height: 100px;
+      justify-content: space-between;
+      align-items: center;
+
+      .search {
+        display: flex;
+        justify-content: flex-start;
+
+        span {
+          flex: 1;
+        }
+
+        .el-input {
+          flex: 2;
+          color: #1d3f57;
+
+          &::v-deep .el-input__inner {
+            background-color: #09152f;
+            border: 1px solid #17324c;
+          }
+        }
+      }
+    }
+  }
+
+  main {
+    background-color: #09152f;
+    margin-top: 20px;
+    padding-bottom: 50px;
+    border: 1pox solid #fff;
+
+    .main-title {
+      line-height: 60px;
+      padding: 10px 20px;
+    }
+
+    .tools {
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      padding: 0 20px;
+
+      .funs {
+        display: flex;
+
+        .funsItem {
+          line-height: 28px;
+          display: flex;
+          align-items: center;
+          border: 1px solid #17324c;
+          border-radius: 4px;
+          font-size: 12px;
+          margin-left: 10px;
+
+          .el-checkbox {
+            width: 80px;
+            padding: 0 10px;
+          }
+
+          .el-select {
+            width: 120px;
+          }
+
+          &::v-deep .el-input__inner {
+            border: none;
+            background-color: #09152f;
+          }
+
+          &:hover {
+            border: 1px solid #4b9bb7;
+          }
+
+          &:hover .el-checkbox {
+            color: #4b9bb7;
+          }
+        }
+      }
+
+      .pagination {
+        margin-top: 50px;
+        display: flex;
+        line-height: 50px;
+        justify-content: center;
+
+        .el-pagination {
+          &::v-deep li,
+          &::v-deep .btn-prev,
+          &::v-deep .btn-next {
+            background-color: #071f39;
+            color: #4b9bb7;
+          }
+
+          &::v-deep .active {
+            background-color: #409eff;
+            color: #fff;
+          }
+        }
+      }
+    }
+    &::v-deep .warning-row {
+      background-color: #06122c;
+    }
+
+    &::v-deep .success-row {
+      background-color: #071f39;
+    }
+
+    .operationBox {
+      display: flex;
+    }
+
+    .el-divider {
+      background-color: #4b9bb7;
+    }
+    .el-table {
+      color: #4b9bb7;
+      font-size: 10px;
+      .operation {
+        display: flex;
+
+        .line {
+          padding: 0 5px;
+        }
+
+        span:hover {
+          cursor: pointer;
+        }
+      }
+    }
+  }
+}
+</style>
\ No newline at end of file
diff --git a/src/views/systemSetting/device/loudspeaker/components/dialogForm.vue b/src/views/systemSetting/device/loudspeaker/components/dialogForm.vue
new file mode 100644
index 0000000..39a5e0e
--- /dev/null
+++ b/src/views/systemSetting/device/loudspeaker/components/dialogForm.vue
@@ -0,0 +1,256 @@
+<template>
+  <div class="create">
+    <main>
+      <div class="mainContent">
+        <el-form
+          ref="formRef"
+          label-width="140px"
+          :rules="createCarRules"
+          autoComplete="on"
+          :model="form"
+          label-position="right"
+        >
+          <!-- 闊虫煴鍚嶇О -->
+          <el-form-item class="optionItem" label="闊虫煴鍚嶇О:" prop="name">
+            <el-input
+              v-model="form.name"
+              placeholder="璇峰～鍐欓煶鏌卞悕绉�"
+            ></el-input>
+          </el-form-item>
+          <!-- 闊虫煴缂栧彿 -->
+          <el-form-item class="optionItem" label="闊虫煴缂栧彿:" prop="code">
+            <el-input
+              v-model="form.code"
+              placeholder="璇峰～鍐欓煶鏌辩紪鍙�"
+            ></el-input>
+          </el-form-item>
+          <!-- 棰濆害鍔熺巼 -->
+          <el-form-item class="optionItem" label="棰濆害鍔熺巼:" prop="power">
+            <el-input
+              v-model="form.power"
+              placeholder="璇峰～鍐欓搴﹀姛鐜�"
+            ></el-input>
+          </el-form-item>
+          <!-- 棰戠巼鍝嶅簲 -->
+          <el-form-item
+            class="optionItem"
+            label="棰戠巼鍝嶅簲:"
+            prop="frequencyResponse"
+          >
+            <el-input
+              v-model="form.frequencyResponse"
+              placeholder="璇峰～鍐欓鐜囧搷搴�"
+            ></el-input>
+          </el-form-item>
+          <!-- 鍠囧彮鍗曞厓 -->
+          <el-form-item
+            class="optionItem"
+            label="鍠囧彮鍗曞厓:"
+            prop="fullRangeSpeaker"
+          >
+            <el-input
+              v-model="form.fullRangeSpeaker"
+              placeholder="璇峰～鍐� 鍠囧彮鍗曞厓"
+            ></el-input>
+          </el-form-item>
+          <el-form-item>
+            <div class="optionBtn">
+              <el-button
+                type="primary"
+                class="btn submit"
+                @click.native.prevent="handleUpdateLawCar"
+                >纭
+              </el-button>
+            </div>
+          </el-form-item>
+        </el-form>
+      </div>
+    </main>
+  </div>
+</template>
+  <script>
+export default {
+  data() {
+    const checkName = (rule, value, callback) => {
+      if (value) {
+        callback();
+      } else {
+        callback(new Error("闊虫煴鍚嶇О涓嶈兘涓虹┖"));
+      }
+    };
+    const checkCode = (rule, value, callback) => {
+      if (value) {
+        callback();
+      } else {
+        callback(new Error("闊虫煴缂栫爜涓嶈兘涓虹┖"));
+      }
+    };
+    return {
+      form: {
+        id: 0,
+        name: "",
+        code: "",
+        power: "",
+        frequencyResponse: "",
+        fullRangeSpeaker: "",
+      },
+      createCarRules: {
+        name: [
+          {
+            required: true,
+            trigger: "blur",
+            validator: checkName,
+          },
+        ],
+        code: [
+          {
+            required: true,
+            trigger: "blur",
+            validator: checkCode,
+          },
+        ],
+      },
+    };
+  },
+  created() {
+    // 鍒濆鍖栨暟鎹�
+    
+    this.form = JSON.parse(JSON.stringify(this.info));
+  },
+  methods: {
+    // 淇敼鎵ф硶杞�
+    handleUpdateLawCar() {
+      this.$refs.formRef.validate((valid) => {
+        if (valid) {
+          const { form } = this;
+          this.$axios({
+            method: "put",
+            url: "sccg/car_Manage/modification_enforce",
+            data: {
+              ...form,
+            },
+          }).then((res) => {
+            console.log(res);
+            if (res.code === 200) {
+              this.$message({
+                type: "success",
+                message: "淇敼杞﹁締鎴愬姛",
+              });
+              this.$emit("closeDialog", { flag: false, index: 1 });
+            } else {
+              this.$message({
+                type: "error",
+                message: res.message,
+              });
+            }
+          });
+        } else {
+          return false;
+        }
+      });
+    },
+    // 閮ㄩ棬淇敼
+    handleCheck(data, checked) {
+      console.log(data);
+      this.form.departId = data.id;
+      this.form.departName = data.departName;
+      // 鑾峰彇褰撳墠閫夋嫨鐨刬d鍦ㄦ暟缁勪腑鐨勭储寮�
+      const indexs = this.selectOrg.orgsid.indexOf(data.id);
+      // 濡傛灉涓嶅瓨鍦ㄦ暟缁勪腑锛屽苟涓旀暟缁勪腑宸茬粡鏈変竴涓猧d骞朵笖checked涓簍rue鐨勬椂鍊欙紝浠ｈ〃涓嶈兘鍐嶆閫夋嫨銆�
+      if (indexs < 0 && this.selectOrg.orgsid.length === 1 && checked) {
+        this.$message({
+          message: "鍙兘閫夋嫨涓�涓儴闂紒",
+          type: "warning",
+          showClose: true,
+        });
+        // 璁剧疆宸查�夋嫨鐨勮妭鐐逛负false 寰堥噸瑕�
+        this.$refs.tree.setChecked(data, false);
+      } else if (this.selectOrg.orgsid.length === 0 && checked) {
+        // 鍙戠幇鏁扮粍涓虹┖ 骞朵笖鏄凡閫夋嫨
+        // 闃叉鏁扮粍鏈夊�硷紝棣栧厛娓呯┖锛屽啀push
+        this.selectOrg.orgsid = [];
+        this.selectOrg.orgsid.push(data.id);
+      } else if (
+        indexs >= 0 &&
+        this.selectOrg.orgsid.length === 1 &&
+        !checked
+      ) {
+        // 鍐嶆鐩存帴杩涜璧嬪�间负绌烘搷浣�
+        this.selectOrg.orgsid = [];
+        this.form.departName = "";
+      }
+    },
+    // 鑾峰彇閮ㄩ棬鏍�
+    getDepartTree() {
+      this.$axios.get("/sccg/depart/tree").then((res) => {
+        this.departList = res.data;
+      });
+    },
+  },
+  props: ["info", "closeDialog"],
+};
+</script>
+  <style lang="scss" scoped>
+.create {
+  border-radius: 1px;
+  background-color: #09152f;
+
+  main {
+    // border: 1px solid #fff;
+    text-align: left;
+    padding: 0 55px;
+    background-color: #09152f;
+    padding-bottom: 50px;
+
+    .mainContent {
+      display: flex;
+      justify-content: center;
+      padding-top: 50px;
+
+      .el-form-item__content {
+        width: 400px;
+
+        .el-select {
+          width: 100%;
+        }
+      }
+
+      .optionHandleSp {
+        display: flex;
+
+        .areaNumber,
+        .moreNumber {
+          flex: 1;
+        }
+
+        .telNumber {
+          flex: 2;
+        }
+      }
+
+      .optionBtn {
+        display: flex;
+        margin-top: 20px;
+
+        .btn {
+          padding: 12px 50px;
+        }
+      }
+    }
+  }
+
+  &::v-deep .el-textarea__inner {
+    background-color: #09152f;
+    border: 1px solid #17324c;
+  }
+
+  ::v-deep .el-form-item__label {
+    color: #4b9bb7;
+  }
+
+  ::v-deep .el-input__inner {
+    background-color: #09152f;
+    border: 1px solid #17324c;
+  }
+}
+</style>
\ No newline at end of file
diff --git a/src/views/systemSetting/device/loudspeaker/index.vue b/src/views/systemSetting/device/loudspeaker/index.vue
new file mode 100644
index 0000000..de78e41
--- /dev/null
+++ b/src/views/systemSetting/device/loudspeaker/index.vue
@@ -0,0 +1,358 @@
+<template>
+  <div class="list">
+    <header>
+      <div class="header-content">
+        <div class="search">
+          <span style="padding-right: 20px">绛涢�夋潯浠�:</span>
+          <el-select
+            v-model="context"
+            placeholder="绛涢�夋潯浠�"
+            @change="handleStateChange"
+          >
+            <el-option
+              v-for="item in options"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value"
+            >
+            </el-option>
+          </el-select>
+        </div>
+      </div>
+    </header>
+    <main>
+      <div class="main-content">
+        <div class="main-title">
+          <el-button
+            class="el-icon-plus"
+            type="primary"
+            @click="dialogCreate = true"
+            >娣诲姞</el-button
+          >
+        </div>
+        <!-- 鏁版嵁灞曠ず -->
+        <el-table
+          ref="multipleTable"
+          :header-cell-style="{
+            background: '#06122c',
+            'font-size': '12px',
+            color: '#4b9bb7',
+            'font-weight': '650',
+            'line-height': '45px',
+          }"
+          :data="list"
+          style="width: 100%"
+          :row-class-name="tableRowClassName"
+        >
+          <el-table-column type="selection" min-width="5"> </el-table-column>
+          <el-table-column prop="name" label="闊虫煴鍚嶇О" min-width="10">
+          </el-table-column>
+          <el-table-column prop="code" label="闊虫煴缂栧彿" min-width="10">
+          </el-table-column>
+          <el-table-column prop="power" label="棰濆畾鍔熺巼" min-width="10">
+          </el-table-column>
+          <el-table-column
+            prop="frequencyResponse"
+            label="棰戠巼鍝嶅簲"
+            min-width="10"
+          >
+          </el-table-column>
+          <el-table-column
+            prop="fullRangeSpeaker"
+            label="鍠囧彮鍗曞厓"
+            min-width="10"
+          >
+          </el-table-column>
+          <el-table-column
+            prop="state"
+            :formatter="formatSate"
+            label="鐘舵��"
+            min-width="5"
+          >
+          </el-table-column>
+          <el-table-column prop="operation" label="鎿嶄綔" min-width="20">
+            <template slot-scope="scope">
+              <div class="btn">
+                <span @click="handleEdit(scope.row)">缂栬緫</span>
+                <span class="line">|</span>
+                <span @click="handleDelete(scope.row)">鍒犻櫎</span>
+              </div>
+            </template>
+          </el-table-column>
+        </el-table>
+
+        <!-- tools -->
+        <div class="tools">
+          <div class="funs"></div>
+          <div class="pagination">
+            <el-pagination
+              background
+              :current-page="currentPage"
+              layout="prev, pager, next"
+              :total="totalNum"
+              :page-size="pageSize"
+              @current-change="changeCurrentPage"
+              @prev-click="handlePrev"
+              @next-click="handleNext"
+            >
+            </el-pagination>
+          </div>
+        </div>
+      </div>
+    </main>
+    <footer>
+      <!-- 娣诲姞闊虫煴 -->
+      <el-dialog
+        title="娣诲姞闊虫煴"
+        :visible.sync="dialogCreate"
+        width="60%"
+        v-if="dialogCreate"
+        :before-close="handleClose"
+      >
+        <MyForm :info="loudspeakerInfo" :closeDialog="null"></MyForm>
+      </el-dialog>
+    </footer>
+  </div>
+</template>
+  <script>
+import { createNamespacedHelpers } from "vuex";
+const { mapActions } = createNamespacedHelpers("loudspeaker");
+import MyForm from "./components/dialogForm.vue";
+
+export default {
+  components: {
+    MyForm,
+  },
+  data() {
+    return {
+      dialogCreate: false,
+      context: null,
+      options: [
+        {
+          value: null,
+          label: "鍏ㄩ儴",
+        },
+        {
+          value: 1,
+          label: "鍦ㄧ嚎",
+        },
+        {
+          value: 0,
+          label: "绂荤嚎",
+        },
+      ],
+      list: [],
+      totalNum: 0,
+      pageSize: 10,
+      currentPage: 1,
+      renderFlag: false,
+      loudspeakerInfo: {
+        id: 0,
+        name: "",
+        code: "",
+        power: "",
+        frequencyResponse: "",
+        fullRangeSpeaker: "",
+      },
+    };
+  },
+  created() {
+    this.setTableData();
+  },
+  methods: {
+    ...mapActions([
+      "getLoudspeakerList",
+      "saveLoudspeaker",
+      "updateLoudspeaker",
+    ]),
+    handleEdit(row) {
+      this.loudspeakerInfo = row;
+      this.dialogCreate = true;
+    },
+    handleDelete(row) {},
+    formatSate(row, column) {
+      return row.state == 1 ? "鍦ㄧ嚎" : "绂荤嚎";
+    },
+
+    // 璁剧疆琛ㄦ牸鏂戦┈绾�
+    tableRowClassName({ row, rowIndex }) {
+      if ((rowIndex + 1) % 2 == 0) {
+        return "warning-row";
+      } else {
+        return "success-row";
+      }
+      return "";
+    },
+    // 寮圭獥鍏抽棴
+    handleClose(done) {
+      this.$confirm("纭鍏抽棴?").then((_) => {
+        done();
+      });
+    },
+    // 璁剧疆tableData
+    setTableData() {
+      const { currentPage, pageSize, context } = this;
+      this.getLoudspeakerList({
+        currentPage,
+        pageSize,
+        state: context,
+      }).then((res) => {
+        if (res.data.code == 200) {
+          this.list = res.data.data.records;
+          this.totalNum = res.data.data.total;
+        }
+      });
+    },
+    handleStateChange(e) {
+      this.setTableData();
+    },
+    // 褰撳墠椤垫敼鍙樿Е鍙戜簨浠�
+    changeCurrentPage(page) {
+      this.currentPage = page;
+      this.setTableData();
+    },
+    // 涓婁竴椤电偣鍑讳簨浠�
+    handlePrev(page) {
+      this.currentPage = page;
+      this.setTableData();
+    },
+    // 涓嬩竴椤电偣鍑讳簨浠�
+    handleNext(page) {
+      this.currentPage = page;
+      this.setTableData();
+    },
+  },
+};
+</script>
+  <style lang="scss" scoped>
+.list {
+  text-align: left;
+  margin: 10px 20px;
+  color: #4b9bb7;
+
+  header {
+    background-color: #09152f;
+    border: 1pox solid #fff;
+
+    .header-content {
+      padding: 0 40px;
+      display: flex;
+      line-height: 100px;
+      justify-content: space-between;
+      align-items: center;
+
+      .search {
+        display: flex;
+        justify-content: flex-start;
+
+        span {
+          flex: 1;
+        }
+
+        .el-input {
+          flex: 2;
+          color: #1d3f57;
+
+          &::v-deep .el-input__inner {
+            background-color: #09152f;
+            border: 1px solid #17324c;
+          }
+        }
+      }
+    }
+  }
+
+  main {
+    background-color: #09152f;
+    margin-top: 20px;
+    padding-bottom: 50px;
+    border: 1pox solid #fff;
+
+    .main-title {
+      line-height: 60px;
+      padding: 10px 20px;
+    }
+
+    .tools {
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      padding: 0 20px;
+
+      .funs {
+        display: flex;
+
+        .funsItem {
+          line-height: 28px;
+          display: flex;
+          align-items: center;
+          border: 1px solid #17324c;
+          border-radius: 4px;
+          font-size: 12px;
+          margin-left: 10px;
+
+          .el-checkbox {
+            width: 80px;
+            padding: 0 10px;
+          }
+
+          .el-select {
+            width: 120px;
+          }
+
+          &::v-deep .el-input__inner {
+            border: none;
+            background-color: #09152f;
+          }
+
+          &:hover {
+            border: 1px solid #4b9bb7;
+          }
+
+          &:hover .el-checkbox {
+            color: #4b9bb7;
+          }
+        }
+      }
+
+      .pagination {
+        margin-top: 50px;
+        display: flex;
+        line-height: 50px;
+        justify-content: center;
+
+        .el-pagination {
+          &::v-deep li,
+          &::v-deep .btn-prev,
+          &::v-deep .btn-next {
+            background-color: #071f39;
+            color: #4b9bb7;
+          }
+
+          &::v-deep .active {
+            background-color: #409eff;
+            color: #fff;
+          }
+        }
+      }
+    }
+
+    .el-table {
+      color: #4b9bb7;
+      font-size: 10px;
+
+      .operation {
+        display: flex;
+
+        .line {
+          padding: 0 5px;
+        }
+
+        span:hover {
+          cursor: pointer;
+        }
+      }
+    }
+  }
+}
+</style>
\ No newline at end of file

--
Gitblit v1.8.0